Mastering Angular

1
(No Transcript)
2
Mastering Angular Angular Project Development
Training

• About the Course
• The Mastering Angular with Live Project course is
  primarily designed for UI Developer(s)/Web
  Developer(s) who want to learn how to create
  single page web application using Angular. In
  this course, you will learn the Angular including
  versions 2 to 12 and TypeScript fundamental like
  modules, components, life cycle hooks, pipes,
  directives, services, forms validation, classes,
  interface, method overloading, arrow function,
  REST API using express etc. that help you to
  build rich, scalable, extensible and
  high-performance single page web application and
  much more.
• In this course, you will learn each and every
  topic with the help of hands-on labs. This
  program includes a hands-on live project with
  the implementation of recommended design patterns
  and practices.
• Course objectives
• At the completion of this course, attendees will
  be able to
• Understand Typescript core and advanced concepts
• Understand Angular including versions 2 to 11,
  basic and advanced in-depth concepts
• Create components, services, pipe and forms
  validations etc.
• Implement advanced concepts like observables
  RxJS, Lifecycle and change detection etc.
• Create and Consume REST services
• Writing Unit Tests using Jasmine and Karma
• Optimize web page performance
• Secure application based on user roles
• Use Angular Material for beautiful UI
• Publish their App on cloud
• Who can do this course?
• All professionals who are keen to develop
  interactive, light weight and highly extensible
  SPA should go for this course.

Page1
3
Course Curriculum

• Module 1
• TypeScript
• Issues with Plain JavaScript
• Introduction to TypeScript
• Advantages of TypeScript
• Getting Started with TypeScript
• Setting VS Code for TypeScript
• TypeScript Fundamentals
• TypeScript Data Types
• Numbers
• Strings
• Loops
• Functions
• Functions
• Arrow Function
• Default and Optional Parameters
• Function overloading
• Classes, Access Modifiers and Constructors
• Classes

Page2
4

• Setting Up Environment
• Installing Node.js and Angular CLI
• Installing Visual Studio Code
• Useful VS Code Extensions for Angular Development
• Angular CLI
• Introduction to Angular CLI
• Creating new project - ng new
• Building Project - ng build and ng serve
• Angular CLI Commands and Options
• Module 3
• Exploring Angular App Structure
• Understanding Angular folder structure
• Angular Initialization Process
• Angular Building Blocks
• Modules and Components
• Understanding Modules
• Introduction to Component and Template
• Creating a Component
• Bootstrapping the Component

Page3
5

• Module 4
• Routing
• Understanding Routing
• Defining Routes
• Understanding Location Strategies
• Navigation and Route Parameters
• Adding a Navigation Bar
• Styling Active Router Links
• Navigation using code
• Route Parameters Required, Optional and Query
  Params
• Nested Routes and Lazy Loading
• Setting up Child or Nested Routes
• Setting up and navigating to Lazy loading module
• Angular Route Guards
• Introduction to Angular Route Guards
• Types of Route Guards
• Using Route Guards
• Module 5
• Advanced Components

Page4
6

• Creating Template Driven Form
• Angular form input controls
• Angular form built-in validation
• Template Driven Form validation
• Model Driven Form
• Understanding Model Driven (Reactive) Form
• Creating Model Driven Form
• Creating form using Form Builder
• Reactive Form validation
• Custom Validations
• Template Driven vs. Model Driven Forms
• Module 7
• Debugging
• Understanding Angular Error Messages
• Debugging Code in the Browser
• Debugging Code using IDE
• ReactiveX and Observables
• Introduction to ReactiveX
• Understanding Observables and Observers

Page5
7

• Module 9 (Self-paced)
• Unit Testing
• Understanding Unit Testing
• Angular Unit Testing Framework
• Unit Testing with Jasmine and Karma
• Writing Unit Tests
• Angular Unit Tests
• Unit tests for component
• Unit tests for Angular forms
• Unit Testing test for services
• Test code coverage
• Running and Debugging Unit Tests
• Module 10 (Project)
• Discussing Project Architecture
• Understanding Application layers
• Discussing Application Entities Properties
• Discussing Relationship among Application
  Entities
• Developing Application Architecture
• Designing Application Architecture

Page6
8

• Module 12 (Project)
• Cart
• Creating Cart
• Adding Products to Cart
• Removing Products from Cart
• Deployment
• Angular Hosting Options
• Hosting Angular App

Build Angular Real-Projects
Apply your coding skills to solve real-world
problems. Youll learn how to start a project
from scratch by following recommended
architecture, practices and deploy to server.
Page7
9
Angular Project Architecture The primary purpose
of an application architecture is to support the
development life cycle of the system. Good
architecture makes the system easy to understand,
easy to develop, easy to maintain, and easy to
deploy. The ultimate benefit of architecture is
to minimize the lifetime cost of the system and
to maximize programmer productivity. The goal of
the given architecture is to learn and implement
important principles and design patterns to build
various domains applications like eCommerce,
edTech, Food Delivery or other Service based
industries applications.

• What you will learn through project?
• At the completion of project, attendees will be
  able to
• Develop Angular Single Page App
• Break a project into multiple modules
• Create shopping cart
• Integrate Angular Material
• Validate User Inputs
• Implement Token based Security
• Create backed using REST Services
• Scale application for Phone, Tablets, and Laptop
  Desktop
• Optimize your page performance
• Secure their application based on user roles
• Configure and Publish App.
• Contact Us
• For more information about the course, visit
  www.dotnettricks.com/training/masters-program/angu
  lar
• Feel free to call us at 91 9999 123 502 or email
  us at info_at_dotnettricks.com

Page8