Immutable JavaScript Data Structures with Immer

Overview

Using immutable data structures provides many benefits, including making your code easier to reason about and less prone to bugs.
However, since JavaScript doesn't include support for immutable data structures out of the box, you need to use a third party library. But which one to choose?
In this self-paced workshop, Immer's creator Michel Westrate will guide you through the creation of a multi-user Gift Tracking app.
You'll learn the basics of using Immer to handle immutable state updates, then go further into change distribution and implementing an undo/redo.
After this workshop, you'll be ready to leverage immutable data structures in your own applications!

Syllabus

Introduction to the in-depth Immer course
Capture Application Logic in Pure Functions to Create Immutable State
Simplify Deep State Updates using Immer produce
Render Immutable Data using React
Profile React Rendering and Optimize with memo to Leverage Structural Sharing
Simplify Immer Producer Functions using Currying
Produces Immutable Data and Avoid Unnecessary Creation of New Data Trees with Immer
Immutable Update State inside React components with useImmer
Return Completely New State from an Immer Producer
Avoid Accidental Returns of New State by using the void Keyword
Write Asynchronous Producers in Immer and Why You Shouldn’t
Type Immutable Immer Data with TypeScript
Update Immutable State with React useReducer through Immer
Capture Patches to Distribute Changes in App State with Immer produceWithPatches
Create a Simple WebSocket Server to Distribute Patches from Immer
Apply Patches using Immer applyPatches to Synchronize State across Clients
Create Stable Patches in Immer by updating with Id instead of Indices
Compress the Immer Patch History by Replaying Patches on a setInterval
Use Immer inversePatches to Build Undo Functionality
Use Immer Patches to Build Redo Functionality