Search icon CANCEL
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon
Reactive Patterns with RxJS and Angular Signals
Reactive Patterns with RxJS and Angular Signals

Reactive Patterns with RxJS and Angular Signals : Elevate your Angular 18 applications with RxJS Observables, subjects, operators, and Angular Signals , Second Edition

eBook
$28.99
Paperback
$35.99
Subscription
Free Trial
Renews at $19.99p/m

What do you get with Print?

Product feature icon Instant access to your digital eBook copy whilst your Print order is Shipped
Product feature icon Paperback book shipped to your preferred address
Product feature icon Download this book in EPUB and PDF formats
Product feature icon Access this title in our online reader with advanced features
Product feature icon DRM FREE - Read whenever, wherever and however you want
Product feature icon AI Assistant (beta) to help accelerate your learning
Table of content icon View table of contents Preview book icon Preview Book

Reactive Patterns with RxJS and Angular Signals

Diving into the Reactive Paradigm

Reactive patterns are reusable solutions to a commonly occurring problem using reactive programming. Behind all these patterns is a new way of thinking, a new architecture, new coding styles, and new tools. That’s what this entire book is based on – useful reactive patterns in Angular applications.

Now, I know you are impatient to write your first reactive pattern in Angular, but before doing so, and in order to help you take full advantage of all the RxJS patterns and leverage the reactive paradigm, we will start by explaining in detail all the fundamentals and preparing the groundwork for the following chapters.

Let’s start with a basic understanding of the reactive paradigm, its advantages, and the problems it solves. Best of all, let’s put a reactive mindset on and start thinking reactively. We will begin by highlighting the pillars and the advantages of the reactive paradigm. Then, we will explain the marble diagram...

Technical requirements

This chapter does not require any environment setup or installation steps.

All the code snippets in this chapter are just examples to illustrate the concept, so you will not need the code repository to follow along. However, if you’re interested, the code for the book can be found at https://github.com/PacktPublishing/Reactive-Patterns-with-RxJS-and-Angular-Signals-Second-Edition.

This book assumes that you have a basic understanding of Angular and RxJS.

Note

This book uses the new Angular documentation site, angular.dev. The previous documentation site, angular.io, will soon be deprecated. Stay connected with the latest updates and resources by accessing the documentation through this link.

Exploring the pillars of reactive programming

Reactive programming is among the major programming paradigms used by developers worldwide. Every programming paradigm solves some problems and has its own advantages. By definition, reactive programming is programming with asynchronous data streams and is based on observer patterns. So, let’s talk about these pillars of reactive programming!

Data streams

Data streams are the spine of reactive programming. Everything that may change or happen over time (you don’t know when exactly) is represented as asynchronous streams such as events, notifications, and messages. Reactive programming is about reacting to changes as soon as they are emitted!

An excellent example of data streams is UI events. Let’s suppose that we have an HTML button and we want to execute an action whenever a user clicks on it. Here, we can think of the click event as a stream:

//HTML code
<button id='save'>Save</button...

Learning about the marble diagram (our secret weapon)

RxJS ships with more than one hundred operators – these are among the building blocks of RxJS, useful for manipulating streams. All the reactive patterns that will be detailed later in this book are based on operators, and when it comes to explaining operators, it is better to refer to a visual representation – that’s where marble diagrams come in!

Marble diagrams are visual representations of the operator’s execution, which will be used in all chapters to understand the behavior of RxJS operators. At first, it might seem daunting, but it is delightfully simple. You only have to understand the anatomy of the diagram and then you’ll be good at reading and translating it.

Marble diagrams represent the execution of an operator, so every diagram will include the following:

  • Input Observable(s): Represents one or many Observables given as input to the operator
  • Operator: Represents the...

Highlighting the use of RxJS in Angular

RxJS is practically a first-class citizen in Angular. It is part of the Angular ecosystem and is used in many features to handle asynchronous tasks. The following are some examples of these features:

  • The HttpClient module
  • The Router module
  • Reactive forms
  • The Event emitter

