Welcome to

Demystifying Reactivity with Angular Signals

Course Syllabus and Content

Module 1

Introduction

2 Lessons 13 Minutes

This module initiates your journey by highlighting the significance of lightweight dependencies, improved reactivity, and optimized performance in application development using Angular 17. Understand the reasons driving the upgrade from previous Angular versions to Angular 17.

  • 01Course Introduction
    Sneak Peek00:04:44

    Introduction to Build a Modern Angular Application with Signals

  • 02Project Architecture
    Sneak Peek00:08:57

    Project Architecture Build a Modern Angular Application with Signals

Module 2

Getting Started with Signals

4 Lessons 26 Minutes

Discover the foundational concept of Signals within Angular and its relevance in the ecosystem. Understand the pivotal role Signals play, addressing performance concerns and simplifying Angular application development.

  • 01The Concept of Signals
    Sneak Peek00:08:22

    Getting started with the concept of signals

  • The importance of Signals over Change Detection and Zone.js

  • 03How to Create a Signal
    Sneak Peek00:03:32

    In this lesson, you will learn how to create our first Signals variable in Angular. You get to see how easy it is to declare variables compared to doing it with Observables which has a more robust boilerplate code.

  • 04Reactive Primitives in Signals
    Sneak Peek00:12:35

    Here, you will get to learn about the different Reactive primitives available in Signals, which are writable signals, computed and effects.

Module 3

Signals and Http Requests

3 Lessons 16 Minutes

Combine RxJS and Signals to navigate HTTP requests from REST APIs. Learn to leverage the Interoperability API for managing asynchronous operations within Signals.

  • 01Module 3 Introduction
    Sneak Peek00:00:42

    This video provides an insight into what we are going to do in this module.

  • In this module, you’ll learn how to combine RxJS and Signals when working with HTTP requests from the REST API. We will learn how to work with the Interoperability API when dealing with asynchronous operations in Signals.

  • Here we get to modify the code we wrote previously to fetch data from the server. We go ahead to show the simplicity of Signals by converting the data gotten from the Observable into Signals making use of the Interoperability API.

Module 4

Sharing Data Between Different Components with Signals

6 Lessons 44 Minutes

Explore the techniques of disseminating data across various components using Signals, facilitating efficient communication and data exchange.

  • 01Module 4 Introduction
    Sneak Peek00:00:40

    This video provides an insight into what we are going to do in this module.

  • In this module, we get to display how to spread data across different components with the use of Signals.

  • In this module, we will utilise Signals to increase and decrease the number of items to add to cart =, as well as integrate functionality to remove an item from cart.

  • 04Implement the Checkout Page
    Sneak Peek00:15:42

    In this lesson, we get a summary of all the items that have been added to the cart, which includes the number of items bought and the cart total.

  • 05Exercise
    Sneak Peek00:01:52

    Module Exercise

  • 06Error Handling in Signals
    Sneak Peek00:04:34

    In this lesson, we will take a look at how to handle errors in Signals.

Module 5

Course Wrap Up

1 Lesson 2 Minutes

In the final module, we comprehensively review every concept that's been covered in this course. Additionally, this module provides insights into upcoming features to be integrated into Angular 17 Signals.

  • 01Wrapping up the Course
    Sneak Peek00:02:14

    We will do a review of all the concepts learned in the course and also look at the upcoming features to be integrated into Signals.