Choosing the Right JavaScript Framework Training Course

Introduction

Front-End Development and JavaScript Frameworks

  • The tools and development for web development

Evaluating Application Requirements

  • Speed and performance
  • Maintainability
  • Readability
  • Integration with existing systems, applications and services

Evaluating Existing Talent

  • Backend and frontend development experience
  • Training and learning curves

Preparing the Development Environment

  • Editors and IDEs
  • Installing and configuring NPM and Node.js

Overview of the Web Development Cycle

  • Version control, coding, building, testing, deploying
  • Automation and continous integration

Exploring Angular

  • Benefits: reusabilty, readability, maintainability, etc.
  • Limitations: steep learning curve, migrating legacy
  • Hands on: installing and configuring
  • Hands on: implementing a todo list app
  • Hands on: testing and debugging todo list app
  • Building and deploying an Angular application

Exploring React

  • Benefits: data binding, JSX, SEO-friendly, etc.
  • Limitations: learning curve, JSX, React’s documentation, etc.
  • Hands on: installing and configuring
  • Hands on: implementing a todo list app
  • Hands on: testing and debugging todo list app
  • Building and deploying a React application

Exploring Vue

  • Benefits: size, readability, etc.
  • Limitations: lack of plugins, updated continuously, etc.
  • Hands on: installing and configuring
  • Hands on: implementing a todo list app
  • Hands on: testing and debugging todo list app
  • Building and deploying a Vue application

Summary and Conclusion

Reactive Programming with Angular RxJS Training Course

Introduction

Observables

  • Basic usage and terms
  • Defining observers
  • Subscribing
  • Creating observables
  • Multicasting
  • Error handling

The RxJS Library

  • Creation functions
  • Operators
  • Common operators
  • Error handling
  • Handling failed observable
  • Naming conventions

Observables in Angular

  • Event emitter
  • HTTP
  • Async pipe
  • Router
  • Reactive forms

Practical Usage

  • Type-ahead suggestions
  • Exponential backoff

Observables vs Promises

  • Creation and subscription
  • Chaining
  • Cancellation
  • Error handling

Observables vs Events API

Observables vs Arrays

Summary and Conclusion

Angular 8 Training Course

Introduction

Angular 8

  • What is Angular?
  • Angular architecture
  • Angular 8 features

Preparing the Development Environment

  • Installing and configuring Angular 8

Angular Quick Start

  • Creating an application
  • Adding Bootstrap
  • Creating routing

Components and Binding

  • Creating and using custom components
  • Working with bindings
  • Building modules
  • Styling components

Developing an Angular Library

  • Creating Angular libraries
  • Publishing Angular libraries

Services and Dependecy Injection

  • Creating a service
  • Injecting a service into a component, directive, and service

Form Handling

  • Creating a form
  • Validating, filtering, and sanitizing form data

Pipes and HTTP Requests

  • Transforming output
  • Setting up Firebase
  • Sending requests

Offline Capabilities

  • Adding service workers
  • Caching assets and URLs

Testing the Application

  • Testing with unit tests

Debugging the Application

  • Handling errors

Deploying the Application

  • Hosting with Firebase

Securing the Application

  • Using JWT authentication

Troubleshooting

Summary and Conclusion

Angular 9 Training Course

Introduction

  • What is Angular?
  • What’s new in Angular 9?

Overview of Typescript and ES6 JavaScript

  • TypeScript Syntax
  • Using the TypeScript transpiler
  • Setting up Angular 9 and Typescript

Overview of Angular 9’s Parts

  • Angular CLI
  • Components
  • Directives
  • Inputs and Outputs
  • Data Binding and Interpolation
  • Event Binding
  • Data Modelling
  • Bootstrapping

Creating Your First Angular Application

  • Planning the Application
  • Setting Up an Angular Project
  • Creating a mobile friendly UI using Bootstrap 4 and Sass

Creating a Component

  • Understanding the Component Lifecycle
  • Data Flow
  • Using Templates and Styles
  • Projecting Content
  • Working with AppModule
  • Working with Custom Components
  • Using View Encapsulation
  • Implementing Lifecycle Hooks
  • Using ViewChildren and ContentChildren