We will discuss each of the following concepts in the subsequent subsections.

Note

We recommend taking a quick look at https://angular.dev/overview, where you can find further details about the aforementioned features.

The HttpClient module

You might be familiar with the HttpClient API provided by Angular that is used to communicate with a server over the HTTP protocol. The HttpClient service is based on Observables that manage all transactions, which means that the result of calling API methods such as GET, PATCH, POST, and PUT will be an Observable.

In the following code snippet, we have an example of an Angular service that injects...

Summary

In this chapter, we walked you through the fundamentals of reactive programming and in which use cases it shines. Then, we explained the marble diagram that will be our reference for explaining RxJS operators in all the following chapters. Finally, we highlighted the use of reactive programming in Angular by illustrating concrete examples, implementations, and advantages.

Now that we have got the basics right, it is time to start preparing and explaining, in the next chapter, the application that we are going to build throughout this book, where we are going to implement all of the reactive patterns we will learn progressively.

Left arrow icon Right arrow icon
Download code icon Download Code

Key benefits

  • Use practical reactive patterns in your Angular apps to improve the quality and performance of your code
  • Learn performance optimization techniques from a Google Developer Expert for Angular
  • Seamlessly integrate RxJS with Angular features such as components and services
  • Purchase of the print or Kindle book includes a free PDF eBook

Description

RxJS is a powerful reactive extension for JavaScript, specializing in asynchronous and event-driven programming, but you don’t find many books on using RxJS in Angular applications. Written by an industry expert with over a decade of experience, this book helps you navigate reactive patterns, efficient data management, and the streamlined implementation of common features with minimal code. This second edition aligns with the latest version of Angular, introducing new reactive patterns based on Angular Signals, which play a pivotal role in enabling fine-grained reactivity within Angular and enhancing change detection and user interface rendering. Throughout the book, you’ll construct a complete application that incorporates the latest Angular features, such as standalone components, new built-in control flow, deferrable views, and more. You’ll also focus on cultivating skills to handle data reactively, thus improving the application's overall quality, user experience, and developer productivity. The book covers best practices for testing asynchronous streams and optimizing app performance. By the end of this RxJS and Angular book, you’ll not only be able to develop Angular applications by implementing reactive patterns, but also grasp all the best practices, ensuring a well-rounded understanding of RxJS within the Angular framework.

Who is this book for?

If you're a developer working with Angular and RxJS, this book is for you. Designed for anyone at a beginner level in both Angular and RxJS, this book will help you gain experience and harness the potential of RxJS or benefit you if you’re looking to leverage the reactive paradigm within your Angular applications. This book assumes some familiarity with Angular, basic RxJS, and TypeScript, as well as foundational knowledge of functional programming.

What you will learn

  • Get to grips with RxJS core concepts such as Observables, subjects, and operators
  • Use the marble diagram in reactive patterns
  • Delve into stream manipulation, including transforming and combining them
  • Understand memory leak problems using RxJS and best practices to avoid them
  • Build reactive patterns using Angular Signals and RxJS
  • Explore different testing strategies for RxJS apps
  • Discover multicasting in RxJS and how it can resolve complex problems
  • Build a complete Angular app reactively using the latest features of RxJS and Angular
Estimated delivery fee Deliver to Japan

Standard delivery 10 - 13 business days

$8.95

Premium delivery 3 - 6 business days

$34.95
(Includes tracking information)

Product Details

Country selected
Publication date, Length, Edition, Language, ISBN-13
Publication date : Jul 05, 2024
Length: 254 pages
Edition : 2nd
Language : English
ISBN-13 : 9781835087701
Languages :
Tools :

What do you get with Print?

