Angular Tutorial Series
Angular, a structural framework for dynamic web apps, lets you use HTML as your template language and enables you to extend HTML’s syntax to express your application’s components clearly and succinctly. The ease in which it allows developers to build expressive, readable and quick to develop web applications has fueled its popularity. Luckily, getting up to speed on developing with Angular v2+ involves mastering just a handful of basics which we cover in this series of Angular tutorials below.
We’ve Made it Easy to Take This Series with You
Want to share this tutorial with your team? We’ve converted the entire series into a downloadable eBook, making it easy to share the tutorial with your colleagues and reference back to it when needed. Click on the button below to get a copy of the Angular tutorial series eBook delivered straight to your inbox.
Angular 9-Part Tutorial Series
Getting Started With The Angular CLI
If you aren’t familiar with the Angular CLI, it’s an installable command line interface that can be used to generate Angular projects, components, services, and modules. It’s an extremely useful tool to use when developing Angular projects.
Application Structure Using Modules
In our second tutorial, we discuss the structure of an Angular application and how to use Angular modules to manage your code base. We explain what an Angular module is, how they work, and how to begin to lay the groundwork for an application’s structure.
Setting Up Routing In Your Application
Our tutorial series continues with instruction on how to set up basic routing in an Angular application using Angular Router Modules. It also provides insight into the functionality of Angular routers.
Components: Inputs, Outputs, and EventEmitters
Having covered the basics of getting started with application routing in Angular, in this chapter we dive into the basics of Angular components. We’ll cover what makes up an Angular component, and give a brief demonstration using component I/O.
Angular Component Lifecycle
In this fifth tutorial, we discuss Angular component lifecycles and how their lifecycle events can be leveraged. This includes an overview of an Angular component’s lifecycle and lifecycle events and an example module to demonstrate when a component’s lifecycle events are fired.
Template Driven Angular Forms
We move next into exploring Angular forms built using its template syntax. Angular provides developers two ways to build forms, one uses template syntax and the other is a model-driven approach. Forms built using the model-driven approach are called “Reactive Forms” which we cover next.
Angular Reactive Forms
In this tutorial, we dive into model-driven forms using Angular’s FormBuilder, FormGroup, and FormControl classes. Angular reactive forms are usually easier to test since you are working with objects and models, making them well-suited for when you require a robust set of validation.
Getting Started With Electron and CLI
A technology stack using Angular and Electron allows developers to build cross-platform desktop applications for Windows, Mac, and Linux using web technologies. In this tutorial, we take you through the steps you can take to turn an Angular application into a native desktop application using Electron.
Using Bootstrap 4 with Angular
In our final tutorial, we discuss what’s new with Bootstrap 4, why it aligns well with Angular and what stands out as our favorite features.