Front-end Web Development using Angular 8

Courses and Trainings
1

Event Name : Front-end Web Development using Angular 8

Venue: Tech for Development Training Center, Nairobi, Kenya

Event Date: 17th to 28th February 2020

Course Fee: KES 150,000.00 or USD 2,000.00

Tech for Development-T4D would like to invite you to a high impact Front-end Web Development using Angular 8 to be held in Nairobi, Kenya from 17th to 28th February 2020.

Why T4D?

We are an international training, capacity building and tech solutions organization that offers tech solutions, scheduled and tailor-made training and capacity building solutions to individuals and development agencies in Africa and around the world.

We provide our training programs with a capacity-building goal, so as to ensure that, our training programs contribute to sustainable change.

Course Description

Angular 8 simply is the latest version of the Angular framework and simply an update to Angular 2. Angular is one of the most modern, performance-efficient and powerful frontend frameworks you can learn as of today. It offers a much more flexible and modular development approach and allows you to build great web apps which offer awesome user experiences. You will learn this amazing framework from the ground up in this course. From Setup to Deployment, this course covers it all. You’ll learn all about Components, Directives, Services, Forms, Http Access, Authentication, Optimizing an Angular App with Modules and Offline Compilation and much more and in the end you’ll be able to fully take advantage of all those features and start developing awesome applications immediately and deploy them.

Who should attend?

  • Beginners as well as experienced frontend developers interested in learning a modern JavaScript framework

  • Everyone interested in learning a state-of-the-art frontend JavaScript framework

  • Back-end developers who want to learn front-end development and become full-stack developers

Requirements

  • NO Angular 1 or Angular 2 knowledge is required!

  • Basic HTML and CSS knowledge helps, but isn’t a must-have

  • Prior TypeScript knowledge also helps but isn’t necessary to benefit from this course

  • Basic JavaScript knowledge is required

Duration

10 days

Course Objectives

What you will learn:

  • Develop modern, complex, responsive and scalable web applications with Angular 8.

  • Fully understand the architecture behind an Angular 8 application and how to use it.

  • How to use TypeScript to write Angular applications

  • Create single-page applications with one of the most modern JavaScript frameworks.

  • Accessing the Web (e.g. RESTful servers)

  • Dependency injection

  • Write cleaner, more maintainable code

  • Optimizing bigger Angular Applications

Course Content

Module I

Getting Started

  • What is Angular?

  • Angular Version History(Angular vs Angular 2 vs Angular 8)

  • Architecture of Angular Apps

  • CLI Deep dive and Troubleshooting

  • Seeting up Development Environment and First App

TypeScript Fundamentals

  • What is Typescript?

  • Variables

  • Types and Types Assertions

  • Arrow Functions

  • Interfaces

  • Classes and Objects

  • Constructors

  • Access Modifiers

  • Properties and Modules

Module II

Angular Fundamentals

  • Building Blocks of Angular Apps

  • Components

  • Generating Components using Angular CLI

  • Nesting Components

  • Component Templates and Styles

  • What is Data binding?

  • Property Binding vs String Interpolation

  • Two-way Data Binding

  • Event Binding

  • Passing and Using Data with Event Binding

  • Directives

  • Using ngIf to Output Data Conditionally

  • Styling Elements Dynamically with ngStyle

  • Services and Services Generation Using Angular CLI

  • Dependency Injection

Debugging

  • Understanding Angular Error Messages

  • Debugging Code in the Browser Using Sourcemaps

  • Using Augury to Dive into Angular Apps

Module III

Components and Data Binding Deep Dive

  • Splitting Apps into Components

  • Binding to Custom Properties

  • Binding to Custom Events

  • Understanding View Encapsulation

  • Using Local References in Templates

  • Getting Access to the Template & DOM with @ViewChild

  • Projecting Content into Components with ng-content

  • Understanding the Component Lifecycle

  • Lifecycle Hooks and Template Access

  • Getting Access to ng-content with @ContentChild

Directives Deep Dive

  • ngFor and ngIf Recap

  • ngClass and ngStyle Recap

  • Creating a Basic Attribute Directive

  • Using the Renderer to build a Better Attribute Directive

  • HostListener and HostBinding

  • Binding to Directive Properties

  • Building a Structural Directive

Module IV

Services and Dependency Injection

  • Creating a Logging Service

  • Injecting the Logging Service into Components

  • Creating a Data Service

  • Hierarchical Injector

  • Injecting Services into Services

  • Using Services for Cross-Component Communication

Routing and Navigation

  • Setting up and Loading Routes

  • Navigating with Router Links

  • Programmatic Navigation

  • Passing and Fetching Route Parameters

  • Passing and Retrieving Query Parameters and Fragments

  • Redirecting and Wildcard Routes

  • Static and Dynamic Data

  • Subscribing to Multiple Observables

  • The SwitchMap Operator

