Purnachandra Bandarupurnadev.hashnode.dev·Jan 31, 2025Simplify State Management with ZUSTANDLet's break down how to use Zustand for client-side state management in a Next.js 15 app using the App Router and implement all CRUD functionalities (Create, Read, Update, Delete) for an eCommerce example. Steps: Set up Zustand in a Next.js 15 app. ...zustand
Linh Tranlinhnote.hashnode.dev·Jan 30, 2025How to Use Zustand in Your React ProjectsZustand has recently emerged as a rising star in the world of state management tools, known for its simplicity and scalibilty. In this article, we will learn how to use Zustand in React projects and see why it is simpler compared to other state manag...30 readsHow tozustand
Hitesh Wadilecodeium.hashnode.dev·Jan 29, 2025How to add the Toggle Theme in Next.js 15 using Zustand and TailwindCSSUser prefer to use different theme on websites and application. It’s better to have different Theme Mode according to the user preferences. Today, we will see how to implement such Theme Mode change feature in your website. We are going to implement ...1 like·47 readsTailwind CSS
Abhishek Rautsweabhishek.hashnode.dev·Jan 3, 2025"From Chaos to Control: Mastering State Management in React with Recoil, Redux, and Zustand" 🚀Managing state in React is like playing Jenga—get it right, and everything’s stable; one wrong move, and it’s chaos! 🧩 Let’s dive deep into the evolution of state management, starting with useState, tackling prop drilling, and finally arriving at to...JavaScript
Ramu Narasingathinkthroo.hashnode.dev·Dec 20, 2024LobeChat uses Namespace for action labels in DevTools configurationIn this article, we will look at how the action labels use Namespace in LobeChat devtools. I want to provide a bit of an introduction to the terms such action labels, devtools and how/why they come into the picture. LobeChat uses Zustand for its stat...devtools
mahesh samagandimaheshsamagandi.hashnode.dev·Dec 19, 2024React State Management InsightsReact’s state management tells how components interact and render dynamically. By leveraging hooks like useState and using props for state propagation, React manages UI updates seamlessly. Understanding its internal mechanism and external state manag...React
Ramu Narasingathinkthroo.hashnode.dev·Dec 19, 2024How to configure DevTools for your Zustand store?In this article, you will learn how to configure DevTools for your Zustand store. We will use the Lobechat source code and Zustand documentation as our reference. Debugging a store In the docs, Debugging a store provides this below code as an exampl...devtools
KazooTTTkazoottt.hashnode.dev·Dec 17, 2024分享一下我的zustand错误使用案例什么是 zustand？ zustand 是一个状态管理库，简单易用。 在使用 react-scan 的时候，我发现我在 A 组件中对于 store 的某个 state 的更新，导致了 B 组件的重新渲染，有比较严重的性能问题。 于是我又重新阅读了文档，发现我之前对于 zustand 的使用是错误的。 错误用法 1 没有使用 single selector 或者 shallow 去获取 state 这是之前的写法以及对应的组件，useGlobalStore 中有不只 uploadToServer...zustand
React Mastersreactmasters.hashnode.dev·Dec 6, 2024Zustand vs Recoil: A Comprehensive Comparison for State Management in ReactState management is a critical aspect of building scalable and maintainable React applications. As your application grows, managing state efficiently becomes increasingly complex. Two popular libraries that have emerged to address this challenge are ...React
Okoye Ndidiamakaamikdigital.hashnode.dev·Nov 12, 2024Mastering State Management in React: Choosing the Right Tool for Your ProjectState management is among the major concerns that arise during application development with React when your application grows in size and complexity. Among the state management tools, you may have probably heard of are Redux, Context API, and emergin...State Management
