Mean Stack for Web Development

All students will learn to:

• Understand how Angular is different than traditional web development frameworks

• Code using new ES6 and TypeScript language features

• Develop an application from scratch using Angular 5

• Explore Angular coding and architecture best practices

• Understand and use Angular Forms, Observables, Dependency Injection, and Routing

• Retrieve, update, and delete data using Angular’s Http service

• Unit test all the parts of an Angular application including Modules, Components, Services, and Pipes

• Upgrade an existing application from AngularJS to Angular 5 over time by running both frameworks in the same project

• Create, build, and deploy an Angular (Angular 5) application using the Angular CLI

• Develop dynamic Model-driven forms that are easier to unit test

In Class

Program Duration

2 months

Daily or weekend

3 – 4 hours per day

Program covers

NodeJS & Express
MongoDB
Angular

Detailed course

Node & Express

Angular

Node & Express

Introduction to Node
• Environment setup for node
• Read Evaluate Print Loop under node terminal.
• declaration of variables for node
• Multiline expression

Node Project Module with installation of modules
• Installing modules
• Callbacks concepts in Node
• Blocking code and Non-blocking code
• Event driven programming and Loop
• Event Emitter and types of handlers to control events
• Node Streams to handle files

Node file system management
• Synchronized
• Non-synchronized implementations

HTTP module
• Web page development
• Making request on node sever with http

Node.js with database (MySQL) configuration
• MySQL Select with node.js
• MySqL insert
• MySQL Update
• MySQL Delete

Node.js with MongoDB configurations
• MongoDB Insert
• MongoDB Update
• MongoDB Delete
• MongoDB select

Angular – Advanced Web Development

1 Introduction of Angular

2 Why Angular
• User Experience similar to a Desktop Application
• Productivity and Tooling
• Performance
• Community
• Full-featured Framework
• Platform for Targeting Native Mobile not just Web Browsers

3 Understanding Angular Versions
• AngularJS (Angular 1.x)
• Angular versions

4 Understanding Angular
• Drop-in replacement for Angular 2

5 TypeScript & ES6
• Introduction
o What is Typescript
o Why Typescript
o Setup and installation
o IDE support
• Scoping using Let and Const Keywords ( ES6 )
• Template Literals ( ES6 )
• Spread Syntax and Rest Parameters ( ES6 )
• Destructuring ( ES6

6 Working with Angular CLI
• Angular CLI
• Anatomy of the project
• Debugging Angular apps
• Working with Augury

7 Main Building Block of Angular
• Modules
• Components
• Templates
• Metadata
• Data binding
• Directives
• Services
• Dependency injection

8 Component
• Introduction
• @Component decorator
• Component configuration object
• Custom components
• Component with templates
o Inline
o External
• Component with Styles
o Inline
o External

9 Templating
• HTML as template
• Data binding
o Interpolation
o Property Binding
o Event Binding
o Two way binding
• Template expressions
• Template syntax
• Attribute, class and style bindings
• @Input()
• @Output
• Template reference variables
• Safe navigation operator

10 Directives
• Introduction
• Built-in directives
o Structural directive
• NgIf
• NgFor
• NgSwitch
o Attribute directive
• NgClass
• NgStyle
• NgModel
• @Directive decorator
• Custom directive development

11 Pipes
• Introduction
• Built-in pipes
• @Pipe decorator
• Custom pipe development

12 Forms
• Introduction
• @angular/forms library
• Template driven forms
• Form and field validation
• Validation check with ng-pristine, ng-dirty, ng-touched, ng-untouched, ng-valid, ng-invalid
• Show and hide validation error messages
• Form submission with ngSubmit
• Reactive/ Model drive forms
• ReactiveFormsModule
• FormGroup, FormControl classes
• FormBuilder for easy form building
• Validations using Validators
• Setting form model using setValue and patchValue
• Use FormArray to build repeated from controls or form groups

13 Routing & Navigation
• Introduction
• @angular/router library
• Configure routes
• RouterModule.forRoot and RouterModule.forChild
• RouterOutlet, RouterLink, RouterLinkActive
• Nested Routes
• Parametrized routes
• Route guards
• Router events

14 HTTP Deprecated & HttpClient
• Setup installing the module
• Making a request for JSON data
• Typechecking the response
• Reading the full response
• Error handling
• Requesting non-JSON data
• Sending data to the server
• Making a POST request
• Configuring other parts of the request

15 Testing
• Introduction
• Testing in Typescript
• Testing Component
• Testing Service/Provider
• Testing Pipe

16 New features in Angular 6 & 7
• Animations
• Materials

Enroll Now

In Class