HRDF Funded -Full Angular JS 4 Training

This is a two-day full course on Angular JS 4. Day 1 was basic Angular JS 4, and day 4 is advanced JS4. Angular JS 4 was designed by Google to address challenges programmers face building single-page applications.

The Topics include:

• What is Angular JS?
• Setting up an Angular template
• Preparing TypeScript and modules
• Creating a component
• Displaying data
• Working with events
• Using two-way data binding
• Creating CSS subcomponent
• Dependency Injection
• Forms and Controls
• HTTP, controls, API, Promises and Observables
• Component, Services and Routing
• Directives

HRDF SBL Claimable for Employers Registered with HRDF
For more information about the course please visit: 
https://www.tertiarycourses.com.my/full-angular-js-course.html

Module 1 - TypeScript Overview

• ES6 & TypeScript
• Static Typing
• Constants 
• Block Variables
• Template Strings
• Arrow Functions
• Spread parameters
• Rest parameters
• Destructuring 
• Classes
• Inheritance 
• Interfaces
• Modules
• Decorators

Module 2 - Architecture Overview

• Setting up AngularJS 4
• Angular Hello World App
• Booststrapping angular to index.html
• Architecture Overview
• Core concepts

Module 3. Modules, Components and Templates

• Introduction to Modules
• Importing Modules
• What are components in Angular
• Component templates
• Component metadata
• Component decorator
• Decorator configurations
• Component Events
• Template Variables

Module 4. Data Binding

• What is Data Binding
• Property Events
• Passing data into a Component
• Passing data from parent component
• Event Bindings
• Passing Data Outside the Component
• Parent receiving data from child
• Two way Data Binding
• Hands on Data Binding - creating movie details screen

Module 5. Directives and Pipes

• What are Directives in Angular
• Structural directives
• Attribute directives
• Built In Pipes
• Hands on directives and pipes - updating movie details view
• Using ngIf and ngClass directive
• Using inbuilt pipes

Module 6. Services and Dependency Injection

• What are services
• Writing our custom service to load of movies
• What is Dependency Injection 
• How Angular does dependency injection
• Using dependency injection to load services
• Hands on Services - load movies and then create a Grid View layout to display movies
• Using ngFor directive
• Creating grid layout

Module 7. Angular Routing

• Angular 4 routing 
• Route configuration
• Route params
• Hands on Routing - navigating between grid view and details view
• Exercise - add route to navigate from details view to edit view

Module 8. Angular Forms & Validations

• User input
• Form Validations
• Form States
• Hands on Form Validation - adding a edit details form to update movie details

Module 9. Angular, MongoDB and Express

• Creating tables using MongoDB
• Adding and retrieving data from MongoDB
• Creating API’s in Express to fetch data
• Creating Services in Angular to connect to Mongo
• Using services to load data from Mongo

Module 10. Deploying Angular App to Heroku

• Publishing your app to Github
• Heroku Toolbelt overview
• Logging to Heroku inside toolbelt
• Updating package.json and testing the app locally
• Deploying app to Heroku