Zustand State Management
Zustand store, create, selectors, actions, middleware, devtools, persistence
1Apa itu Zustand?
Apa itu Zustand?
Jawaban
Zustand adalah library state management minimalis untuk React yang tidak memerlukan Provider, berbeda dengan Redux atau Context API. Zustand menawarkan API sederhana berbasis hooks dan fungsi create(), dengan bundle size yang sangat kecil (kurang dari 1KB). Zustand memungkinkan pengelolaan state global tanpa kompleksitas arsitektural Redux, sekaligus menghindari masalah performa Context API.
2Bagaimana cara membuat store Zustand dasar?
Bagaimana cara membuat store Zustand dasar?
Jawaban
Fungsi create() digunakan untuk menginisialisasi store Zustand. Fungsi ini menerima callback yang menerima set dan get sebagai parameter, memungkinkan Anda mendefinisikan state awal dan actions. Store yang dikembalikan adalah React hook yang dapat digunakan langsung di komponen. Pendekatan ini menghilangkan kebutuhan boilerplate seperti action creators atau reducers dari Redux.
3Bagaimana cara mengakses state dari store Zustand di dalam komponen?
Bagaimana cara mengakses state dari store Zustand di dalam komponen?
Jawaban
Store yang dibuat dengan create() mengembalikan React hook yang dapat dipanggil langsung di komponen fungsional. Hook ini menerima selector opsional untuk mengekstrak hanya bagian state yang diperlukan. Tanpa selector, hook mengembalikan seluruh state, tetapi ini dapat menyebabkan re-render yang tidak perlu. Pendekatan hook-first membuat Zustand sangat intuitif bagi pengembang React modern.
Apa peran selector di Zustand?
Bagaimana cara menghindari re-render yang tidak perlu dengan selector?
+15 pertanyaan wawancara
Topik wawancara React / Next.js lainnya
Dasar-Dasar JavaScript
Dasar-Dasar React
React Hooks
Siklus hidup komponen
React Router
Manajemen state dengan Context
Form & Controlled Components
Pengambilan Data & API
React Query (TanStack Query)
Styling & CSS-in-JS
Dasar-dasar Next.js
TypeScript dengan React
Data Fetching Next.js
Server Actions Next.js
Routing & Navigasi Next.js
API Routes Next.js
Metadata & SEO di Next.js
Middleware & Auth di Next.js
Pengujian React
Optimasi Performa React
Error Boundaries & Error Handling
Advanced React Patterns
Fitur Lanjutan Next.js
Deployment & Produksi Next.js
Architecture & Design Patterns
React Server Components
Internasionalisasi Next.js
Keamanan React & Praktik Terbaik
Kuasai React / Next.js untuk wawancara berikutnya
Akses semua pertanyaan, flashcards, tes teknis, latihan code review dan simulator wawancara.
Mulai gratis