Module V

Template-Driven Forms

  • Types of Forms

  • Creating the Form and Registering the Controls

  • Submitting and Using the Form

  • Understanding Form State

  • Accessing the Form with @ViewChild

  • Adding Validation to check User Input

  • Using the Form State

  • Outputting Validation Error Messages

  • Set Default Values with ngModel Property Binding

  • Using ngModel with Two-Way-Binding

  • Grouping Form Controls

  • Handling Radio Buttons

  • Setting and Patching Form Values

  • Using Form Data

  • Resetting Forms

Reactive Forms

  • Setting up and Creating a Form in Code

  • Syncing HTML and Form

  • Submitting the Form

  • Adding Validation

  • Getting Access to Controls

  • Grouping Controls

  • Arrays of Form Controls (FormArray)

  • Creating Custom Validators

  • Using Error Codes

  • Creating a Custom Async Validator

  • Reacting to Status or Value Changes

  • Setting and Patching Values

Module VI

HTTP Requests and CRUD

  • Angular Interaction With Backends

  • Anatomy of a Http Request

  • Backend (Firebase) Setup

  • Sending a POST Request

  • GETting Data

  • Using RxJS Operators to Transform Response Data

  • Using Types with the HttpClient

  • Outputting Posts

  • Service for Http Requests

  • Services & Components

  • Sending a DELETE Request

  • Handling Errors

  • Error Handling & UX

  • Setting Headers

  • Adding Query Params

  • Different Types of Responses

  • Response and Multiple Interceptors

Authentication and Route Protection

  • How Authentication Works

  • Adding the Auth Page

  • Switching Between Auth Modes

  • Handling Form Input

  • Preparing the Backend

  • Preparing and Sending the Signup Request

  • Adding a Loading Spinner & Error Handling Logic

  • Sending Login Requests

  • Login Error Handling

  • Creating & Storing the User Data

  • Reflecting the Auth State in the UI

  • Adding the Token to Outgoing Requests

  • Attaching the Token with an Interceptor

  • Adding Logout

  • Adding Auto-Login and Auto-Logout

  • Adding an Auth Guard

Module VII

Deploying Angular Apps

  • Preparing for Deployment

  • JIT vs AOT Compilation

  • Angular Compiler in Action

  • Building Applications with Angular CLI

  • Environments

  • Linting with Angular CLI and Linting in VSCode

  • Deploying to GitHub Pages

  • Deploying to Firebase

  • Deploying to Heroku

  • Engines

Unit and Integration Testing in Angular Apps

Methodology

The instructor led trainings are delivered using a blended learning approach and comprise of presentations, guided sessions of practical exercise, web based tutorials and group work. Our facilitators are seasoned industry experts with years of experience, working as professionals and trainers in these fields.

All facilitation and course materials will be offered in English. The participants should be reasonably proficient in English.

Accreditation

Upon successful completion of this training, participants will be issued with a certificate of participation.

Training venue

The training is residential and will be held at T4D Training Centre in Westlands Nairobi, Kenya. The course fees cover the course tuition, training materials, two break refreshments, lunch, and study visits.

All participants will additionally cater for their, travel expenses, visa application, insurance, and other personal expenses.

Tailor- made

We can also tailor-make our courses for you. This way, you/your organization will benefit by:

  • Using own tools during the training

  • Being able to choose areas of interest you wish the trainer to put more emphasis on

  • Taking the course in-house or at a venue of choice

  • Cutting on the cost of transport and accommodation

For further inquiries, please contact us on details below:

Email: [email protected]

Mobile: +254 (0) 729166479

Accommodation

Accommodation is arranged upon request. For reservations contact the Training Officer.

Email: [email protected]

Mobile Number: +254 706909947

Training fee

The course fee is KES 150,000.00 or USD 2,000.00 exclusive of VAT. The course fee covers the course tuition, training materials, two (2) break refreshments, lunch and study visits. Participants will cater for their travel and accommodation costs.

Payment

Payment should be transferred to Tech For Development - T4D account through bank on or before the course starting date.

Send proof of payment to [email protected]

Cancellation policy

Payment for the all courses includes a registration fee, which is non-refundable, and equals 15% of the total sum of the course fee.

Participants may cancel attendance 14 days or more prior to the training commencement date.

No refunds will be made 14 days or less to the training commencement date. However, participants who are unable to attend may opt to attend a similar training at a later date, or send a substitute participant provided the participation criteria have been met

Contact information

Tel: +254 706909947
Email: [email protected]
Website: www.t4d.co.ke

Kind regards.

Lennox I. Mucheni
Customer Relationship Officer,
Tech For Development.
Innovation for impact