React

Сегодня поговорим о Zustand — суперлёгкой и мощной библиотеке для управления состоянием в React-приложениях.


🧵 Минимализм состояния с Zustand

Создание стора занимает меньше минуты:

import { create } from 'zustand';

const useStore = create((set) => ({
  count: 0,
  increase: () => set((state) => ({ count: state.count + 1 })),
}));

🎯 Как использовать в компоненте:

const Counter = () => {
  const { count, increase } = useStore();

  return (
    <button onClick={increase}>
      Count: {count}
    </button>
  );
};

🧠 Чем хорош Zustand:

* Нет провайдеров.
* Нет бойлерплейта.
* Поддержка middlewares, persist, subscriptions.
* Работает в Next.js, React Native, даже вне React.

Zustand идеально подходит для маленьких и средних приложений. Простой API — максимум гибкости.

✍️ @React_lib

www.tg-me.com/cn/React/com.React_lib/683

765 viewsedited  May 22 at 05:52

Сегодня поговорим о Zustand — суперлёгкой и мощной библиотеке для управления состоянием в React-приложениях.


🧵 Минимализм состояния с Zustand

Создание стора занимает меньше минуты:

import { create } from 'zustand';

const useStore = create((set) => ({
  count: 0,
  increase: () => set((state) => ({ count: state.count + 1 })),
}));

const Counter = () => {
  const { count, increase } = useStore();

  return (
    <button onClick={increase}>
      Count: {count}
    </button>
  );
};

BY React