Product feature icon Instant access to your digital eBook copy whilst your Print order is Shipped
Product feature icon Paperback book shipped to your preferred address
Product feature icon Download this book in EPUB and PDF formats
Product feature icon Access this title in our online reader with advanced features
Product feature icon DRM FREE - Read whenever, wherever and however you want
Product feature icon AI Assistant (beta) to help accelerate your learning
Estimated delivery fee Deliver to Japan

Standard delivery 10 - 13 business days

$8.95

Premium delivery 3 - 6 business days

$34.95
(Includes tracking information)

Product Details

Publication date : Jul 05, 2024
Length: 254 pages
Edition : 2nd
Language : English
ISBN-13 : 9781835087701
Languages :
Tools :

Packt Subscriptions

See our plans and pricing
Modal Close icon
$19.99 billed monthly
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Simple pricing, no contract
$199.99 billed annually
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just $5 each
Feature tick icon Exclusive print discounts
$279.99 billed in 18 months
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just $5 each
Feature tick icon Exclusive print discounts

Frequently bought together


Stars icon
Total $ 113.97
Angular Design Patterns and Best Practices
$37.99
Effective Angular
$39.99
Reactive Patterns with RxJS and Angular Signals
$35.99
Total $ 113.97 Stars icon

Table of Contents

20 Chapters
Part 1:An Introduction to the Reactive World Chevron down icon Chevron up icon
Chapter 1: Diving into the Reactive Paradigm Chevron down icon Chevron up icon
Chapter 2: Walking through Our Application Chevron down icon Chevron up icon
Part 2: A Trip into Reactive Patterns Chevron down icon Chevron up icon
Chapter 3: Fetching Data as Streams Chevron down icon Chevron up icon
Chapter 4: Handling Errors Reactively Chevron down icon Chevron up icon
Chapter 5: Combining Streams Chevron down icon Chevron up icon
Chapter 6: Transforming Streams Chevron down icon Chevron up icon
Chapter 7: Sharing Data between Angular Components Chevron down icon Chevron up icon
Part 3: The Power of Angular Signals Chevron down icon Chevron up icon
Chapter 8: Mastering Reactivity with Angular Signals Chevron down icon Chevron up icon
Part 4: Multicasting Adventures Chevron down icon Chevron up icon
Chapter 9: Demystifying Multicasting Chevron down icon Chevron up icon
Chapter 10: Boosting Performance with Reactive Caching Chevron down icon Chevron up icon
Chapter 11: Performing Bulk Operations Chevron down icon Chevron up icon
Chapter 12: Processing Real-Time Updates Chevron down icon Chevron up icon
Part 5: Final Touches Chevron down icon Chevron up icon
Chapter 13: Testing RxJS Observables Chevron down icon Chevron up icon
Index Chevron down icon Chevron up icon
Other Books You May Enjoy Chevron down icon Chevron up icon

Customer reviews

Top Reviews
Rating distribution
Full star icon Full star icon Full star icon Full star icon Half star icon 4.9
(7 Ratings)
5 star 85.7%
4 star 14.3%
3 star 0%
2 star 0%
1 star 0%
Filter icon Filter
Top Reviews

Filter reviews by




