We're offering 20% off September Live Online classes! See which courses are applicable.   |   Details

  
AccountIcon BigDataIcon BlogIcon default_resource_icon CartIcon checkmark_icon cloud_devops_icon computer_network_admin_icon cyber_security_icon gsa_schedule_icon human_resources_icon location_icon phone_icon plus_icon programming_software_icon project_management_icon redhat_linux_icon search_icon sonography_icon sql_database_icon webinar_icon

Search UMBC Training Centers

Programming

Angular

Group Training + View more dates & times

                 
Overview

After understanding how HTML5 and JavaScript work together you soon realize that to create truly capable web applications, the code becomes complex and expensive to maintain. That’s where Angular comes in. This framework allows us to drastically reduce the amount of JavaScript code written, making our web apps easier to understand at all levels. Angular lets developers think of their pages as sets of components and makes our web apps truly abstract.

Angular is the framework of choice for organizations who are creating the best and newest web applications. This fun and interactive course will get your developers ready to begin using Angular to keep you at the cutting edge of technology.

Who Should Take This Course

Audience

Client-side web developers with experience in HTML5 and JavaScript

PREREQUISITES

Understanding of HTML5 and a strong grasp of object-oriented JavaScript. Please ask about our 5-day JavaScript course which will prepare you for the JavaScript fluency needed for this course.

Why You Should Take This Course

Upon completion of this course, the student will be able to:

  • Develop single page Angular applications using Typescript
  • Set up a complete Angular development environment
  • Create Components, Directives, Services, Pipes, Forms and Custom Validators
  • Handle advanced network data retrieval tasks using Observables
  • Consume data from REST web services using the Angular HTTP Client
  • Handle push-data connections using the WebSockets protocol
  • Work with Angular Pipes to format data
  • Use advanced Angular Component Router features
  • Test and debug Angular applications using built in tools
  • Work with Angular CLI
Schedule
Course Outline

Intro to Angular

  • What Angular does for you
  • How it evolved
  • The heart of Angular
  • It’s opinionated!
  • The infrastructure

The Angular CLI

  • Why the CLI?
  • Installing
  • Scaffolding an app
  • Scaffolding components
  • How to develop with the CLI
  • Using the built-in node server
  • Going to production

The Big Picture of Angular

  • Components are the heart
  • Properties vs attributes
  • How it all fits together
  • Modules
  • Separation of logic from view
  • The four kinds of bindings
  • How Angular runs
  • Why SPAs?

TypeScript Introduction

  • JavaScript versions (es2015, to the present)
  • Why use TypeScript?
  • How TypeScript works behind the scenes
  • TypeScript features needed for Angular
  • Modules, arrow functions, and classes
  • Public/private members
  • Static typing with TypeScript
  • Constructor shorthand
  • Decorators

Components Introduction

  • To create a component
  • Interpolation – binding data from the class to the view
  • Template references
  • Expressions deep dive
  • The 3 methods of styling a component
  • Stylesheets
  • styleUrls styles

Built-in Directives

  • The 5 different types of directives
  • Attribute directives
  • ngStyle and ngClass
  • The structural directives
  • *ngIf
  • *ngSwitchCase
  • *ngFor

Angular Routing

  • How Angular handles SPAs The steps to routing Setting the root of your SPA The router-outlet
  • How to design and code your routes Handline a direct URL
  • Pushing the user to a route via JavaScript Creating well-designed links
  • Reading route parameters Reading queryStrings

Event Binding

  • All the events Angular supports
  • How to wire up the events
  • Handling the event object

Forms and two-way binding

  • Two-way binding with ngModel
  • Avoiding the common mistakes
  • Validation with status tokens
  • Error tokens
  • Automatic CSS class settings

Composition with Components

  • The case for components
  • The steps to compose
  • Passing data from host to inner
  • The trick to passing data back up
  • Emitting custom events
  • Two-way binding between components

Ajax in Angular

  • Why Angular is the perfect place to handle Ajax and RESTful calls
  • HttpClient and HttpClientModule
  • How to handle the callback with Promises and async/await
  • What’s in the response object
  • How to unwrap it

Observables

  • What is an observable?
  • How they’re different from Promises
  • How to create and process an observable
  • Observables are lazy – why
  • Pipeable (lettable) operators
  • Using them with HTTP and RESTful services

Services in Angular (Time Permitting)

  • Dispelling the wrong beliefs about services – What they really are
  • Best practices and patterns
  • How to add services
  • Best placement in your project
  • Writing and using custom services

Angular Pipes (Time Permitting)

  • Pipes are like Unix pipes
  • All the built-in Angular pipes
  • How to create custom pipes

Modules (Time Permitting)

  • Why modules?
  • Shared modules
  • Creating modules
  • What goes in the decorators?
FAQs
Is there a discount available for current students?

UMBC students and alumni, as well as students who have previously taken a public training course with UMBC Training Centers are eligible for a 10% discount, capped at $250. Please provide a copy of your UMBC student ID or an unofficial transcript or the name of the UMBC Training Centers course you have completed. Asynchronous courses are excluded from this offer.

What is the cancellation and refund policy?

Student will receive a refund of paid registration fees only if UMBC Training Centers receives a notice of cancellation at least 10 business days prior to the class start date for classes or the exam date for exams.

Contact Us