Introduction to the Course

As Angular continues to reign as one of the top JavaScript frameworks, more developers are seeking out the best way to get started with this extraordinarily flexible and secure framework. This course will teach you how to use Angular to achieve cross-platform high performance with the latest web techniques, extensive integration with modern web standards, and integrated development environments (IDEs).

What is this course about?

The course is especially useful for those new to Angular and will help you to get to grips with the bare bones of the framework needed to start developing Angular apps. You’ll learn how to develop apps by harnessing the power of the Angular command-line interface (CLI), write unit tests, style your apps by following the Material Design guidelines, and finally, deploy them to a hosting provider.

Updated for Angular 15, this new edition covers lots of new features and practices that address the current frontend web development challenges. You’ll find a new dedicated chapter on observables and RxJS, more on error handling and debugging in Angular, and new real-life examples.

By the end of this course, you’ll not only be able to create Angular applications with TypeScript from scratch but also enhance your coding skills with best practices.

Target audience

This course is for JavaScript and full stack developers dipping their feet for the first time into the world of front-end development with Angular, as well as those migrating to the Angular framework to build professional web applications. You’ll need prior exposure to JavaScript and a solid foundation in the basics of web programming before you get started with this course.

What this course covers

The course delves into essential topics such as components, modules, services, and observables, equipping learners with the knowledge and skills needed to create dynamic and responsive web applications. Here’s a detailed breakdown of the course:

• Building Our First Angular Application: This chapter shows how to set up the development environment by installing the Angular CLI and explains how to use schematics (commands) to automate tasks such as code generation and application building. You’ll build a new, simple application using the Angular CLI.

• Introduction to TypeScript: This chapter explains TypeScript, the language that is used when creating Angular applications, and covers the most basic building blocks, such as types, template strings, lambdas, and classes. You’ll learn how to use decorators that are widely used in Angular classes and modules. You’ll also take a look at some of the advanced types and latest features of the language.

• Organizing the Application into Modules: This chapter explains what modules are in Angular and how they differ from modules in TypeScript. You’ll learn about the most common modules that are used in Angular and discuss the purposes of the different types of modules.

• Enabling User Experience with Components: This chapter explains how a component is connected to its template and how to use a TypeScript decorator to configure it. You’ll take a look at how components communicate by passing data to each other using input and output bindings and learn about the different strategies for detecting changes in a component. You’ll also learn how to create standalone components.

• Enriching Applications Using Pipes and Directives: This chapter covers the built-in directives and pipes. You’ll build your own custom pipe and directive and use them in a sample application that demonstrates their use. You’ll also learn the difference between attribute and structural directives.

• Managing Complex Tasks with Services: This chapter explains how the dependency injection mechanism works, how to create and use services in components, and how you can create providers in an Angular application.

• Being Reactive Using Observables and RxJS: This chapter discusses reactive programming and how you can use observables in the context of an Angular application through the RxJS library. You’ll also take a tour of all the common RxJS operators that are used in an Angular application.

• Communicating with Data Services over HTTP: This chapter explains how to interact with a remote backend API and perform CRUD operations with data in Angular. We’ll also investigate how to set additional headers to an HTTP request and intercept such a request to act before sending the request or upon completion.

• Navigating through the Application with Routing: This chapter explains how to use the Angular router in order to activate different parts of an Angular application. You’ll find out how to pass parameters through the URL and how to break an application into routing modules that can be lazily loaded. You’ll then learn how to guard against your components and how to prepare data prior to initialization of the component.

• Collecting User Data with Forms: This chapter explains how to use Angular reactive forms in order to integrate HTML forms and how to set them up using FormGroup and FormControl. You’ll track the interaction of the user in the form and validate input fields.

• Introduction to Angular Material: This chapter discusses how to integrate Google Material Design guidelines into an Angular application using a library called Angular Material that is developed by the Angular team. You’ll take a look at some of the core components of the library and their usage. You’ll also discuss the themes that are bundled with the library and how to install them.

• Unit Testing an Angular Application: This chapter explains how to test Angular artifacts and override them in a test, examines the different parts of a test, and discusses which parts of a component should be tested.

• Bringing the Application to Production: This chapter discusses the hosting providers that are supported by the Angular CLI. You’ll perform build optimizations prior to deployment, and use the Angular CLI to deploy to GitHub Pages.

• Handling Errors and Application Debugging: This chapter explains how to handle different types of errors in an Angular application and deal with errors that come from the framework itself. You’ll learn how to debug an Angular application and how to profile it using Angular DevTools.