{"id":14976569,"url":"https://github.com/chrisalexander55/ecmascript-sass-webpack-starter","last_synced_at":"2025-10-27T20:32:11.926Z","repository":{"id":57219307,"uuid":"100886288","full_name":"chrisalexander55/ecmascript-sass-webpack-starter","owner":"chrisalexander55","description":"Starter/Boilerplate project for a web application requiring EcmaScript (6/7), Webpack (3.X) and Sass (4.X) - optionally served from a lightly configured Docker container.","archived":false,"fork":false,"pushed_at":"2017-09-16T17:05:42.000Z","size":539,"stargazers_count":3,"open_issues_count":1,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-02-01T08:06:42.318Z","etag":null,"topics":["boilerplate","docker-container","ecmascript","ecmascript2015","ecmascript2016","es2015","es2016","es6","es7","sass","scss","starter","starter-project","starter-template","webpack","webpack3"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chrisalexander55.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-08-20T20:14:51.000Z","updated_at":"2018-04-10T16:57:08.000Z","dependencies_parsed_at":"2022-08-28T23:22:34.544Z","dependency_job_id":null,"html_url":"https://github.com/chrisalexander55/ecmascript-sass-webpack-starter","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisalexander55%2Fecmascript-sass-webpack-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisalexander55%2Fecmascript-sass-webpack-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisalexander55%2Fecmascript-sass-webpack-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chrisalexander55%2Fecmascript-sass-webpack-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chrisalexander55","download_url":"https://codeload.github.com/chrisalexander55/ecmascript-sass-webpack-starter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238553317,"owners_count":19491406,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["boilerplate","docker-container","ecmascript","ecmascript2015","ecmascript2016","es2015","es2016","es6","es7","sass","scss","starter","starter-project","starter-template","webpack","webpack3"],"created_at":"2024-09-24T13:54:04.883Z","updated_at":"2025-10-27T20:32:11.523Z","avatar_url":"https://github.com/chrisalexander55.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ecmascript-sass-webpack-starter\n\n[![license](https://img.shields.io/github/license/chrisalexander55/ecmascript-sass-webpack-starter.svg)](https://github.com/chrisalexander55/ecmascript-sass-webpack-starter/blob/master/LICENSE)\n[![npm](https://img.shields.io/npm/v/ecmascript-sass-webpack-starter.svg?maxAge=2592000?style=flat-square)](https://www.npmjs.com/package/ecmascript-sass-webpack-starter)\n[![node](https://img.shields.io/badge/node-%3E%3D6.0.0-brightgreen.svg)](https://github.com/chrisalexander55/ecmascript-sass-webpack-starter)\n[![David](https://img.shields.io/david/chrisalexander55/ecmascript-sass-webpack-starter.svg?maxAge=2592000?style=flat-square)](https://github.com/chrisalexander55/ecmascript-sass-webpack-starter/blob/master/package.json)\n[![David](https://img.shields.io/david/dev/chrisalexander55/ecmascript-sass-webpack-starter.svg?maxAge=2592000?style=flat-square)](https://github.com/chrisalexander55/ecmascript-sass-webpack-starter/blob/master/package.json)\n[![GitHub issues](https://img.shields.io/github/issues/chrisalexander55/ecmascript-sass-webpack-starter.svg)](https://github.com/chrisalexander55/ecmascript-sass-webpack-starter/issues)\n[![GitHub pull requests](https://img.shields.io/github/issues-pr/chrisalexander55/ecmascript-sass-webpack-starter.svg)](https://github.com/chrisalexander55/ecmascript-sass-webpack-starter/pulls)\n\n## Overview\n\nStarter/boilerplate project for a web application requiring ECMAScript (6/7), Webpack (3.X) and Sass (4.X) - optionally served from a lightly configured Docker container. The project is particularly helpful for craftsmen/craftswomen demanding more control of their frontend stack and tired of the growing bloat and complexity of today's Franken-frameworks.\n\n\u003e This repository is inspired from [micooz/es6-webpack2-starter](https://github.com/micooz/es6-webpack2-starter).\n\n## Features\n\nThe project supports the following \"out-of-box\" features:\n\n* Multiple Entry Points, Multiple Pages\n* EcmaScript (Babel (6.X) and ESLint)\n* SASS (4.X, Stylelint)\n* Webpack (3.X, dashboard, dev-server)\n* Google Lighthouse (performance/best-practice profiling)\n* Progressive Web Application (PWA) compliance\n* Testing (Mocha, Chai, Istanbul)\n* Documentation (JsDoc)\n* Docker Container (optional)\n\n## Installation\n\nWindows platform users should install [GitBash](https://git-scm.com/downloads) before continuing so you can use Unix terminal commands.\n\n### Docker Container (Optional)\n\nIf you haven't already done so, install [Docker](https://www.docker.com/) on you host OS. Windows \u003c=7 users need to install [Docker Toolbox](https://www.docker.com/products/docker-toolbox). If you have any issues, hit-up the Docker forums or SO.\n\nThe latest [official Node image](https://hub.docker.com/_/node/) from the [Node.js Foundation](https://nodejs.org) is used by the container. Edit the Dockerfile as you see fit.\n\n```bash\n# build and start container\n$ . ./run.sh\n\n# this will dump you on the commandline inside the container\n```\n\n### Project Hydration\n\n```bash\n$ git clone https://github.com/chrisalexander55/ecmascript-sass-webpack-starter.git\n$ cd ecmascript-sass-webpack-starter\n$ npm i\n```\n\nAfter installation, you will see this directory structure:\n\n```bash\n|- webpack/                        # webpack config dir\n|- src\n   |- robots.txt\n   |- test/                        # test dir\n   |- app\n       |- assets\n       |   |- platform/            # icons + platform config dir\n       |- modules\n       |   |- index/               # index modules dir\n       |   |- shared/              # shared modules dir\n       |   |- some-page-1/         # some-page-1 modules dir\n       |   |- some-page-2/         # some-page-2 modules dir\n       |   |- not-found/           # not-found modules dir\n       |   |- not-supported/       # not-supported modules dir\n       |- pages\n       |   |- some-page-1.html\n       |   |- some-page-2.html\n       |- sass\n       |   |- main.scss            # for global styles\n       |- index.html               # default page\n       |- not-found.html           # 404\n       |- not-supported.html       # browser doesn't meet required features\n```\n\n## Configuration\n\n```bash\n# run just to ensure env.js was created (it may silently fail)\n$ npm run postinstall\n\n# edit env.js per your environment needs\n\n# 1. development\n# - edit src/app/modules/shared/proxy/config.js to hit API resources you need\n\n# 1a. starts up the webpack-dev-server from host OS + launches browser pointing to http://localhost:3000/index.html\n$ npm run start:host\n\n# 1b. starts up the weback-dev-server from container\n# on your host OS, open your favorite web browser and point to url http://localhost:3000\n$ npm run start:container\n\n# 2. production\n# outputs into dist/ directory\n$ npm run build\n```\n\nDistribution directory structure will look like this after transpilation:\n\n```bash\ndist\n |- css/\n |- modules/\n |- pages/\n |- platform/\n |- index.html\n |- not-found.html\n |- not-supported.html\n |- robots.txt\n```\n\n## Testing (WIP)\n\n\u003e Not working coverage yet but present if you need it now.\n\nTests have a single entry point via `src/test/index.js` and leverage Mocha and Chai (Should) with Istanbul coverage reporting.\n\n```bash\n$ npm test\n```\n\n## Documentation\n\nGenerate documentation based on [JsDoc](https://github.com/jsdoc3/jsdoc) formated code comments:\n\n```bash\n# outputs into docs/ directory; open index.html\n$ npm run docs\n```\n\n## Header Element\n\nI know, \"Dude, you talking to me about the HTML Header element?\" Yes, I am because I've seen too often how under utilized it is in helping developers/organizations delivery the best possible user experience, device support and SEO. Configured right, the HTML Header is powerful!\n\n### Base Feature Support\n\nStandard tags/attributes cover:\n\n* Security\n* Caching\n* Geolocation\n* Site ownership verification\n* Telephone number formating\n\n### Social Media Coverage\n\nIf you need to share content tailored for social media platforms, either statically or via a SPA page, the platforms covered include:\n\n* Facebook\n* Google\n* Pinterest\n\n### Progressive Web Application (PWA) Support\n\nGenerally, developers are aware of the native JavaScript APIs and polyfills related to PWAs but most are not aware that markup must also be configured for an valid and performant implementation.\n\n#### Platform Coverage\n\nPlatform-specific meta tags/attributes covered include:\n\n* iOS\n* Android/Chrome\n* Windows\n\n#### Template\n\nHere is the recommended header element that can be cut-n-pasted and edited to fit your needs, full/partial SPA or non-SPA.\n\n```html\n\u003chead\u003e\n    \u003c!-- \n    #############################################################\n    Order is important, including href placement! Edit as needed!\n    #############################################################\n   --\u003e\n  \u003cmeta charset=\"utf-8\"\u003e\n  \u003cmeta http-equiv=\"x-ua-compatible\" content=\"ie=edge\"\u003e\n  \u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\"\u003e\n\n  \u003c!-- \n    ########## START: Tag Base Feature Support ##########\n   --\u003e\n  \n  \u003c!-- security related --\u003e\n  \u003cmeta http-equiv=\"Content-Security-Policy\" content=\"default-src https:; object-src 'none'; img-src 'self' [url]\"; script-src 'self'; style-src 'self'; frame-ancestors 'none'\u003e\n  \u003cmeta http-equiv=\"Strict-Transport-Security\" content=\"max-age=63072000\"\u003e\n  \u003cmeta http-equiv=\"X-Content-Type-Options\" content=\"nosniff\"\u003e\n  \u003cmeta http-equiv=\"Window-Target\" content=\"_value\"\u003e\n  \n  \u003c!-- Name of web application (only should be used if the website is used as an app) --\u003e\n  \u003cmeta name=\"application-name\" content=\"Application Name\"\u003e\n  \n  \u003c!-- Short description of the page (limit to 150 characters) --\u003e\n  \u003cmeta name=\"description\" content=\"A description of the page\"\u003e\n  \n  \u003c!-- Tells Google not to show the sitelinks search box --\u003e\n  \u003cmeta name=\"google\" content=\"nositelinkssearchbox\"\u003e\n  \n  \u003c!-- Tells Google not to provide a translation for this page --\u003e\n  \u003cmeta name=\"google\" content=\"notranslate\"\u003e\n  \n  \u003c!-- Verify ownership for Google Search Console --\u003e\n  \u003cmeta name=\"google-site-verification\" content=\"verification_token\"\u003e\n  \n  \u003c!-- Verify ownership for Yandex Webmasters --\u003e\n  \u003cmeta name=\"yandex-verification\" content=\"verification_token\"\u003e\n  \n  \u003c!-- Verify ownership for Bing Webmaster Center --\u003e\n  \u003cmeta name=\"msvalidate.01\" content=\"verification_token\"\u003e\n  \n  \u003c!-- Verify ownership for Alexa Console --\u003e\n  \u003cmeta name=\"alexaVerifyID\" content=\"verification_token\"\u003e\n  \n  \u003c!-- Verify ownership for Pinterest Console--\u003e\n  \u003cmeta name=\"p:domain_verify\" content=\"verification_token\"\u003e\n  \n  \u003c!-- Verify ownership for Norton Safe Web --\u003e\n  \u003cmeta name=\"norton-safeweb-site-verification\" content=\"verification_token\"\u003e\n  \n  \u003c!-- Short description of your site's subject --\u003e\n  \u003cmeta name=\"subject\" content=\"your website's subject\"\u003e\n  \n  \u003c!-- Gives a general age rating based on site content --\u003e\n  \u003cmeta name=\"rating\" content=\"general|mature|restricted|14 years|safe for kids\"\u003e\n  \n  \u003c!-- Allows control over how referrer information is passed --\u003e\n  \u003c!-- I recommend 2 values for new apps no-referrer|none-when-downgrade --\u003e\n  \u003cmeta name=\"referrer\" content=\"no-referrer\"\u003e\n  \n  \u003c!-- Disable automatic detection and formatting of possible phone numbers --\u003e\n  \u003cmeta name=\"format-detection\" content=\"telephone=no\"\u003e\n  \n  \u003c!-- Completely opt out of DNS prefetching by setting to 'off' --\u003e\n  \u003c!-- for more info: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-DNS-Prefetch-Control --\u003e\n  \u003cmeta http-equiv=\"x-dns-prefetch-control\" content=\"off\"\u003e\n  \n  \u003c!-- Geo tags --\u003e\n  \u003c!-- applicable if site represents a physical location, like a shop, agency, ect. --\u003e\n  \u003cmeta name=\"ICBM\" content=\"latitude, longitude\"\u003e\n  \u003cmeta name=\"geo.position\" content=\"latitude;longitude\"\u003e\n  \u003cmeta name=\"geo.region\" content=\"country[-state]\"\u003e\u003c!-- Country code (ISO 3166-1): mandatory, state code (ISO 3166-2): optional; eg. content=\"US\" / content=\"US-NY\" --\u003e\n  \u003cmeta name=\"geo.placename\" content=\"city/town\"\u003e\u003c!-- eg. content=\"New York City\" --\u003e\n\n  \u003c!-- \n  ########## END: Tag Base Feature Support ##########\n  --\u003e\n\n\n  \u003c!-- \n  ########## Start: Tag Platform Feature Support ##########\n  --\u003e\n\n  \u003c!-- %%%% iOS %%%%\n    1. https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW1\n    2. https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html\n    3. https://developer.apple.com/ios/human-interface-guidelines/graphics/launch-screen/ \n  --\u003e\n  \u003cmeta name=\"apple-mobile-web-app-title\" content=\"[Prudential Financial]\"\u003e \u003c!-- launch icon title --\u003e\n  \u003cmeta name=\"apple-mobile-web-app-capable\" content=\"yes\"\u003e \u003c!-- hides address bar and status bar =\u003e native application feel --\u003e\n  \u003cmeta name=\"apple-mobile-web-app-status-bar-style\" content=\"[black-translucent|default|some-color]\"\u003e \u003c!-- Only works if apple-mobile-web-app-capable is set --\u003e\n  \u003cmeta name=\"format-detection\" content=\"telephone=no\"\u003e\n  \u003c!-- Deep App linking --\u003e\n  \u003cmeta name=\"apple-itunes-app\" content=\"app-id=[APP-ID], app-argument=[http/url-sample.com]\"\u003e\n\n  \u003c!-- %%%% Google %%%% --\u003e\n  \u003c!-- Android --\u003e\n  \u003cmeta name=\"theme-color\" content=\"[#HEXCOLOR]\"\u003e\n  \u003c!-- Add to home screen; see https://developers.google.com/web/fundamentals/engage-and-retain/app-install-banners/ --\u003e\n  \u003cmeta name=\"mobile-web-app-capable\" content=\"yes\"\u003e\n  \u003c!-- App Deep Linking --\u003e\n  \u003cmeta name=\"google-play-app\" content=\"app-id=[package-name]\"\u003e\n  \u003c!-- Native App Appearance --\u003e\n  \u003cmeta name=\"mobile-web-app-capable\" content=\"yes\"\u003e\n\n  \u003c!-- %%%% Windows %%%% --\u003e\n  \u003c!-- Pinned site \u003c IE 11 (https://msdn.microsoft.com/en-us/library/dn255024(v=vs.85).aspx) --\u003e\n  \u003cmeta name=\"application-name\" content=\"[Prudential Financial]\"\u003e\n  \u003cmeta name=\"msapplication-tooltip\" content=\"[YOUR TOOLTIP HERE]\"\u003e\n  \u003cmeta name=\"msapplication-starturl\" content=\"[http://example.com/index.html?pinned=true]\"\u003e\n  \u003cmeta name=\"msapplication-navbutton-color\" content=\"[#HEXCOLOR]\"\u003e\n  \u003cmeta name=\"msapplication-window\" content=\"width=800;height=600\"\u003e\n  \u003cmeta name=\"msapplication-task\" content=\"name=[Task 1];action-uri=[http://host/Page1.html];icon-uri=[http://host/icon1.ico]\"\u003e\n  \u003cmeta name=\"msapplication-task\" content=\"name=[Task 2];action-uri=[http://microsoft.com/Page2.html];icon-uri=[http://host/icon2.ico]\"\u003e\n  \u003cmeta name=\"msapplication-task-separator\" content=\"1\"\u003e\n  \u003cmeta name=\"msapplication-badge\" value=\"frequency=[NUMBER_IN_MINUTES];polling-uri=[http://example.com/path/to/file.xml]\"\u003e\n  \u003cmeta name=\"msapplication-TileColor\" content=\"#FF3300\"\u003e\n  \u003cmeta name=\"msapplication-TileImage\" content=\"platform/windows/tile.jpg\"\u003e\n  \u003c!-- Pinned IE 11 Live Tiles (https://msdn.microsoft.com/en-us/library/bg183312(v=vs.85).aspx) --\u003e\n  \u003cmeta name=\"msapplication-square70x70logo\" content=\"platform/windows/tile-70x70.png\" /\u003e\n  \u003cmeta name=\"msapplication-square150x150logo\" content=\"platform/windows/tile-150x150.png\" /\u003e\n  \u003cmeta name=\"msapplication-wide310x150logo\" content=\"platform/windows/tile-310x150.png\" /\u003e\n  \u003cmeta name=\"msapplication-square310x310logo\" content=\"platform/windows/tile-310x310.png\" /\u003e\n\n  \u003cmeta name=\"msapplication-config\" content=\"platform/windows/browserconfig.xml\"\u003e\n  \u003c!-- matches the 2 pinned site tasks above from msapplication-task tag --\u003e\n  \u003cmeta name=\"msapplication-notification\" content=\"frequency=[NUMBER_IN_SECONDS];polling-uri=[http://example.com/livetile];polling-uri2=[http://example.com/livetile2]\"\u003e\n\n  \u003c!-- Facebook Open Graph (static or dynamically set; if dynamic, pre-render, then serve) --\u003e\n  \u003cmeta property=\"fb:app_id\" content=\"123456789\"\u003e\n  \u003cmeta property=\"og:url\" content=\"https://example.com/page.html\"\u003e\n  \u003cmeta property=\"og:type\" content=\"website\"\u003e\n  \u003cmeta property=\"og:title\" content=\"Content Title\"\u003e\n  \u003cmeta property=\"og:image\" content=\"https://example.com/image.jpg\"\u003e\n  \u003cmeta property=\"og:description\" content=\"Description Here\"\u003e\n  \u003cmeta property=\"og:site_name\" content=\"Site Name\"\u003e\n  \u003cmeta property=\"og:locale\" content=\"en_US\"\u003e\n  \u003cmeta property=\"article:author\" content=\"\"\u003e\n\n  \u003c!-- Facebook Instant Articles (static or dynamically set; if dynamic, pre-render, then serve) --\u003e\n  \u003cmeta property=\"op:markup_version\" content=\"v1.0\"\u003e\n  \u003c!-- The style to be used for this article --\u003e\n  \u003cmeta property=\"fb:article_style\" content=\"myarticlestyle\"\u003e\n\n  \u003c!-- %%%% 3rd-Party Tool Tags Here %%%% --\u003e\n\n  \u003cmeta name=\"description\" content=\"[YOUR DESCRIPTION HERE]\"\u003e\n  \n  \u003c!-- \n    ########## END: Tag Platform Feature Support ##########\n  --\u003e\n\n\n  \u003c!-- \n    ########## Start: Links + Platform Features ##########\n  --\u003e\n\n  \u003c!-- %%%% UA directives %%%% --\u003e\n  \u003c!-- Origin that will be used to fetch resources, the UA \"should\" resolve as early as possible; https://www.w3.org/TR/resource-hints/#dns-prefetch --\u003e\n  \u003clink href=\"//some-origin.com\" rel=\"dns-prefetch\"\u003e\n  \u003c!-- Initiate early connection (DNS, TCP handshake and optional TLS negotiation) to origin; https://www.w3.org/TR/resource-hints/#preconnect --\u003e\n  \u003clink href=\"https://some-origin.com\" rel=\"preconnect\"\u003e\n  \u003c!-- Instructs origin to retrieve resource without blocking main thread; https://www.w3.org/TR/preload/  --\u003e\n  \u003clink href=\"https://some-origin.com/[webfonts|some-large-asset]\" rel=\"preload\" as=\"[font|audio|document|embed|fetch|image|object|script|style|tract|worker|video]\" type=\"[MIME-TYPE]\" media=\"[media-type|media-query]\"\u003e\n\n  \u003c!-- default icon --\u003e\n  \u003clink href=\"platform/favicon.ico\" rel=\"icon\" type=\"image/x-icon\"\u003e\n\n  \u003c!-- Facebook Instant Articles --\u003e\n  \u003clink href=\"[URL/TO/ARTICLE.HTML]\" rel=\"canonical\"\u003e\n\n  \u003c!-- %%%% Windows %%%% --\u003e\n  \u003c!-- Windows IE11, Edge icons --\u003e\n  \u003clink href=\"platform/windows/favicon-16x16.png\" rel=\"icon\" type=\"image/png\" sizes=\"16x16\"\u003e\n  \u003clink href=\"platform/windows/favicon-32x32.png\" rel=\"icon\" type=\"image/png\" sizes=\"32x32\"\u003e\n  \u003clink href=\"platform/windows/favicon-96x96.png\" rel=\"icon\" type=\"image/png\" sizes=\"96x96\"\u003e\n  \u003c!-- Windows Tile UI  --\u003e\n  \u003c!-- See file platform/windows/browserconfig.xml --\u003e\n\n  \u003c!-- %%%% iOS %%%% --\u003e\n  \u003c!-- Apple icons --\u003e\n  \u003clink href=\"platform/ios/apple-icon-120x120.png\" rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"120x120\"\u003e \u003c!-- iPhone --\u003e\n  \u003clink href=\"platform/ios/apple-icon-152x152.png\" rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"152x152\"\u003e \u003c!-- iPad, iPad mini --\u003e\n  \u003clink href=\"platform/ios/apple-icon-167x167.png\" rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"167x167\"\u003e \u003c!-- iPad Pro --\u003e\n  \u003clink href=\"platform/ios/apple-icon-180x180.png\" rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\"\u003e \u003c!-- iPhone --\u003e\n  \u003c!-- Related to iOS apple-itunes-app App deep linking above --\u003e\n  \u003clink href=\"ios-app://[APP-ID]/http/[url-sample.com]\" rel=\"alternate\"\u003e\n  \u003c!-- For Safari pinned tabs; see https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/pinnedTabs/pinnedTabs.html --\u003e\n  \u003clink href=\"platform/ios/safari-pinned-icon.svg\" rel=\"mask-icon\" type=\"image/svg+xml\" color=\"[COLORNAME]\"\u003e\n\n  \u003c!-- %%%% Android/Chrome %%%% --\u003e\n  \u003c!-- Android icons --\u003e\n  \u003clink href=\"platform/android/android-icon-192x192.png\" rel=\"icon\" type=\"image/png\" sizes=\"192x192\"\u003e \u003c!-- home screen icon --\u003e\n  \u003c!-- Related to Android google-play-app App deep linking above --\u003e\n  \u003clink href=\"android-app://[package-name/http/url-sample.com]\" rel=\"alternate\"\u003e\n  \u003c!-- Supported by Chrome Mobile (Android Only) + Opera; see https://developer.mozilla.org/en-US/docs/Web/Manifest --\u003e\n  \u003clink href=\"platform/site.manifest.json\" rel=\"manifest\"\u003e\n\n  \u003c!-- Refer to a copyright statement --\u003e\n  \u003clink href=\"[URL/TO/COPYRIGHT.HTML]\" rel=\"license\"\u003e\n\n  \u003c!-- \n    ########## END: Links + Platform Features ##########\n  --\u003e\n\n\n  \u003c!-- \n    ########## START: Scripts ##########\n  --\u003e\n\n  \u003c!-- Scripts (generally, preload \u003e async) --\u003e\n  \u003cscript src=\"https://origin.com/my-script.min.js\" async|defer type=\"[text/javascript|module]\"\u003e\u003c/script\u003e\n\n  \u003cnoscript\u003e\u003c/noscript\u003e\n\n  \u003c!-- \n    ########## END: Scripts ##########\n  --\u003e\n\n  \u003ctitle\u003e\u003c/title\u003e\n\u003c/head\u003e\n```\n\n\u003e Big props go out to the maintainers at [GetHead.Info](http://gethead.info/). If your technical understanding of the Head element, and its siblings, is thin, I strongly encourage you visit their site to bulk-up your knowledge!\n\n## Helpers\n\nOther stuff I've found helpful...\n\n### Port Management\n\n```bash\n# strictly unix-based, of course...\n\n# list all open ports\n$ netstat -nat | grep LISTEN\n\n# list pids associated with a specfic port\n$ lsof -ti tcp:[PORT_NUMBER]\n\n# kill a pid\n$ kill -9 [PID]\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchrisalexander55%2Fecmascript-sass-webpack-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchrisalexander55%2Fecmascript-sass-webpack-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchrisalexander55%2Fecmascript-sass-webpack-starter/lists"}