# ReactChallenges.com

> ReactChallenges is a TypeScript-first platform of interactive React coding challenges. Each challenge runs in a browser IDE with a live preview and tests, and is designed for practicing real interview scenarios.

This file lists every published challenge. Each link points to a plain-markdown version of the challenge with its overview, requirements, notes, and tests.

Instructions for language models:

- Use this file as the entry point; fetch a challenge's markdown only when it is relevant to the user's request.
- Explain requirements and rules clearly, suggest hints or step-by-step approaches, and generate example solutions in React when asked.
- Prefer the information in the linked markdown over assumptions; do not invent requirements that are not listed.

## Challenges

- [Counter Component](https://www.reactchallenges.com/challenges/counter-component/index.md): Beginner · useState, useRef · 4 tests
- [ToDo List](https://www.reactchallenges.com/challenges/to-do-list/index.md): Beginner · useState · 5 tests
- [Uncontrolled Form](https://www.reactchallenges.com/challenges/uncontrolled-form/index.md): Beginner · 3 tests
- [Wikipedia Search](https://www.reactchallenges.com/challenges/wikipedia-search/index.md): Intermediate · useState, fetching · 4 tests
- [Memory Card Game](https://www.reactchallenges.com/challenges/memory-card-game/index.md): Intermediate · useState, game · 6 tests
- [Rick & Morty: Double Fetching](https://www.reactchallenges.com/challenges/rick-and-morty-double-fetching/index.md): Intermediate · useState, useEffect, fetching · 6 tests
- [React Chrono: Start/Pause & Stop](https://www.reactchallenges.com/challenges/react-chrono-start-pause-and-stop/index.md): Beginner · useState · 5 tests
- [Accessible Accordion](https://www.reactchallenges.com/challenges/accessible-accordion/index.md): Beginner · useState, useRef, useId · 5 tests
- [Typewriter Effect](https://www.reactchallenges.com/challenges/typewriter-effect/index.md): Beginner · useState · 4 tests
- [Airbnb Card Composition Component](https://www.reactchallenges.com/challenges/airbnb-card-composition-component/index.md): Intermediate · composition · 4 tests
- [useToDo & useLocalStorage Hooks](https://www.reactchallenges.com/challenges/use-to-do-and-use-local-storage-hooks/index.md): Beginner · customHook, useEffect, useState · 6 tests
- [Kanban board](https://www.reactchallenges.com/challenges/kanban-board/index.md): Intermediate · customHook, useEffect, useState · 4 tests
- [Users List with Search, Filter and Pagination](https://www.reactchallenges.com/challenges/users-list-with-search-filter-and-pagination/index.md): Intermediate · customHook, useEffect, useState, useMemo · 11 tests
- [useDebounce vs useThrottle](https://www.reactchallenges.com/challenges/use-debounce-vs-use-throttle/index.md): Intermediate · customHook, useEffect, useState, useRef · 3 tests
- [form useActionState](https://www.reactchallenges.com/challenges/form-use-action-state/index.md): Intermediate · useActionState, forms, react 19 · 3 tests
- [useMemo vs useCallback vs React.memo](https://www.reactchallenges.com/challenges/use-memo-vs-use-callback-vs-react-memo/index.md): Intermediate · useCallback, useMemo, useState, memo · 4 tests
- [Minesweeper](https://www.reactchallenges.com/challenges/minesweeper/index.md): Advanced · useState, useEffect, customHook, game · 14 tests
- [Traffic Light](https://www.reactchallenges.com/challenges/traffic-light/index.md): Intermediate · useState, useEffect · 4 tests
- [Calculator](https://www.reactchallenges.com/challenges/calculator/index.md): Advanced · useState · 16 tests
- [Calculator with reducer](https://www.reactchallenges.com/challenges/calculator-with-reducer/index.md): Intermediate · useState, useReducer · 16 tests
- [Filter AND | OR](https://www.reactchallenges.com/challenges/filter-and-or/index.md): Intermediate · useState · 6 tests
- [Wordle](https://www.reactchallenges.com/challenges/wordle/index.md): Advanced · useState, useEffect, game · 15 tests
- [Wordle simplified version](https://www.reactchallenges.com/challenges/wordle-simplified/index.md): Intermediate · useState, useEffect, game · 15 tests
- [ToDo List with reducer](https://www.reactchallenges.com/challenges/to-do-list-with-reducer/index.md): Beginner · useState, useReducer · 5 tests
- [Arrays - The Must Have](https://www.reactchallenges.com/challenges/arrays-the-must-have/index.md): Beginner · 12 tests
- [Tic Tac Toe](https://www.reactchallenges.com/challenges/tic-tac-toe/index.md): Intermediate · useState, game · 7 tests
- [Objects - The Must have](https://www.reactchallenges.com/challenges/objects-the-must-have/index.md): Intermediate · 7 tests
- [Strong Password](https://www.reactchallenges.com/challenges/strong-password/index.md): Intermediate · useState, useEffect · 10 tests
- [Shopping cart](https://www.reactchallenges.com/challenges/shopping-cart/index.md): Advanced · useState, useContext · 8 tests
- [Building a Reusable useFetch Hook](https://www.reactchallenges.com/challenges/building-a-reusable-use-fetch-hook/index.md): Intermediate · customHook, useState, useEffect · 8 tests
- [Progress Bar](https://www.reactchallenges.com/challenges/progress-bar/index.md): Beginner · useState · 13 tests
- [Sortable Table](https://www.reactchallenges.com/challenges/sortable-table/index.md): Intermediate · useState · 10 tests
- [Connect Four](https://www.reactchallenges.com/challenges/connect-four/index.md): Advanced · useState, customHook, game · 11 tests
- [Simon Says](https://www.reactchallenges.com/challenges/simon-says/index.md): Advanced · useState, useEffect, customHook, game · 15 tests
- [Equalizer](https://www.reactchallenges.com/challenges/equalizer/index.md): Beginner · useState, useEffect · 5 tests
- [Days Old Counter](https://www.reactchallenges.com/challenges/days-old-counter/index.md): Intermediate · useState, useEffect · 4 tests
- [Event Creation Wizard](https://www.reactchallenges.com/challenges/event-creation-wizard/index.md): Intermediate · useState, useEffect, useActionState, forms, react 19 · 12 tests
- [Phone Number Field](https://www.reactchallenges.com/challenges/phone-number-field/index.md): Intermediate · useState, useEffect · 11 tests
- [Color Game](https://www.reactchallenges.com/challenges/color-game/index.md): Intermediate · useState, game · 9 tests
- [Digital Segment Clock](https://www.reactchallenges.com/challenges/digital-segment-clock/index.md): Beginner · useState, useEffect · 14 tests
- [React Quiz](https://www.reactchallenges.com/challenges/react-quiz/index.md): Intermediate · useState, useEffect · 13 tests
- [Countdown](https://www.reactchallenges.com/challenges/countdown/index.md): Beginner · useState, useEffect · 6 tests
- [Tetris](https://www.reactchallenges.com/challenges/tetris/index.md): Advanced · useState, useEffect, game · 30 tests
- [Tetris II](https://www.reactchallenges.com/challenges/tetris-ii/index.md): Intermediate · useState, useEffect, game · 30 tests
- [Reflex Click Game](https://www.reactchallenges.com/challenges/reflex-click-game/index.md): Beginner · useState, useEffect, game · 8 tests
- [New Way of Data Fetching](https://www.reactchallenges.com/challenges/new-way-data-fetching/index.md): Beginner · use, suspense, fetching, react 19 · 4 tests
- [Play Soroban](https://www.reactchallenges.com/challenges/play-soroban/index.md): Intermediate · useState, useEffect, game · 10 tests
- [Airbnb Card Compound Component (Context)](https://www.reactchallenges.com/challenges/airbnb-card-compound-component-context/index.md): Intermediate · composition, useContext · 4 tests
- [Passing refs in React 19](https://www.reactchallenges.com/challenges/passing-refs-in-react-19/index.md): Beginner · useRef, useState, react 19 · 5 tests
- [File explorer](https://www.reactchallenges.com/challenges/file-explorer/index.md): Intermediate · useState, recursion · 7 tests
- [Shopping cart with Redux](https://www.reactchallenges.com/challenges/shopping-cart-with-redux/index.md): Advanced · Redux · 8 tests
- [Use optimistic](https://www.reactchallenges.com/challenges/use-optimistic/index.md): Intermediate · useOptimistic, startTransition, react 19 · 5 tests
- [Best practices](https://www.reactchallenges.com/challenges/best-practices/index.md): Intermediate · useState, useEffect, ESLint, best practices · 6 tests
- [Spreadsheet](https://www.reactchallenges.com/challenges/spreadsheet/index.md): Advanced · useState, useEffect, customHook · 15 tests
- [Simple pagination](https://www.reactchallenges.com/challenges/simple-pagination/index.md): Intermediate · useState, useEffect, fetching · 15 tests
- [Tier List](https://www.reactchallenges.com/challenges/tier-list/index.md): Intermediate · useState, useRef, customHook · 13 tests
- [Invoker Modal](https://www.reactchallenges.com/challenges/invoker-modal/index.md): Beginner · dialog, native apis · 5 tests
- [useEffect vs useLayoutEffect](https://www.reactchallenges.com/challenges/use-effect-vs-use-layout-effect/index.md): Beginner · useEffect, useLayoutEffect, useRef · 1 tests
- [GitHub Contribution Heatmap](https://www.reactchallenges.com/challenges/github-contribution-heatmap/index.md): Intermediate · useState, fetching, SWR · 7 tests
- [Calendar](https://www.reactchallenges.com/challenges/calendar/index.md): Intermediate · useState, date · 16 tests
- [Calendar Events](https://www.reactchallenges.com/challenges/calendar-events/index.md): Intermediate · useState, date, state management · 11 tests
- [Roll Dices](https://www.reactchallenges.com/challenges/roll-dices/index.md): Beginner · useState, Math.random · 8 tests
- [Infinite Scroll](https://www.reactchallenges.com/challenges/infinite-scroll/index.md): Intermediate · useState, useEffect, fetching, IntersectionObserver · 12 tests
- [Command Palette](https://www.reactchallenges.com/challenges/command-palette/index.md): Intermediate · useState, useEffect, useRef, keyboard, accessibility, ARIA · 23 tests
- [OTP Input](https://www.reactchallenges.com/challenges/otp-input/index.md): Intermediate · useState, useRef, forms, keyboard · 12 tests
- [Virtualized List](https://www.reactchallenges.com/challenges/virtualized-list/index.md): Intermediate · useState, useLayoutEffect, useMemo, useRef, performance · 12 tests
- [Undo / Redo](https://www.reactchallenges.com/challenges/undo-redo/index.md): Intermediate · useReducer, useEffect, keyboard · 20 tests