All Challenges
2 PointsBasic
00:00

MERN Stack: Lightweight Reactive State Store with Selectors & Middleware

Build a mini-Zustand/Redux state store with immutable patchState, selector memoization, and logger/persistence middleware.

### Problem Overview State management is at the core of every React MERN stack interview. You must build a lightweight, dependency-free reactive store (similar to Zustand or Redux core) supporting state reading, immutable partial updates, subscriber notifications, selector functions with equality checks, and unsubscription. ### Functional Requirements 1. **`createStore<T>(initialState: T): Store<T>`**: - Initializes the store with initial state. 2. **`getState(): T`**: - Returns current state snapshot. 3. **`setState(updater: Partial<T> | ((prev: T) => Partial<T>)): void`**: - Merges changes immutably with existing state. 4. **`subscribe(listener: (state: T, prevState: T) => void): () => void`**: - Registers a subscriber callback that fires whenever state updates. 5. **`select<R>(selector: (state: T) => R, listener: (selected: R, prevSelected: R) => void): () => void`**: - Triggers the listener only when the specific selected slice changes.
AI Review Rubric Dimensions (1–10 Points):
  • Immutable state merging
  • Selector memoization
  • Listener isolation
  • Unsubscribe memory safety
solution.tsTYPESCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
19 lines•615 characters•
AI Review Ready