In the ever-evolving landscape of frontend development, React Context has long been a stalwart for state management.
However, the winds of change are blowing as a new contender steps onto the scene: Zustand. In this article, we delve into Zustand by creating a basic interactive todo application.
We’ll take a close look at how Zustand reimagines state management, its core principles, and how it addresses some of the pain points that developers have faced with React Context.
Ready? Lets get started!
Table of Contents
- Setting Up A React/Next.js Project
- Dependencies Installation
- Creating Our Global Zustand Store
- Using Our Zustand Store
Setting Up A React/Next.js Project
- Before you begin, you will need to setup a Next.js 13 or basic React app. Both will work just fine as Next.js supports React client components.