Data Binding in Angular 9

  • Understanding Property and Event Binding
  • Binding and Assigning Aliases to Custom Properties
  • Binding and Assigning Aliases to Custom Events

Working with Directives

  • Built-in Directives
  • Custom Directives

Angular 9 Services

  • Creating a Logging Service
  • Creating a Data Service

Using Dependency Injection and Providers

  • Injectors, Provider, and Tokens
  • Configuring Dependency Injection
  • Configuring Your Provider
  • Injecting Services into Components, Directives, and Services

Switching Pages with Routing

  • Understanding the Different Navigation Methods
  • Routing Strategies
  • Setting Up Routes
  • Configuring and Loading Routes
  • Using Parameters in Routes
  • Creating Nested Routes
  • Using Redirect and Wildcard Routes
  • Understanding Route Guards

Using RxJS to Create and Work with Observables in Angular

  • Overview of Observables
  • Overview of RxJS
  • Building & Using Observables in Angular

Generating Forms for User Input

  • Using the Template Driven Forms
  • Using the Reactive Forms
  • Creating custom validation
  • Validating, filtering, and sanitizing form data

Using Pipes

  • Transforming output
  • Built-in Pipes
  • Async Pipe
  • Custom Pipes

Making Calls to External HTTP APIs

  • Sending requests

Using Angular Modules

Testing the Angular 9 Application

  • Using Jasmine for unit testing
  • Using Protractor for end-to-end testing

Debugging the Application

  • Understanding Error Messages in Angular
  • Using Sourcemaps to Debug Code in the Browser
  • Reading TypeScript Compilor diagnostics
  • Using Augury

Optimizing the Angular 9 Application

  • Understanding the Ivy compiler, runtime, and renderer
  • Reworking the code
  • Reducing bundle size and eliminating dead-code

Angular 9 Security

  • How authentication works
  • Using JWT authentication
  • What should and shouldn’t be written in Angular

Deploying an Angular 9 Application to Production

  • Deploying to IIS, Apache, Nginx, etc.

Angular 9 Best Practices

Troubleshooting

Summary and Conclusion

Angular 10 for Developers Training Course

Introduction

  • What is Angular?
  • What’s new in Angular 10?

Overview of Typescript and ES6 JavaScript

  • TypeScript Syntax
  • Using the TypeScript transpiler
  • Setting up Angular 10 and Typescript

Overview of Angular 10’s Parts

  • Angular CLI
  • Components
  • Directives
  • Inputs and Outputs
  • Data Binding and Interpolation
  • Event Binding
  • Data Modelling
  • Bootstrapping

Creating Your First Angular Application

  • Planning the Application
  • Setting Up an Angular Project
  • Creating a mobile friendly UI using Bootstrap 4 and Sass

Creating a Component

  • Understanding the Component Lifecycle
  • Data Flow
  • Using Templates and Styles
  • Projecting Content
  • Working with AppModule
  • Working with Custom Components
  • Using View Encapsulation
  • Implementing Lifecycle Hooks
  • Using ViewChildren and ContentChildren

Data Binding in Angular 10

  • Understanding Property and Event Binding
  • Binding and Assigning Aliases to Custom Properties
  • Binding and Assigning Aliases to Custom Events

Working with Directives

  • Built-in Directives
  • Custom Directives

Angular 10 Services

  • Creating a Logging Service
  • Creating a Data Service

Using Dependency Injection and Providers

  • Injectors, Provider, and Tokens
  • Configuring Dependency Injection
  • Configuring Your Provider
  • Injecting Services into Components, Directives, and Services

Switching Pages with Routing

  • Understanding the Different Navigation Methods
  • Routing Strategies
  • Setting Up Routes
  • Configuring and Loading Routes
  • Using Parameters in Routes
  • Creating Nested Routes
  • Using Redirect and Wildcard Routes
  • Understanding Route Guards

Using RxJS to Create and Work with Observables in Angular

  • Overview of Observables
  • Overview of RxJS
  • Building & Using Observables in Angular

Generating Forms for User Input

  • Using the Template Driven Forms
  • Using the Reactive Forms
  • Creating custom validation
  • Validating, filtering, and sanitizing form data

