Angular Snipets

Create a new project with SCSS & service Worker

ng new NAMEOFYOURPROJECT --service-worker --routing --style=scss

Install Bootstrap

npm i bootstrap jquery popper.js --save

manifest.json

{
    "short_name": "WEPONG",
    "name": "Angular 5.0 Hacker News PWA",
    "start_url": "/",
    "theme_color": "#f48c5b",
    "background_color": "#ffffff",
    "display": "standalone",
    "orientation": "portrait",
    "icons": [
        {
            "src": "/assets/icons/android-chrome-512x512.png",
            "sizes": "512x512",
            "type": "image/png"
        }
    ]
}

index.html

  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link rel="manifest" href="/manifest.json">

  <meta name="mobile-web-app-capable" content="yes">
  <meta name="theme-color" content="#69449b">
  

      <div class="splash"  id="content">
        <img src="/assets/icons/logo.svg" width="256px" alt="Angular5 PWA logo">
        <h1>Hacker News PWA...</h1>
     </div>
  
    
    <noscript>
        <p>
          Sorry, JavaScript must be enabled to use this app
        </p>
    </noscript>

Add Bootstrap4

Install the package

npm install --save bootstrap@next

References

https://github.com/angular/angular-cli

https://medium.com/codingthesmartway-com-blog/building-an-angular-5-project-with-bootstrap-4-and-firebase-4504ff7717c1