Back To Module Home

Getting Started with Angular

0% completed

Introduction to Angular

Getting Started with Angular Setting Up the Angular CLI Workspace Structure of an Angular Application Summary: Building Our First Angular Application Quiz: Building Our First Angular Application

Organizing Applications into Modules

Overview Introducing Angular Modules Grouping Application Features into Modules Organizing Modules by Type Summary: Organizing Applications into Modules Quiz: Organizing Applications into Modules

Enabling User Experience with Components

Overview Creating Our First Component Creating Standalone Components Interacting with the Template Styling the Component Component Intercommunication Listening for Events Using an Output Binding Local Reference Variables in Templates Deciding on a Change Detection Strategy Performing Component Initialization Detecting Input Binding Changes Summary: Enabling User Experience with Components Quiz: Enabling User Experience with Components Challenge: Toggle Visibility Functionality Solution: Toggle Visibility Functionality

Enrich Applications Using Pipes and Directives

Overview Introducing Directives Iterating Through Data Introduction to Pipes and Creating Interfaces Working with Pipes in Angular Building Custom Pipes Change Detection With Pipes Displaying Dynamic Data Property Binding and Responding to Events Toggling Templates Dynamically Summary: Enrich Applications Using Pipes and Directives Quiz: Enrich Applications Using Pipes and Directives Challenge: Adding a Header Using Angular Directives Solution: Adding a Header Using Angular Directives

Managing Complex Tasks with Services

Overview Introducing Angular DI Providing Dependencies Across the Application Sharing Dependencies through Components Sandboxing Components with Multiple Instances Restricting DI Down the Component Tree Overriding Service Implementation Summary: Managing Complex Tasks with Services Quiz: Managing Complex Tasks with Services

Being Reactive Using Observables and RxJS

Overview Strategies for Handling Asynchronous Information Observables in a Nutshell Reactive Programming in Angular The RxJS Library Higher-Order Observables Subscribing to Observables Unsubscribing from Observables Summary: Being Reactive Using Observables and RxJS Quiz: Being Reactive Using Observables and RxJS Challenge: Click Logger Functionality Solution: Click Logger Functionality

Communicating with Data Services over HTTP

Overview Strategies for Handling Asynchronous Information Setting Up a Backend Fetching Data Through HTTP Fetching Data through HTTP GET request Modifying Data Through HTTP Updating Product Price Removing a Product Authentication and Authorization with HTTP Authorizing User Access Authorizing HTTP Requests Summary: Communicating with Data Services over HTTP Quiz: Communicating with Data Services over HTTP Challenge: Implement Authorization Solution: Implement Authorization

Navigating through Application with Routing

Overview Introducing the Angular Router Configuring the Router Configuring Routing in our Application Creating Feature Routing Modules Handling Unknown Route Paths Navigating Imperatively to a Route Passing Parameters to Routes Reusing Components Using Child Routes Filtering Data Using Query Parameters Preventing Navigation Away from a Route Lazy-Loading Routes Protecting a Lazy-Loaded Module Summary: Navigating through the Application with Routing Quiz: Navigating through the Application with Routing Challenge: Implement Navigation System Using Routing Solution: Implement Navigation System Using Routing

Appendix

Angular CLI: Setup on the Local Machine VS Code Tooling

Conclusion

...

/

Final Remarks

Final Remarks

Here’s a quick summary of what we learned from the “Getting Started with Angular” module.

Congratulations! You have successfully completed the “Getting Started with Angular” module.

Summary

We started by setting up the Angular CLI workspace and ...