serene boyland Aug 14, 2024
Full star icon Full star icon Full star icon Full star icon Full star icon 5
This book is a must have for those looking to expand their knowledge of reactive patterns in angular. Book is full of examples that makes it easy to follow along and learn new techniques. Thanks for providing this awesome book, I'm looking foward to more great content from this Author/Authors.
Amazon Verified review Amazon
Amazon Customer Jul 30, 2024
Full star icon Full star icon Full star icon Full star icon Full star icon 5
Like many people in their continuing learning journey with Angular, appreciation of reactivity comes with time. I was thrown off the deep end into Angular as my first JS frontend framework in college and internships, only using what RXJS I could grab ahold of. Only relatively recent in my job I have taken steps to learn reactivity in a structured way, and this book is a great piece of that foundation. Experienced with Angular or not, this book is as good of an introduction as it is a refresher.Straight to the point, the recipes CRUD app that is built (with repository for reference for each chapter) is a good talking point for the varying aspects of reactivity. A variety of async calls and events for highlighting RXJS, and assorted synchronous state for reference with signals. The preconfigured local server that accompanies the project was especially nice, so I could focus purely on the frontend and how it alone can shape what comes from and is sent to the backend. I think overall, if you work with a lot of API calls like I do, this book covers most scenarios I could think of. Case in point: had I read this before my previous sprint, I wouldn't have wasted so much time handling errors incorrectly around `forkJoin`.As cliche as it sounds, I would say this book is good whether you are a beginner or experienced with approaching reactivity in Angular. Beginners, take your time following the example project and messing around with it as you go. And experienced folks, read along and think "wow, I learned this lesson the hard way. I wish I had this book before." And for both groups, keep your copy bookmarked and on the ready.
Amazon Verified review Amazon
Ricardo Martinez Aug 07, 2024
Full star icon Full star icon Full star icon Full star icon Full star icon 5
But as the text comments, it's not for beginners. Coupled with the hindrance that the Kindle edition has some code errors that have not aided the comprehension on my first reading which I as a non angular nor rxjs expert suffered ...But 2 weeks later and some RxJS angular programming in between have allowed me to really enjoy and value the book
Amazon Verified review Amazon
Manfred S. Jul 19, 2024
Full star icon Full star icon Full star icon Full star icon Full star icon 5
Ich war bereits ein Fan von der 1. Auflage: Reaktive Programming ist für viele Entwickler:innen ein Paradigmenwechsel und deswegen kann das Thema recht ansprungsvoll sein. Genau aus diesem Grund bin ich ein Fan von Lamis' Didaktik: Für jedes Thema gibt es praktische Beispiele, die mit reaktiven Mustern bestimmte Probleme lösen. Man sieht also sofort, wozu das ganz gut ist.Daneben deckt die neue 2. Auflage nun auch Signals und das Zusammenspiel mit RxJS ab. Außerdem geht es auch auf den neuen data-flow in Angular ein.Ein Must-Have für alle Angular-Entwickler:innen!
Amazon Verified review Amazon
Salman Farsi Jul 11, 2024
Full star icon Full star icon Full star icon Full star icon Full star icon 5
“Reactive Patterns with RxJS and Angular Signals” is an exceptional resource for developers looking to deepen their understanding of reactive programming within Angular applications. Lamis Chebbi’s expertise shines through as she explains complex concepts with clarity and precision. The book’s structure, starting from the fundamentals and gradually building up to advanced topics, makes it accessible for both beginners and experienced developers.One of the standout features of this book is its practical approach. Each chapter is filled with real-world examples and hands-on exercises that reinforce the concepts discussed. The integration of RxJS and Angular Signals is particularly well-explained, providing readers with the tools they need to build efficient and reactive applications. The author’s passion for empowering developers is evident throughout the book, making it an inspiring read.Overall, “Reactive Patterns with RxJS and Angular Signals” is a must-read for anyone working with Angular. It not only covers the latest features and best practices but also encourages a deeper understanding of reactive programming principles. Whether you’re looking to improve your skills or stay up-to-date with the latest advancements in Angular, this book is an invaluable addition to your library.
Amazon Verified review Amazon
Get free access to Packt library with over 7500+ books and video courses for 7 days!
Start Free Trial

FAQs

What is the delivery time and cost of print book? Chevron down icon Chevron up icon

Shipping Details

USA:

'

Economy: Delivery to most addresses in the US within 10-15 business days

Premium: Trackable Delivery to most addresses in the US within 3-8 business days

UK:

Economy: Delivery to most addresses in the U.K. within 7-9 business days.
Shipments are not trackable

Premium: Trackable delivery to most addresses in the U.K. within 3-4 business days!
Add one extra business day for deliveries to Northern Ireland and Scottish Highlands and islands

