Skip to content
Rung

React practice, with feedback

Rung.

Climb from junior to mid, one rung at a time. Write real React, pass automated checks, then ask a mentor to review only what you changed.

Start with exercise 01Browse the index
Fig. 1 · Exercises per level
Exercises
12
Automated checks
81
Total practice
~3h
Open source
Free

How a session works

  1. 1

    Read the brief

    A clear mission, concrete tasks and the theory behind them. Hints stay folded until you ask.

  2. 2

    Write the code

    Edit real React in a live sandbox. The preview and the console update as you type.

  3. 3

    Run the checks

    Every requirement is verified in your browser, instantly. Each failure tells you where to look.

  4. 4

    Ask the mentor

    For a second opinion, an AI reviews only the files you changed and the checks you missed.

Index

Progress is saved in this browser only

Easy

04 exercises
  1. 01State: Build a Counterhooks · useState · beginner10 min→
  2. 02Lists & Keys: Rendering Arraysarrays · map · keys12 min→
  3. 03Conditional Rendering: The Traffic Lightconditional-rendering · objects · dynamic-styles12 min→
  4. 04Lifting State Up: The Mirrorlifting-state · props · synchronization10 min→

Medium

06 exercises
  1. 05Effects: The Ghost TimeruseEffect · cleanup · memory-leaks15 min→
  2. 06Robust Data Fetchingfetching · async-await · useEffect15 min→
  3. 07Divide & Conquer: Custom Hookshooks · refactor · architecture20 min→
  4. 08Context API: Theme Switchercontext-api · hooks · global-state20 min→
  5. 09Forms: The Single Source of Truthforms · state · controlled-components15 min→
  6. 10useRef: DOM Access & PersistenceuseRef · dom · focus15 min→

Hard

02 exercises
  1. 11Performance: The Slow Listperformance · memoization · useMemo25 min→
  2. 12useReducer: An Editor with UndouseReducer · state-machine · undo-redo30 min→