MasterReactThroughReal-WorldChallenges

Practice hands-on React coding with TypeScript in a realistic environment. Use the Monaco editor with IntelliSense, autocomplete, and Vim mode to write clean, professional code, and run tests on a real Node + Jest server that mirrors production and interview conditions.

Last challenges

#49
20min

Passing refs in React 19

In this challenge, you will build a simple “Issue Creator” modal. The goal is to demonstrate how refs can be used to control focus in a component that is conditionally rendered.

ddd
useRefuseState
#50
45min

File explorer

Build a recursive file explorer tree view with expandable and collapsible folders, similar to VS Code's sidebar.

ddd
useStaterecursion
#51
45min

Shopping cart with Redux

In this challenge, you'll create a simple shopping cart. The goal is to manage the cart's state globally using Redux Toolkit — allowing users to add, remove, and update products, as well as toggle the cart's visibility.

ddd
Redux
Explore more challenges

Fair prices

Limited-time offer: enjoy reduced pricing while there are fewer than 100 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