[email protected] / admin123
[email protected] / demo123
[email protected] / test123

npm start 
npm run start:server

assets/mockdata folder

1. ng lint
2. ng test

git stash ---------- save you local changes
git pull ----------- pull the master branch changes
git stash apply -------- merge local changes with master branch changes
git add .
git commit -m "message“ -------- commit local changes to stage
git commit -m "message" --no-verify -------- forcefully commit local changes to stage
git push -u origin master -------- push local changes to master branch
git checkout –b <branch_name> -------- create new branch and move to that new branch
git checkout <branch_name> -------- move to that branch
git merge master -------- merge your changes of master branch to current branch

@angular-devkit/build-angular: this is the one to build an Angular application, now a required dependency in your CLI projects.

https://medium.com/@maison.moa/using-jwt-json-web-tokens-to-authorize-users-and-protect-api-routes-3e04a1453c3e

"schematics": {
        "@schematics/angular:component": {
          "styleext": "scss"
        }
},

"styles": [
              "src/styles.scss"
          ],

"compilerOptions": {
        "baseUrl": "src", // This must be specified if "paths" is.
         ...
        "paths": {
          "@ecommerce/auth/*": ["./app/auth/*"],
          "@ecommerce/service/*": ["./app/service/*"],
          "@ecommerce/directives/*": ["./app/directives/*"],
          "@ecommerce/constants/*": ["./app/constants/*"],
          "@ecommerce/interfaces/*": ["./app/interfaces/*"],
          "@ecommerce/settings/*": ["./app/settings/*"],
          "@ecommerce/pipe/*": ["./app/pipe/*"],
          "@ecommerce/shared/*": ["./app/shared/*"],
          "@ecommerce/css/*": ["./app/assets/css/*"],
          "@ecommerce/images/*": ["./app/assets/images/*"],
        },

import { Yo } from '@config/index';

npm install husky --save-dev

"husky": {
    "hooks": {
      "pre-commit": "npm run lint",
      "pre-push": "npm run lint"
    }
}

git commit -m "first commit" --no-verify

"precommit": "ng lint && npm test",
"prepush": "ng lint && ng build --aot true && npm test"

ng add @angular/pwa@v6-lts

ng build --prod

http-server -p 8081 -c-1 dist/ecommerce

import { Injectable, isDevMode } from '@angular/core';

@Injectable({
    providedIn: 'root'
  })

export class AppConfig {
    apiEndpoint: string;
    API_CATEGORY_PATH: string;
    API_CONTENT_PATH: string;
    API_PRODUCT_LIST_PATH: string;
    API_PRODUCT_DETAILS_PATH: string;
    API_PRODUCT_ADD_PATH: string;
    API_PRODUCT_DELETE_PATH: string;
    API_REGISTER_PATH: string;
    API_LOGIN_PATH: string;
    API_CART_PATH: string;
    API_CART_CHECK_PRODUCT: string;
    API_CART_ADD_PRODUCT_QUANTITY: string;
    API_CART_DELETE_PRODUCT_QUANTITY: string;
    API_CART_REMOVE_PRODUCT: string;
    API_CUSTOMERSBYYEAR: string;
    API_CUTOMERSBYGENDER: string;
    API_PRODUCTSBYCATEGORY: string;
    IMAGE_PATH: string;
    ERROR_MSG_PATH: string;
    VALIDATION_ERROR_MSG_PATH: string;

    envDevMode: Boolean;

    constructor() {
        console.log('Environment in Development mode => ', isDevMode());
        this.envDevMode = isDevMode();
        if (this.envDevMode) {
            this.apiEndpoint = 'http://localhost:3000/';
        } else {
            this.apiEndpoint = 'https://piyali-ecommerce.herokuapp.com/';
        }
        this.API_CATEGORY_PATH = 'api/categories';
        this.API_CONTENT_PATH = 'api/content';
        this.API_PRODUCT_LIST_PATH = 'api/products';
        this.API_PRODUCT_DETAILS_PATH = 'api/products/productdetails';
        this.API_PRODUCT_ADD_PATH = '';
        this.API_PRODUCT_DELETE_PATH = '';
        this.API_REGISTER_PATH = 'api/auth/register';
        this.API_LOGIN_PATH = 'api/auth/login';
        this.API_CART_PATH = 'api/cart';
        this.API_CART_CHECK_PRODUCT = 'api/cart/check';
        this.API_CART_ADD_PRODUCT_QUANTITY = 'api/cart/addqty';
        this.API_CART_DELETE_PRODUCT_QUANTITY = 'api/cart/deleteqty';
        this.API_CART_REMOVE_PRODUCT = 'api/cart/removeprod';
        this.API_CUSTOMERSBYYEAR = 'api/admin/customersbyyear';
        this.API_CUTOMERSBYGENDER = 'api/admin/customersbygender';
        this.API_PRODUCTSBYCATEGORY = 'api/admin/productsbycategory';
        this.IMAGE_PATH = 'images/products/';
        this.ERROR_MSG_PATH = 'api/errors';
        this.VALIDATION_ERROR_MSG_PATH = 'api/validationerrors';
    }
}

if (isDevMode()) {
      console.log('👋 Development!');
    } else {
      console.log('💪 Production!');
    
    }
}

import { DOCUMENT } from '@angular/common';
import { Component, PLATFORM_ID, Inject } from '@angular/core';
import { isPlatformBrowser, isPlatformServer } from '@angular/common';

@Component({ 
    ... 
})
export class MyComponent {

