Master React Patterns
with Real Challenges

This is not another React course. You already know the basics — now it's time to put your skills into practice.

React Challenges provides ready-to-use coding exercises with TypeScript, a pre-styled UI, and a built-in editor with Vim mode.

Focus on writing real React code, reinforce key patterns, and level up your skills faster than ever.

Level Up React Coding Skills

Take your React coding skills to the next level with hands-on exercises covering basics to advanced patterns. Start with easy React JS problems or tackle more advanced ReactJS coding challenges to reinforce your skills in real projects.

  • Practice React coding challenges daily
  • Learn patterns used in real React applications
  • Get ready for React interview coding challenges

Learn by Building Real Features

Build real features like a game or a multi-step form. Each ReactJS coding challenge guides you step by step, helping you apply React practice while reinforcing key patterns and improving your problem-solving skills.

  • Apply React practice in real scenarios
  • Reinforce key React patterns step by step
  • Start with easy React JS problems and advance

Start Practicing React Today

Explore our challenges and boost your React coding skills step by step. Whether you're a beginner or preparing for interviews, these exercises cover everything you need to succeed.

Explore All Challenges

What Sets Us Apart
from Other Platforms

Not all React coding platforms are created equal.
Here's why React Challenges gives you an edge:

  • 1All challenges include TypeScript for real-world coding experience
  • 2Optional Vim mode for developers who love a powerful editor
  • 3Pre-styled UI in every challenge — focus on coding, not design setup
  • 4See both the code and the fully working solution live
  • 5Code only reevaluates on Ctrl+S like VSCode, avoiding preview jank
  • 6Tests run on a server (full Node/Jest), not limited client-side environments
  • 7Monaco editor with TypeScript worker provides real-time type checking, autocomplete, and IntelliSense

Try a Free React Challenge

Experience hands-on React coding right in your browser. This free challenge lets you practice ReactJS coding with live feedback, pre-styled UI, and TypeScript.

Hover over the buttons on the left and right panels to see a short description of each section.

Tic Tac Toe run

Overview

Simple Tic Tac Toe game built with React following the official React tutorial solution.

Requirements

  • Render a 3x3 board of squares.
  • Players alternate turns: ❌ goes first, then 🔵.
  • Clicking on a square marks it with the current player's symbol.
  • Do not allow clicking on an already occupied square.
  • Detect the winner and display it.
  • Track the history of moves and allow jumping to previous moves.
  • After jumping back, new moves should continue from that point.
  • Include a Clear button to reset the board and history.

Notes

  • Use useState for managing the board state and move history.
  • Make sure the Clear button resets both the board and the move history.
  • After jumping back in history and making a new move, ensure future moves are discarded.

Tests

  1. renders board with 9 squares
  2. first click places an X and next move places an O
  3. cannot click on same square twice
  4. winner is declared when a line is completed
  5. after winner no more moves allowed
  6. allows going back and continuing the game from a previous point
  7. clear button resets the game
60:00

Last challenges

#35
30min

Equalizer

Build a dynamic equalizer whose bars animate based on a changing array of values.

useStateuseEffect
#36
30min

Days Old Counter

Create a React component that calculates and displays how many days old a user is based on their birth date.

useStateuseEffect
#37
60min

Event Creation Wizard

Implement a multi-step form (3 steps) for event creation, with Zod validation, conditional navigation, and persistent form values between steps.

useStateuseEffectuseActionState

Fair prices

Limited-time offer: enjoy reduced pricing while we're still below 100 coding challenges!
monthly plan
$9/month
Billed monthly
  • 1Access to all coding challenges
  • 2New challenges every week
  • 3Run and test directly in your browser
annual plan
$5/month
Billed $60yearly
save 44%!
  • 1Access to all coding challenges
  • 2New challenges every week
  • 3Run and test directly in your browser
quarterly plan
$7/month
Billed $21quarterly
save 22%!
  • 1Access to all coding challenges
  • 2New challenges every week
  • 3Run and test directly in your browser
Free
  • 1Start solving free coding challenges
  • 2All challenges include TypeScript and pre-styled layouts
  • 3Code editor with optional Vim mode
  • 4Run and test your code instantly in the browser
Get Started

Frequently Asked Questions