Build your own

Nothing teaches internals like rebuilding the tools. These projects turn "I use React" into "I understand React" — the difference between Senior and Staff.

React & rendering #

Project	Difficulty	Time	Tags	Best guide
Build a Virtual DOM	🔴	3h	#react #internals	Build your own React ⭐
Build React (fiber + hooks)	🔴	6h	#react #internals	Didact ⭐
Build a JSX → DOM renderer	🔴	3h	#react #compiler	Build your own React
Build the reconciliation / diff algorithm	🔴	3h	#react #internals	Build your own React
Build a scheduler (time-slicing)	🔴	3h	#react #concurrent	React scheduler source
Build useState/useEffect	🔴	2h	#react #hooks	Build your own React
Build a virtualization library	🔴	3h	#performance	Flagship ⭐

State & data #

Project	Difficulty	Time	Tags	Best guide
Build Redux	🟡	2h	#state	Redux: prior art ⭐
Build a state store (Zustand-like)	🟡	2h	#state	Zustand source
Build React Query (cache + fetch)	🔴	4h	#server-state	TanStack Query source
Build a reactive Signals system	🔴	3h	#reactivity	Preact signals source
Build an Event Emitter	🟢	1h	#patterns	Flagship ⭐
Build a Promise from scratch	🟡	2h	#async	Promises/A+ spec ⭐
Build an LRU cache	🟡	1h	#data-structures	BFE.dev

Tooling & framework #

Project	Difficulty	Time	Tags	Best guide
Build a client-side Router	🟡	2h	#routing	MDN: History API ⭐
Build a module bundler (mini-webpack)	🔴	4h	#bundling	minipack ⭐
Build a JS templating engine	🟡	2h	#compiler	Build your own X ⭐
Build a form library	🟡	3h	#forms	react-hook-form source
Build a testing framework (mini-Jest)	🔴	3h	#testing	Build your own X
Build a CSS-in-JS engine	🔴	3h	#css	Build your own X
Build a debounce/throttle util	🟢	1h	#async	Flagship ⭐

📖 The mega-index: build-your-own-x ⭐

Related: 06-react · 13-state-management · 02-browser

Built a great clone tutorial? Link it.