web-development

AngularJS is an open-source JavaScript framework created by Google, which is called as Single Page Applications (SPA). It should be an extension of standard HTML attributes with Directives. It fixes data to HTML with Expressions. It is a Superheroic JavaScript MVC (Model-View-Controller) structure. Angular JS will handle common web development tasks like routing, HTTP requests, testing, and animations. First AngularJS inspects the HTML page with custom HTML Tags. Then besides the labels, interacts with the AngularJS library to make Rich Internet Applications.

Course outline
AngularJS is one of the most popular Javascript framework used in front-end development. By registering for this course, you will learn how to setup, build and deploy AngularJS applications in addition to having a deep understanding on dependency injection, custom directives, custom filters and isolate scopes in directives.

Note: The topics covered in this course might get slightly adjusted depending on the cumulative decision made by the candidates who have signed up for the course.

Target Audience
Developers who are using AngularJS 1.0 and would like to learn about the upgraded features, web developers, front-end developers, mobile app developers, students

Pre-requisites
We expect candidates to have basic knowledge in using REST APIs, either through POSTMAN or a command-line interface.

• Getting Started

  Introduction
  What is in AngularJS
  Creating an AngularJS Project
  Editing our First App
  Understanding the Project Structure
  Why TypeScript. What is TypeScript

• Components, Templates & Databinding

  Getting Started with Components
  How an Angular JS App gets started
  Understanding App Modules
  Using Templates & Styles
  First Summary
  Creating a new Component
  About Unique Selectors
  Using multiple Components
  View Encapsulation and Styling
  Inserting Content with ng-content
  Databinding Overview
  String Interpolation
  Property Binding & Event Binding Overview
  Property Binding
  Binding to Custom Properties
  Event Binding
  Binding to Custom Events
  Two-Way Binding

• Directives

  What are Directives
  Attribute Directives
  Building a Custom Attribute Directive
  Element Interaction with HostListener & HostBinding
  Directive Property Binding
  ngIf
  ngFor
  ngSwitch

• Services & Dependency Injection

  What are Services
  Example – Logging Service
  What is Dependency Injection
  Example – Injecting the Logging Service
  Services & App Modules
  Multiple Instances vs One Instance
  Using NgModules

• Routing

  Introduction to the Angular JS Router
  Setting up Routes
  Loading Routes
  Navigation with Links
  Understanding Navigation Paths
  Imperative Routing (Triggered in Code)
  Route Parameters
  Extracting Route Parameters
  Query Parameters
  Extracting Query Parameters
  Query Parameters and the routerLink Directive
  Child Routes
  Redirecting Request
  Styling Active Route Links
  Using Guards with AppModules
  Guards – CanActivate
  Guards – CanDeactivate

• Forms

  Introduction to Forms in Angular JS
  Approach Basics
  Registering Controls
  Submitting a Form and Using the Output
  Form Properties
  Input Validation
  Form State & CSS Classes
  Default Values with ngModel
  Two-Way Binding with ngModel
  Form Groups
  Radio Button Controls
  Using the Form State, Providing a better UX
  Intro The Data-Driven Approach

• Pipes

  What are Pipes
  Using Pipes
  Parametrizing Pipes
  Pipe Documentation
  Chaining Pipes
  Custom Pipes

• Http

  Http & Observables
  Required Adjustments in this Module
  Demo Data Source – Firebase Setup
  Sending a GET Request
  Using NgModules
  The Power of Observables Operators – Map (ping Data)
  Sending a POST Request
  Retrieving and Transforming Data with Observables

• Deploying an Angular JS Application

  Intro
  New Project Structure
  What to Deploy
  Setting up an App for Deployment
  Deploying to Github Pages with the Angular JS CLI
  Deploying to Github Pages Manually

• Angular JS CLI

  Intro
  Installation
  New Project – ng new and ng init
  Building your Project – ng build & ng serve
  Understanding the Project Structure
  Linting your Code – ng lint
  Unit Tests – ng test
  Managing Project Content – ng generate & ng destroy
  Putting it into Production – ng build and ng github-pages
  Learning More – ng –help and Wrap Up

• Example Project & Workflow Setup

  Intro
  Dependencies & Typings
  App Setup & Tsconfig
  Gulp
  Basic App Code