Interactive Websites with Angular and TypeScript

Angular and TypeScript

• What is Angular? TypeScript, Single Page Applications, Tools for Angular Application Development, Node, NodeJS, Typings, Angular CLI, ng, Visual Studio Code, Creating First Project, Node Package Manager, npm, TypeScript Editor

• Angular Project Files, TypeScript Compilation, Transpile, watch mode compilation, tsconfig.json, package.json, main.ts, app folder, app.module.ts, app.component.ts, app.component.html, app.component.css, app.component.scss

• Creating Components, Using Components, Directives, Custom Directives, Templates, Creating Services, Using Services, Dependency Injection, One Way Binding

• Property Binding, CSS Class Binding, Style Binding, Event Handling, Rendering Data, Events Handling, One Way Binding, Two Way Binding, Interpolation, Rating Component Creation, On Click Events Handling

• Building Reusable Components, Component Input Properties, Component Output Properties, Templates, Styles, API, Displaying Multiple Products with Product Image, Name, Date, Rating, Number of Reviews, Description

• Controlling Rendering of HTML, ngFor, ngIf, ngSwitch, ngSwitchCase, ngSwitchDefault, Pipes, DatePipe, UpperCasePipe, LowerCasePipe, CurrencyPipe, PercentPipe, Custom Pipes, Chaining Pipes, ng-Content

• Template Driven Forms, Model Class to Represent the Data in the Form, Displaying the List of Options in a Select Dropdown using *ngFor, Two-way Binding with Form and Component Properties using ngModel , Displaying form Field Validation Errors using ngModel, Form Submission using ngSubmit

• Model Driven Forms, FormControl, FormGroup, FormBuilder, Implement Custom Validation, Validate the Form upon Submit

• Observables, Creating Observable from DOM Events, Observable Operators, filter Operator, debounceTime Operator, distinctUntilChanged Operator

• RESTful API, Getting Data from the Server, Dependency Injection, Component’s Lifecycle Hooks, OnInit, OnDestroy, DoCheck, OnChanges, AfterContentInit, AfterContentChecked, AfterViewInit, AfterViewChecked, Showing a Loader Icon, Spotify Results Display Page, Adding an Input to Spotify Results Display Page, RESTful api using Observables, Http, HttpClient, HttpClientModule, get(), post(), put(), delete(), head()

• Building Single Page Application with Routing, Define Routes, Configure Routes, Rendering Requested Component, Router Outlet, Providing Router Links, Create Routes with Parameters, Retrieving Parameters, Route Guards, Authorization with the CanActivate Interface, Preventing unsaved Changes with the CanDeactivate Interface

• C.R.U.D. operations using Firebase, Firebase as Backend Server, Adding Firebase to Web Application, Working with Firebase Database, Firebase Console, Bootstrap, Add Data, Read Data, Update Data, Delete Data, Pagination Controls, Form Builder, Validators, Form Group, Reactive Forms, Toastr, Firebase, @angular/fire, ngx-pagination, ngx-toastr