Setup Angular Application
- npm install -g @angular/cli
- ng new my-app (also creates the top level directory for the application)
- cd my-app
- ng serve (compiles/transpiles code and starts the local web server, see http://localhost:4200)
Installation nb-bootstrap
npm install --save @ng-bootstrap/ng-bootstrap
in src/app/app.module.ts:
import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; @NgModule({ ... imports: [ ..., NgbModule, ... ] .... })
Installation bootstrap
npm install --save bootstrap jquery popper.js
in angular.json:
"styles" : [ ... , "node_modules/bootstrap/dist/css/bootstrap.min.css", ... ]
Installation fontawesome
There are different ways to get fontawesome into the project. One way is to directly add the url to CDN for fontawesome in index.html.
Installation ngx-toastr
npm install @angular/animations --save npm install ngx-toastr --save
in angular.json:
"styles" : [ ... , "node_modules/ngx-toastr/toastr.css", ... ]
in app.module.ts:
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { ToastrModule } from 'ngx-toastr';
imports: [ ... , BrowserAnimationsModule, ToastrModule.forRoot(), ... ]
in your component:
import { ToastrService } from 'ngx-toastr'; // add service via constructor constructor(private toastr: ToastrService, ...) { ... } // use this.toastr.info("Hello!");