Reactive Patterns with RxJS and Angular Signals: Elevate your Angular 18 applications with RxJS Observables, 2nd Edition

✍ Scribed by Lamis Chebbi

• Publisher: Packt Publishing
• Year: 2024
• Tongue: English
• Leaves: 255
• Category: Library

✦ Synopsis

Leverage the reactive paradigm with RxJS and signals in your Angular applications using common patterns and techniques designed for real-world use cases Key Features
Discover practical reactive patterns to use in your Angular apps to improve the quality and performance of your code
Explore the latest Angular features
Learn about various RxJS operators and techniques
Purchase of the print or Kindle book includes a free PDF eBook
Book DescriptionRxJS is a powerful reactive extension for JavaScript, specializing in asynchronous and event-driven programming. This book serves as a comprehensive, step-by-step guide to learning RxJS and reactivity, helping 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 focus on cultivating skills to handle data reactively, thus improving the application's overall quality, user experience, and developer productivity. As you progress, 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.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
Who this book is 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.
]]>

✦ Table of Contents

Cover
Title Page
Copyright and Credits
Dedication
Foreword
Contributors
Table of Contents
Preface
Part 1: An Introduction to the Reactive World
Chapter 1: Diving into the Reactive Paradigm
Technical requirements
Exploring the pillars of reactive programming
Data streams
Observer patterns
Learning about the marble diagram (our secret weapon)
Highlighting the use of RxJS in Angular
The HttpClient module
The Router module
Reactive forms
The Event emitter
Summary
Chapter 2: Walking through Our Application
Technical requirements
Breaking down our app’s interfaces
View one – the landing page
View two – the New Recipe interface
View three – the My Recipes interface
View four – the My Favourites interface
View five – the Modify Recipe interface
View six – the Recipe Details interface
Reviewing our app’s architecture
Reviewing our app’s components
Summary
Part 2: A Trip into Reactive Patterns
Chapter 3: Fetching Data as Streams
Technical requirements
Defining the data fetch requirement
Exploring the classic pattern for fetching data
Defining the structure of your data
Creating the fetching data service
Creating Angular standalone components
Injecting and subscribing to the service in your component
Displaying the data in the template
Managing unsubscriptions
Exploring the reactive pattern for fetching data
Retrieving data as streams
Defining the stream in your component
Using the async pipe in your template
Highlighting the advantages of the reactive pattern
Using the declarative approach
Using the change detection strategy of OnPush
Diving into the built-in control flow in Angular 17
Structural directives
Built-in control flows
Including built-in control flows in our recipe app
Benefits of built-in control flow
Summary
Chapter 4: Handling Errors Reactively
Technical requirements
Understanding the anatomy of an Observable contract
Exploring error handling patterns and strategies
The replace strategy
The rethrow strategy
The retrying strategy
Choosing the right error handling strategy
Handling errors in our recipe app
Summary
Chapter 5: Combining Streams
Technical requirements
Defining the filtering requirement
Exploring the imperative pattern for filtering data
Exploring the declarative pattern for filtering data
The combineLatest operator
Updating the filter value
Highlighting common pitfalls and best practices
Unnecessary subscriptions
Missing or incomplete values
Performance overhead
Confusing error handling
Summary
chapter 6: Transforming Streams
Technical requirements
Defining the autosave requirement
Exploring the imperative pattern for the autosave feature
Exploring the reactive pattern for the autosave feature
Higher-order Observables
Higher-order mapping operators
Summary
Chapter 7: Sharing Data between Angular Components
Technical requirements
Defining the sharing data requirement
Exploring the reactive pattern to share data
Step 1 – Creating a shared service
Step 2 – Updating the last selected recipe
Step 3 – Consuming the last selected recipe
Wrapping up the data-sharing reactive pattern
Leveraging Deferrable Views in Angular 17
Summary
Part 3: The Power of Angular Signals
Chapter 8: Mastering Reactivity with Angular Signals
Technical requirements
Understanding the motivation behind Signals
The traditional Zone.js approach
The new Signals approach
Unveiling the Signal API
Defining Signals
Creating Signals using the constructor function
Reading Signals
Modifying a writable Signal
Computed Signals
Signal effects
Unlocking the power of RxJS and Angular Signals
Understanding the behavior of toSignal()
Understanding the behavior of toObservable()
Integrating Signals into our recipe app
Fetching data as streams using Signals
Combining streams using Signals
Sharing data using Signals
Transforming streams using Signals
Exploring reactive data binding with Signals
Signal inputs
Model inputs
Signal queries
Summary
Part 4: Multicasting Adventures
Chapter 9: Demystifying Multicasting
Technical requirements
Explaining multicasting versus unicasting
Unicasting and cold Observables
Multicasting and hot Observables
Transforming cold Observables into hot Observables
Exploring RxJS subjects
A plain subject
replaySubject
BehaviorSubject
Highlighting the advantages of multicasting
Summary
Chapter 10: Boosting Performance with Reactive Caching
Technical requirements
Defining the caching requirement
Exploring the reactive pattern to cache streams
The shareReplay operator
Using shareReplay in RecipesApp
Customizing the shareReplay operator
Replacing the shareReplay operator with the share operator
Highlighting the use of caching for side effects
Summary
Chapter 11: Performing Bulk Operations
Technical requirements
Defining the bulk operation requirements
Learning the reactive pattern for bulk operations
The forkJoin operator
The bulk operation reactive pattern
Benefits of the forkJoin operator
Learning the reactive pattern for tracking the bulk operation’s progress
Summary
Chapter 12: Processing Real-Time Updates
Technical requirements
Defining the requirements of real time
Learning the reactive pattern for consuming real-time messages
Creating and using WebSocketSubject
WebSocketSubject in action
Learning the reactive pattern for handling reconnection
Summary
Part 5: Final Touches
Chapter 13: Testing RxJS Observables
Technical requirements
Learning about the subscribe and assert pattern
Testing single-value output methods
Testing multiple-value output methods
Testing timed-value output methods
Learning about the marble testing pattern
Understanding the syntax
Introducing TestScheduler
Implementing marble tests
Testing timed-value output methods
Highlighting testing streams using HttpClientTestingModule
Summary
Index
Other Books You May Enjoy