Using Pipes

  • Transforming output
  • Built-in Pipes
  • Async Pipe
  • Custom Pipes

Making Calls to External HTTP APIs

  • Sending requests

Using Angular Modules

Testing the Angular 10 Application

  • Using Jasmine for unit testing
  • Using Protractor for end-to-end testing

Debugging the Application

  • Understanding Error Messages in Angular
  • Using Sourcemaps to Debug Code in the Browser
  • Reading TypeScript Compilor diagnostics
  • Using Augury

Optimizing the Angular 10 Application

  • Reworking the code
  • Reducing bundle size and eliminating dead-code

Angular 10 Security

  • How authentication works
  • Using JWT authentication
  • What should and shouldn’t be written in Angular

Deploying an Angular 10 Application to Production

  • Deploying to IIS, Apache, Nginx, etc.

Angular 10 Best Practices

Troubleshooting

Summary and Conclusion

Angular 11 Training Course

Introduction

  • What is Angular?
  • What’s new in Angular 11?

Overview of Typescript and ES6 JavaScript

  • TypeScript Syntax
  • Using the TypeScript transpiler
  • Setting up Angular 11 and Typescript

Overview of Angular 11’s Parts

  • Angular CLI
  • Components
  • Directives
  • Inputs and Outputs
  • Data Binding and Interpolation
  • Event Binding
  • Data Modelling
  • Bootstrapping
  • Experimental Webpack

Creating Your First Angular Application

  • Planning the Application
  • Setting Up an Angular Project
  • Creating a mobile friendly UI using Bootstrap 4 and Sass

Creating a Component

  • Understanding the Component Lifecycle
  • Data Flow
  • Using Templates and Styles
  • Projecting Content
  • Working with AppModule
  • Working with Custom Components
  • Using View Encapsulation
  • Implementing Lifecycle Hooks
  • Using ViewChildren and ContentChildren

Data Binding in Angular 11

  • Understanding Property and Event Binding
  • Binding and Assigning Aliases to Custom Properties
  • Binding and Assigning Aliases to Custom Events

Working with Directives

  • Built-in Directives
  • Custom Directives

Angular 11 Services

  • Creating a Logging Service
  • Creating a Data Service

Using Dependency Injection and Providers

  • Injectors, Provider, and Tokens
  • Configuring Dependency Injection
  • Configuring Your Provider
  • Injecting Services into Components, Directives, and Services

Switching Pages with Routing

  • Understanding the Different Navigation Methods
  • Routing Strategies
  • Setting Up Routes
  • Configuring and Loading Routes
  • Using Parameters in Routes
  • Creating Nested Routes
  • Using Redirect and Wildcard Routes
  • Understanding Route Guards

Using RxJS to Create and Work with Observables in Angular

  • Overview of Observables
  • Overview of RxJS
  • Building & Using Observables in Angular

Generating Forms for User Input

  • Using the Template Driven Forms
  • Using the Reactive Forms
  • Creating custom validation
  • Validating, filtering, and sanitizing form data

Using Pipes

  • Transforming output
  • Built-in Pipes
  • Async Pipe
  • Custom Pipes

Making Calls to External HTTP APIs

  • Sending requests

Testing the Angular 10 Application

  • Using Jasmine for unit testing
  • Using Protractor for end-to-end testing

Debugging the Application

  • Understanding Error Messages in Angular
  • Using Sourcemaps to Debug Code in the Browser
  • Reading TypeScript Compilor diagnostics
  • Using Augury

Optimizing the Angular 11 Application

  • Reworking the code
  • Reducing bundle size and eliminating dead-code

Angular 11 Security

  • How authentication works
  • Using JWT authentication
  • What should and shouldn’t be written in Angular

Deploying an Angular 11 Application to Production

  • Deploying to IIS, Apache, Nginx, etc.

Angular 11 Best Practices

Troubleshooting

Summary and Conclusion

Angular 12 Training Course

Introduction

  • What is Angular?
  • What’s new in Angular 12?

Overview of Typescript and ES6 JavaScript

  • TypeScript Syntax
  • Using the TypeScript transpiler
  • Setting up Angular 12 and Typescript

