Duration
2 days
Synopsis
This course provides a full guide to Angular 5 from setup to deployment of an Angular 5 app. You will learn all about Components, Directives, Services, Forms, Http Access, Authentication, Optimizing an Angular App with Modules and Offline Compilation, and Deployment. This course will also show you how to use the Angular CLI and feature a complete project, which allows you to practice the things learned throughout the course.
Learning Objectives
- Angular 5 setup and deployment
- Angular 5 Full feature set
- Typescript
Suggested Audience
- Web Developers
Day 1
Getting Started
- What is Angular and Angular 5
- CLI Deep Dive
- Project Setup and First App
- Typescript introduction
The Basics
- Module introduction
- Angular app loading and starting
- Creating a new component
- Working with component styles and templates
- Data binding
- Event binding
- Understanding Directives
- ngIf and ngFor
Project Development
- Planning an app
- Creating app components
- Adding a navigation bar
- Debugging an app
Components and Databinding
- Property and Event binding
- Projecting content into components with ng-content
- Component lifecycle
Directives
- Creating a Basic Attribute Directive
- Using Renderer
- Using Hostlistener
- Using Hostbinding
- Building a structural directive
- Understanding ngSwitch
Using Services and Dependency Injection
- Why do you need services?
- Create a logging service
- Create a data service
- Understanding the hierarchical injector
- Injecting services into services
- Using services for cross-component communication
Day 2
Changing Pages with Routing
- Why do we need a router?
- Setting up and loading routes
- Navigating with router links
- Understanding navigation paths
- Navigating programmatically
- Using relative paths
- Passing parameters to routes
- Route Observables
- Redirecting and wildcard routes
Understanding Observables
- Building an Observable
- Understanding Observable Operators
Handling Forms
- Template-Driven vs Reactive Approach
- Creating the form and registering the controls
- Understanding form state
- Adding Validation to check user input
- Using ngModel
- Grouping form controls
- Creating custom validators
Using Pipes to Transform Output
- Introduction to pipes
- Parametrizing pipes
- Chaining pipes
- Creating custom pipes
Making Http Requests
- Sending Http Requests – POST request
- Adjusting Request Headers
- Sending GET requests
- Sending a PUT request
- Using Returned data
- Catching Http errors
- Using async with Http requests
Authentication and Route protection
- Creating a sign-up page and route
- Signing users up and signing them in
- Logging out
Angular Modules & Optimizing Apps
- Understanding modules
- The App module
- Feature modules
- Registering routes in a feature module
- Understanding shared modules
- Understanding lazy loading
- The Core module
- Deploying an App
- The HttpClient
Introduction to Unit Testing
- Running Tests
- Testing dependencies: components and services
- Simulating async tasks
- Isolated vs non-isolated tests
Programme scope, delivery arrangements and suitability are confirmed during enquiry.