
Discover angular, Google's front-end framework that uses TypeScript for well typed object oriented code, offers a component-based architecture and modular system, with templates, fast rendering, and built-in http services.
Explore the Angular CLI scaffold and project structure, including app root, modules, and components. Learn how bootstrap and imports wire the app for the browser.
Explore angular architecture by examining components, templates, and directives, with data binding, interpellation, and routing. See how services, providers, and dependency injection in modules and bootstrapping enable scalable web apps.
Master angular development by bootstrapping apps with the angular cli, and incrementally adding components, routing, and services to build a Star Wars trivia app with home, movies, and characters views.
Set up a development environment, install the Angular CLI, and initialize an Angular project while examining scaffold structure, bootstrapping, and core architecture (components, routing, services, modules, data binding, dependency injection).
Generate new Angular components with the Seelye tool to build a movies list and a characters list, each with ts, html, and css files inside a components directory.
Nest and compose an Angular 2 app by wiring two components into the root app component, updating module declarations, and using selectors to render movies list and characters list.
Learn how Angular components form the building blocks of an app, generated with the CLI tool, integrated into a module-based tree, and backed by templates and TypeScript.
Set up a new workspace and angular project for routing using ng new engg hy routeing, then npm start. Create two components, movies list and characters list, with routing.
Learn to configure routing to navigate between views in an Angular app by importing the router module into the root module, using forRoot, and enabling routerLink anchors and router outlets.
Explore how Angular services encapsulate data access into singleton, injectable classes and learn how dependency injection lets you inject them into movie and character components to display data.
Set up an Angular project updated to version 5, install Angular CLI, and create movies and characters components. Configure routing with links and a router outlet for Star Wars trivia.
Create and wire two components, two data classes, and two services in an Angular app; load Star Wars data into data files and expose it through services to the UI.
Wire up movie and character services in angular by implementing get movies and get characters methods that return promises. Resolve with data objects and apply injectable decorator for each service.
Update templates to render lists in the browser using ngFor, iterate movies from movie service, and pass each movie to the movie component; repeat for characters list and component.
Explore how Angular modules use module decorator and metadata to organize code into declarations, imports, and providers. Discover how domain, routing, service, and widget modules enable eager and lazy loading.
Refactor your Angular app by creating a movies module with components, services, and a data model and data class. Move files to the new module and set up routing module.
Finish our modules refactor by adding a page not found component, configuring app and movies routing modules with a wildcard route, and ordering imports to enable proper navigation.
Style an Angular 4 app with material design by adding a top toolbar and router-enabled buttons, and build ngFor-driven character and movie lists with a shared material module.
Explore the core of Angular architecture by connecting components, directives, and pipes, and learn how templates, structural and attribute directives, and data transformations shape a working application.
Explore how angular directives manage the dom: structural directives (ngFor, ngIf, ngSwitch, router-outlet) add, remove, or replace elements, while attribute directives (ngStyle, ngClass) dynamically style and control behavior.
Explore how directives and pipes extend components by adding behavior and transforming data in templates. Learn how structural directives manage elements to build dynamic lists and render content conditionally.
Explore the Angular forms module by examining template driven and reactive forms, harnessing two-way binding, validation, and data flow between the UI and the component.
Style reactive forms with Angular Material, bring in the browser animations module, use Angular Material cards with input containers and animated placeholders, and add a raised submit button.
Bind user actions with angular event binding and the forms module, then compare two approaches to forms, focusing on reactive forms with material styled angular forms and validation.
Continue coding and researching Angular, tackling Stack Overflow questions and answers to master its learning curve, and leverage reusable components for simpler design and faster real-world apps.
Angular Version 5
Purpose: To keep this course on the cutting edge of Angular technology and be consistent in providing instruction for the features found in the latest Angular release (v5)
In this update we addressed the major changes in the Angular version 5 major release. Per our course content, including hands-on coding exercises, there were a few breaking changes in the 5.1 releases which ripped across much of the original project code and also included minor, non-breaking changes which outdated certain aspects of our original content.
We've updated all of the course’s code-along video content with version 5 code, including:
Angular-CLI repositioning & syntax usage related to its repositioning
Angular-CLI & npm syntax usage
Angular-CLI template output changes
Material 2 Library Module massive positioning changes
Material 2 inclusion and configuration syntax changes
Material 2/Animations Module repositioning
Fallout of the above deltas outdated a large percentage of the course’s existing content. Each affected video in the series was updated to reflect the current release.
The Angular Forms Module has been in flux since the inception of Angular 2. Fortunately, it has stabilized in the later 4.x releases and we feel comfortable enough in it’s current state to have included it. Forms are a pillar of web-based development and we feel this content adds significant value to the course.
While closely tied to the Angular core library, but not included in it, the Material 2 styling library has endured a lengthy, rough development and release lifecycle. As this library is so closely tied to the Angular core, we’ve included content in this video series from the beginning. Again, in this current release, many breaking changes and previously unavailable features were included. We made significant changes to existing content and created additional content to appropriately cover the current state of the Material library.
As with prior updates to this video series, we applied incremental improvements to existing content (that was not updated for v.4.3 changes) in an effort to continuously improve the overall effectiveness and appeal of the entire course.
Web frameworks can be difficult enough to get your head around at the best of times. When it comes to Angular, it can be especially challenging to keep up; new versions are released every 6 months, and although the latest version is Angular 5, there wasn't actually an 'Angular 3'! Confused? Don't be. This online course will explain it all...
Keeping Current with Angular
This course will continue to be updated regularly to reflect the constant changes in the Angular framework. We're teaching this course in a modular style rather than project-based style so that small changes in Angular can be updated right away, and not affect your ability to learn in any way.
Angular for All
This Angular 5 online course was designed for those who already know a little about creating web UIs with JavaScript tools. Those who have experience programming with a common object oriented scripting language will also be at an advantage. However, absolutely no Angular experience is needed to keep up with the lessons.
What does the course cover? Everything from Angular's best practices in building components, templates, services, routes and modules to designing and building all of the above. You'll also learn how to use templates to create your application's user interface, how to extend HTML with directives, pipes and data binding, and how routing is done with a modular approach.
Each of the most important features of Angular 5 have a dedicated section in this course, along with practical exercises to compound your learning and helpful guidance from our expert tutor every step of the way. Don't worry, we've covered all angles so you can learn what you need to know, and fast.
Whether you're an IT professional, an aspiring web, mobile or service app developer, a tester, a UI designer or an architect, this course will get you right up to speed on Angular 5. By the time you've finished, you'll know how Angular solutions are designed, administered and developed and will have a solid understanding of how to get Angular projects up and running.
What is Angular 5?
Angular, or Angular JS, is a structural framework for dynamic web applications. In other words, it helps turn simple HTML into cool web apps that actually do stuff (rather than just staying static like a simple informational website would do), by using it as a template then extending its syntax to express components. Angular 4 is the newest and most recent 'majorly revamped' version. It is backwards compatible with Angular 2 and 4.
Angular Version 4.3
Purpose: To keep this course on the cutting edge of Angular technology and be consistent in providing instruction for the features found in the latest Angular release (v4.3)
In this update we addressed the major changes in the Angular version 4.3 release (scheduled for early July 2017). Per our course content, including hands-on coding exercises, there were a few breaking changes in the 4.3 beta/rc releases which ripped across much of the original project code and also included minor, non-breaking changes which outdated certain aspects of our original content. With this update we were also able to comfortably include an entirely new course content section focusing on the Angular Forms module. This Angular module has stabilized enough in the v.4.3 release to be included in the course.
We updated all of the course’s code-along video content to fix the breaking changes, including:
Fallout of the above deltas outdated a large percentage of the course’s existing content. Each affected video in the series was updated to reflect the current release.
The Angular Forms Module has been in flux since the inception of Angular 2. Fortunately, it has stabilized in the later 4.x releases and we feel comfortable enough in it’s current state to have included it as the topic for an entire new section in this course update. Forms are a pillar of web-based development and we feel this new content adds significant value to the course.
While closely tied to the Angular core library, but not included in it, the Material 2 styling library has endured a lengthy, rough development and release lifecycle. As this library is so closely tied to the Angular core, we’ve included content in this video series from the beginning. Again, in this current release, many breaking changes and previously unavailable features were included. We made significant changes to existing content and created additional content to appropriately cover the current state of the Material library.
As with prior updates to this video series, we applied incremental improvements to existing content (that was not updated for v.4.3 changes) in an effort to continuously improve the overall effectiveness and appeal of the entire course.
Web frameworks can be difficult enough to get your head around at the best of times. When it comes to Angular, it can be especially challenging to keep up; new versions are released every 6 months, and although the latest version is Angular 4, there wasn't actually an 'Angular 3'! Confused? Don't be. This online course will explain it all...
Keeping Current with Angular
This course will be updated regularly to reflect the constant changes in the Angular framework. We're teaching this course in a modular style rather than project-based style so that small changes in Angular can be updated right away, and not affect your ability to learn in any way.
Angular for All
Master Frameworks
This Angular 4 online course was designed for those who already know a little about creating web Uis with JavaScript tools. Those who have experience programming with a common object oriented scripting language will also be at an advantage. However, absolutely no Angular experience is needed to keep up with the lessons.
What does the course cover? Everything from Angular's best practices in building components, templates, services, routes and modules to designing and building all of the above. You'll also learn how to use templates to create your application's user interface, how to extend HTML with directives, pipes and data binding, and how routing is done with modular speech.
Each of the most important features of Angular 4 have a dedicated section in this course, along with practical exercises to compound your learning and helpful guidance from our expert tutor every step of the way. Don't worry, we've covered all angles so you can learn what you need to know, and fast.
Whether you're an IT professional, an aspiring web, mobile or service app developer, a tester, a UI designer or an architect, this course will get you right up to speed on Angular 4. By the time you've finished, you'll know how Angular solutions are designed, administered and developed and will have a solid understanding of how to get Angular projects up and running.
What is Angular 4?
Angular, or Angular JS, is a structural framework for dynamic web applications. In other words, it helps turn simple HTML into cool web apps that actually do stuff (rather than just staying static like a simple informational website would do), by using it as a template then extending its syntax to express components. Angular 4 is the newest and most recent 'majorly revamped' version. It is backwards compatible with Angular 2.