EU:

Premium: Trackable delivery to most EU destinations within 4-9 business days.

Australia:

Economy: Can deliver to P. O. Boxes and private residences.
Trackable service with delivery to addresses in Australia only.
Delivery time ranges from 7-9 business days for VIC and 8-10 business days for Interstate metro
Delivery time is up to 15 business days for remote areas of WA, NT & QLD.

Premium: Delivery to addresses in Australia only
Trackable delivery to most P. O. Boxes and private residences in Australia within 4-5 days based on the distance to a destination following dispatch.

India:

Premium: Delivery to most Indian addresses within 5-6 business days

Rest of the World:

Premium: Countries in the American continent: Trackable delivery to most countries within 4-7 business days

Asia:

Premium: Delivery to most Asian addresses within 5-9 business days

Disclaimer:
All orders received before 5 PM U.K time would start printing from the next business day. So the estimated delivery times start from the next day as well. Orders received after 5 PM U.K time (in our internal systems) on a business day or anytime on the weekend will begin printing the second to next business day. For example, an order placed at 11 AM today will begin printing tomorrow, whereas an order placed at 9 PM tonight will begin printing the day after tomorrow.


Unfortunately, due to several restrictions, we are unable to ship to the following countries:

  1. Afghanistan
  2. American Samoa
  3. Belarus
  4. Brunei Darussalam
  5. Central African Republic
  6. The Democratic Republic of Congo
  7. Eritrea
  8. Guinea-bissau
  9. Iran
  10. Lebanon
  11. Libiya Arab Jamahriya
  12. Somalia
  13. Sudan
  14. Russian Federation
  15. Syrian Arab Republic
  16. Ukraine
  17. Venezuela
What is custom duty/charge? Chevron down icon Chevron up icon

Customs duty are charges levied on goods when they cross international borders. It is a tax that is imposed on imported goods. These duties are charged by special authorities and bodies created by local governments and are meant to protect local industries, economies, and businesses.

Do I have to pay customs charges for the print book order? Chevron down icon Chevron up icon

The orders shipped to the countries that are listed under EU27 will not bear custom charges. They are paid by Packt as part of the order.

List of EU27 countries: www.gov.uk/eu-eea:

A custom duty or localized taxes may be applicable on the shipment and would be charged by the recipient country outside of the EU27 which should be paid by the customer and these duties are not included in the shipping charges been charged on the order.

How do I know my custom duty charges? Chevron down icon Chevron up icon

The amount of duty payable varies greatly depending on the imported goods, the country of origin and several other factors like the total invoice amount or dimensions like weight, and other such criteria applicable in your country.

For example:

  • If you live in Mexico, and the declared value of your ordered items is over $ 50, for you to receive a package, you will have to pay additional import tax of 19% which will be $ 9.50 to the courier service.
  • Whereas if you live in Turkey, and the declared value of your ordered items is over € 22, for you to receive a package, you will have to pay additional import tax of 18% which will be € 3.96 to the courier service.
How can I cancel my order? Chevron down icon Chevron up icon

Cancellation Policy for Published Printed Books:

You can cancel any order within 1 hour of placing the order. Simply contact customercare@packt.com with your order details or payment transaction id. If your order has already started the shipment process, we will do our best to stop it. However, if it is already on the way to you then when you receive it, you can contact us at customercare@packt.com using the returns and refund process.

Please understand that Packt Publishing cannot provide refunds or cancel any order except for the cases described in our Return Policy (i.e. Packt Publishing agrees to replace your printed book because it arrives damaged or material defect in book), Packt Publishing will not accept returns.

What is your returns and refunds policy? Chevron down icon Chevron up icon

Return Policy:

We want you to be happy with your purchase from Packtpub.com. We will not hassle you with returning print books to us. If the print book you receive from us is incorrect, damaged, doesn't work or is unacceptably late, please contact Customer Relations Team on customercare@packt.com with the order number and issue details as explained below:

  1. If you ordered (eBook, Video or Print Book) incorrectly or accidentally, please contact Customer Relations Team on customercare@packt.com within one hour of placing the order and we will replace/refund you the item cost.
  2. Sadly, if your eBook or Video file is faulty or a fault occurs during the eBook or Video being made available to you, i.e. during download then you should contact Customer Relations Team within 14 days of purchase on customercare@packt.com who will be able to resolve this issue for you.
  3. You will have a choice of replacement or refund of the problem items.(damaged, defective or incorrect)
  4. Once Customer Care Team confirms that you will be refunded, you should receive the refund within 10 to 12 working days.
  5. If you are only requesting a refund of one book from a multiple order, then we will refund you the appropriate single item.
  6. Where the items were shipped under a free shipping offer, there will be no shipping costs to refund.

On the off chance your printed book arrives damaged, with book material defect, contact our Customer Relation Team on customercare@packt.com within 14 days of receipt of the book with appropriate evidence of damage and we will work with you to secure a replacement copy, if necessary. Please note that each printed book you order from us is individually made by Packt's professional book-printing partner which is on a print-on-demand basis.

What tax is charged? Chevron down icon Chevron up icon

Currently, no tax is charged on the purchase of any print book (subject to change based on the laws and regulations). A localized VAT fee is charged only to our European and UK customers on eBooks, Video and subscriptions that they buy. GST is charged to Indian customers for eBooks and video purchases.

What payment methods can I use? Chevron down icon Chevron up icon

You can pay with the following card types:

  1. Visa Debit
  2. Visa Credit
  3. MasterCard
  4. PayPal
What is the delivery time and cost of print books? Chevron down icon Chevron up icon

Shipping Details

USA:

'

Economy: Delivery to most addresses in the US within 10-15 business days

Premium: Trackable Delivery to most addresses in the US within 3-8 business days

UK:

Economy: Delivery to most addresses in the U.K. within 7-9 business days.
Shipments are not trackable

Premium: Trackable delivery to most addresses in the U.K. within 3-4 business days!
Add one extra business day for deliveries to Northern Ireland and Scottish Highlands and islands

EU:

Premium: Trackable delivery to most EU destinations within 4-9 business days.

Australia:

Economy: Can deliver to P. O. Boxes and private residences.
Trackable service with delivery to addresses in Australia only.
Delivery time ranges from 7-9 business days for VIC and 8-10 business days for Interstate metro
Delivery time is up to 15 business days for remote areas of WA, NT & QLD.

Premium: Delivery to addresses in Australia only
Trackable delivery to most P. O. Boxes and private residences in Australia within 4-5 days based on the distance to a destination following dispatch.

India:

Premium: Delivery to most Indian addresses within 5-6 business days

Rest of the World:

Premium: Countries in the American continent: Trackable delivery to most countries within 4-7 business days

Asia:

Premium: Delivery to most Asian addresses within 5-9 business days

Disclaimer:
All orders received before 5 PM U.K time would start printing from the next business day. So the estimated delivery times start from the next day as well. Orders received after 5 PM U.K time (in our internal systems) on a business day or anytime on the weekend will begin printing the second to next business day. For example, an order placed at 11 AM today will begin printing tomorrow, whereas an order placed at 9 PM tonight will begin printing the day after tomorrow.


Unfortunately, due to several restrictions, we are unable to ship to the following countries:

  1. Afghanistan
  2. American Samoa
  3. Belarus
  4. Brunei Darussalam
  5. Central African Republic
  6. The Democratic Republic of Congo
  7. Eritrea
  8. Guinea-bissau
  9. Iran
  10. Lebanon
  11. Libiya Arab Jamahriya
  12. Somalia
  13. Sudan
  14. Russian Federation
  15. Syrian Arab Republic
  16. Ukraine
  17. Venezuela