Introduction

A simple, intuitive React state management library that combines the best of Vue and Zustand

Code React like Vue 💚, manage state like Zustand 🐻

ZenBox

What is ZenBox?

ZenBox is a modern React state management library that combines the simplicity of Zustand with the reactive patterns of Vue. It provides an intuitive API that feels natural to developers familiar with either framework.

Love Zustand & Vue? Meet ZenBox ❤️

🐻 Zustand's Simplicity

const counter = createStore({ count: 0 }); // Auto-type inference

💚 Vue-like Developer Experience

const doubled = useComputed(() => counter.value.count * 2);

useWatch(
  () => counter.value.count,
  (current, prev) => console.log("Count changed from", prev, "to", current)
);

Key Features

  • 🚀 Easy to Use - Intuitive API for immediate productivity
  • High Performance - Only re-renders what actually changed
  • 💪 TypeScript First - Full type inference out of the box, zero boilerplate
  • 🎯 Flexible Architecture - Works for both global and component-level state
  • 📦 Lightweight - 100 lines of core code, under 3KB gzipped (without Immer)