    constructor(
        @Inject(DOCUMENT) private document: Document,
        @Inject(PLATFORM_ID) private platformId: any,
        windowRefService: WindowRefService,
    ) {}

    ngOnInit() {
        this.scrollToTop();
    }

    scrollToTop() {
        if (isPlatformBrowser(this.platformId)) {
            this.windowRefService.nativeWindow.scrollTo(0);
        }
    }
}

constructor(@Inject(PLATFORM_ID) private platformID: Object) {
        
    // run main initialisation code
    if (isPlatformBrowser(this.platformID)) {
       this.observable$ = interval(1000)... // safe to run code
    }
    // OR the alternative
    if (isPlatformServer(this.platformID)) {
       // run server side code 
    }
}

{
  "index": "/index.html",
  "assetGroups": [{
    "name": "ecommerce",
    "installMode": "prefetch",
    "resources": {
      "files": [
        "/favicon.ico",
        "/index.html",
        "/*.css",
        "/*.js"
      ],
      "urls": [
        "https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css",
        "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css",
        "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js",
        "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js",
        "https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
      ]
    }
  }, {
    "name": "assets",
    "installMode": "lazy",
    "updateMode": "prefetch",
    "resources": {
      "files": [
        "/assets/**",
        "/assets/*.json",
        "/assets/styles/*.scss",
        "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
      ]
    }
  }]
}

npm install tslint typescript --save-dev

1. Create server.js in root folder
2. Create ecommerce_backend folder in root folder
3. Create app.js file in ecommerce_backend folder
4. Run "npm install --save express" command to install express in your project
5. npm i --save-dev nodemon

npm run start:server

npm start
npm run start:server

const express = require('express'); //server starts (express framework for routing all these)
const bodyParser = require("body-parser");

const app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  res.setHeader(
    "Access-Control-Allow-Methods",
    "GET, POST, PATCH, DELETE, OPTIONS"
  );
  next();
});

app.use('/api/categories', (req, res, next) => {
  const categories = [{
      "catId": "1",
      "catName": "electronics",
      "catDesc": "electronics",
      "subCat": ["Laptops"]
    },
    {
      "catId": "2",
      "catName": "appliances",
      "catDesc": "appliances",
      "subCat": ["Television", "Microwave"]
    },
    {
      "catId": "3",
      "catName": "home-furniture",
      "catDesc": "home & furniture",
      "subCat": ["Kitchen", "Furniture"]
    }
  ];
  res.status(200).json({
    message: 'Successfully get categories',
    categories: categories
  });
});

// catch 404 and forward to error handler
app.use((err, req, res, next) => {
  next(createError(404));
});


// error handler
app.use((err, req, res, next) => {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

npm install --save body-parser

const bodyParser = require("body-parser");

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));


app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  res.setHeader(
    "Access-Control-Allow-Methods",
    "GET, POST, PATCH, DELETE, OPTIONS"
  );
  next();
});

npm install --save mongoose

1. Create categories.js because here I want to create my categories model using mongoose
2. mongoose, const mongoose by using that require syntax where I require the mongoose package
    const mongoose = require('mongoose');
3. you first of all create a blueprint for how your data should look like.    

const mongoose = require('mongoose');

const categoriesSchema = mongoose.Schema({
    catId: { type: String, required: true },
    catName:  { type: String, required: true },
    catDesc: { type: String, required: true },
    subCat: { type: [], required: true },
});

/* 
**To use our schema definition, we need to convert our categoriesSchema into a Model we can work with.
so it's this model which I'll export with the help of the module.exports syntax.
Now this mongoose model can be used outside of this model file
*/
mongoose.exports = mongoose.Model('Categories', categoriesSchema);

const database = require('./config/database');
const mongoose = require('mongoose'); // require mongoose

// MongoDB connection
mongoose.connect(database.mlab.url, {
  useMongoClient: true
});
mongoose.Promise = global.Promise;

// On connection error
mongoose.connection.on('error', (error) => {
  console.log('Database error: ' + error);
});

// On successful connection
mongoose.connection.on('connected', () => {
  console.log('Connected to database');
});

module.exports = {
    mlab:
    {
        name: <dbuser>,
        url: "mongodb://<dbuser>:<dbpassword>.mlab.com:41557/ecommerce",
        port: 27017
    }
};

const mongoose = require('mongoose');

const categoriesSchema = mongoose.Schema({
    catId: { type: String, required: true },
    catName:  { type: String, required: true },
    catDesc: { type: String, required: true },
    subCat: { type: [], required: true }
});

/* 
**To use our schema definition, we need to convert our categoriesSchema into a Model we can work with.
so it's this model which I'll export with the help of the module.exports syntax.
Now this mongoose model can be used outside of this model file
*/
module.exports = mongoose.model('Categories', categoriesSchema);

const Categories = require("./models/categories");

app.use('/api/categories', (req, res, next) => {
  Categories.find().then(cats => {
    res.status(200).json({
      message: "Categories fetched successfully!",
      categories: cats
    });
  });
});

npm install compression --save

var compression = require('compression');

// GZIP all assets
app.use(compression());

npm install highcharts --save
npm install highcharts-angular --save

import { HighchartsChartComponent } from 'highcharts-angular';
declarations: [
   ...
   HighchartsChartComponent    
],

<highcharts-chart
   [Highcharts] = "highcharts" 
   [options] = "chartOptions" 
   style = "width: 100%; height: 400px; display: block;">
</highcharts-chart>

1. cd ecommerce_backend
2. npm run swagger
3. npm run start:server