Overview of Angular 12’s Parts

  • Angular CLI
  • Components
  • Directives
  • Inputs and Outputs
  • Data Binding and Interpolation
  • Event Binding
  • Data Modelling
  • Bootstrapping
  • Experimental Webpack

Creating Your First Angular Application

  • Planning the Application
  • Setting Up an Angular Project
  • Creating a mobile friendly UI using Bootstrap 4 and Sass

Creating a Component

  • Understanding the Component Lifecycle
  • Data Flow
  • Using Templates and Styles
  • Projecting Content
  • Working with AppModule
  • Working with Custom Components
  • Using View Encapsulation
  • Implementing Lifecycle Hooks
  • Using ViewChildren and ContentChildren

Data Binding in Angular 12

  • Understanding Property and Event Binding
  • Binding and Assigning Aliases to Custom Properties
  • Binding and Assigning Aliases to Custom Events

Working with Directives

  • Built-in Directives
  • Custom Directives

Angular 12 Services

  • Creating a Logging Service
  • Creating a Data Service

Using Dependency Injection and Providers

  • Injectors, Provider, and Tokens
  • Configuring Dependency Injection
  • Configuring Your Provider
  • Injecting Services into Components, Directives, and Services

Switching Pages with Routing

  • Understanding the Different Navigation Methods
  • Routing Strategies
  • Setting Up Routes
  • Configuring and Loading Routes
  • Using Parameters in Routes
  • Creating Nested Routes
  • Using Redirect and Wildcard Routes
  • Understanding Route Guards

Using RxJS to Create and Work with Observables in Angular

  • Overview of Observables
  • Overview of RxJS
  • Building & Using Observables in Angular

Generating Forms for User Input

  • Using the Template Driven Forms
  • Using the Reactive Forms
  • Creating custom validation
  • Validating, filtering, and sanitizing form data

Using Pipes

  • Transforming output
  • Built-in Pipes
  • Async Pipe
  • Custom Pipes

Making Calls to External HTTP APIs

  • Sending requests

Testing the Angular 12 Application

  • Using Jasmine for unit testing
  • Exploring Protractor alternatives for end-to-end testing

Debugging the Application

  • Understanding Error Messages in Angular
  • Using Sourcemaps to Debug Code in the Browser
  • Reading TypeScript Compilor diagnostics
  • Using Augury to debug inside a browser

Optimizing the Angular 12 Application

  • Reworking the code
  • Reducing bundle size and eliminating dead-code

Angular 12 Security

  • How authentication works
  • Using JWT authentication
  • What should and shouldn’t be written in Angular

Deploying an Angular 12 Application to Production

  • Deploying to IIS, Apache, Nginx, etc.

Angular 12 Best Practices

Troubleshooting

Summary and Conclusion

Angular 13 Training Course

Introduction

  • Overview of Angular
  • Understanding the Angular framework and architecture
  • Understanding the anatomy of an Angular application
  • What’s new in Angular 13?

Fundamentals of TypeScript

  • Understanding the TypeScript syntax
  • Defining variables and arrays
  • Type in functions

Building Components

  • Overview of components
  • Creating a component using Angular CLI
  • Understanding the component class
  • Using a component template
  • Event Binding

Working with Angular Forms

  • Introduction to forms
  • Using template-driven forms
  • Importing forms module
  • Setting up a form
  • Overview of reactive forms
  • Importing reactive forms module
  • Constructing a form
  • Designing the template

Services, Dependency Injection, and Pipes

  • Overview of service
  • Creating a basic service
  • Understanding service class
  • Introduction to dependency injection
  • Injecting a service instance
  • Introduction to pipes
  • Using built-in pipes
  • Using pipes in HTML template
  • Chaining pipes

Working with HTTP Client

  • Angular HTTP client
  • Using the HHTP client
  • Importing HTTP client module
  • HTTP client request options
  • Returning an HTTP response object
  • Setting request headers
  • Creating a new and simple observable

Angular Component Router

  • Introduction to the Angular component router
  • Navigating view
  • Using the Angular router API
  • Creating a router-enabled application
  • Hosting router components

Implementing Micro-Frontend Architecture with Angular

  • Overview of micro-frontend
  • Advantages and features of micro-frontend
  • Understanding the different approaches to micro-frontend
  • Understanding the micro-frontend framework
  • Creating micro-frontend projects with Angular

Testing Angular Applications

  • Unit testing Angular artifacts
  • Using testing tools
  • Testing steps

Summary and Next Steps

Ionic 4 and Angular for Developers Training Course

Duration

21 hours (usually 3 days including breaks)

Requirements

  • Basic JavaScript, HTML, and CSS programming experience

Audience

  • Web Developers

Overview

Ionic is a web framework for hybrid mobile application development. Ionic 4 brings new innovations to the Ionic platform such as a refactored CLI, changes in navigation, Angular routing, and more.

This instructor-led, live training (online or onsite) is aimed at web developers who wish to create a hybrid mobile application with Ionic 4.

By the end of this training, participants will be able to:

  • Integrate native device features into a hybrid mobile application.
  • Use Angular and Ionic 4 to build a hybrid mobile application.
  • Run a hybrid application on a mobile device emulator.

Format of the Course

  • Interactive lecture and discussion.
  • Lots of exercises and practice.
  • Hands-on implementation in a live-lab environment.

Course Customization Options

  • To request a customized training for this course, please contact us to arrange.

Course Outline

Introduction

Ionic Basics

  • Processes and modules used in Ionic for web development
  • How Ionic and Angular work together

Overview of Angular

  • Components and attributes used in Angular

Preparing the Development Environment

  • Installing Ionic and Angular
  • Installing Cordova
  • Testing installations with Ionic Lab

Templating in Ionic and Angular

  • Using Ionic grids
  • Setting styles and variables
  • Creating CSS rules
  • Generating services
  • Consuming REST APIs
  • Creating and using a data model
  • Testing with Ionic DevApp

UI Components

  • Generating and routing pages
  • Retrieving data
  • Adding page design
  • Using lists
  • Generating pages with modals and fabs
  • Implementing complex lists
  • Using pull to refresh
  • Adding an auth guard

Ionic Native

  • Setting up Ionic Native packages
  • Accessing native device features
  • Testing native device features

Connecting to a Backend

  • Setting up Firebase
  • Creating auth guards and services
  • Sending data via HTTP
  • Fetching, displaying, and loading data

Troubleshooting with Cordova

  • Preparing for Android standards
  • Running a hybrid application on an Android device emulator
  • Preparing for iOS standards
  • Running a hybrid application on a iOS device emulator

Summary and Conclusion

Angular with Firebase and Firestore Training Course

Duration

14 hours (usually 2 days including breaks)

Requirements

  • An understanding of Angular
  • Experience with TypeScript

Audience

  • Angular Developers

Overview

Firebase is a web application development platform. Firestore is a NoSQL database for storing, syncing, and querying data at scale. Users can use Firebase and Firestore while leveraging serverless architecture to build Angular applications.

This instructor-led, live training (online or onsite) is aimed at Angular developers who wish to use Firebase and Firestore to build a back-end for Angular applications.

By the end of this training, participants will be able to:

  • Build a back-end application with Firebase and Firestore.
  • Store, sync, and query data with Firestore.
  • Secure client-side data with Firestore security configurations.

Format of the Course

  • Interactive lecture and discussion.
  • Lots of exercises and practice.
  • Hands-on implementation in a live-lab environment.

Course Customization Options

  • To request a customized training for this course, please contact us to arrange.

Course Outline

Introduction

Firebase and Firestore

  • Firestore NoSQL database
  • FireBase Storage
  • Firebase Cloud

Preparing the Development Environment

  • Installing and configuring Firebase
  • Installing and configuring Firestore

Firestore Quick Start

  • Working with collections
  • Querying data

Angular Service Layers

  • Setting up Angularfire
  • Querying with Angularfire

Authentication

  • Authenticating with Firebase UI

Firestore Security

  • Hiding data
  • Adding roles
  • Implementing a schema

Firebase Cloud Functions

  • Creating triggers
  • Working with image processing

Summary and Conclusion