What React skills does "Build a Character Counter" practice?

This challenge practices: useState, controlled inputs, derived state. It is rated easy difficulty and takes approximately 12 minutes.

What are the hints for "Build a Character Counter"?

Use useState("") and a controlled textarea with value and onChange Derive remaining = MAX_CHARS - text.length (no extra state needed) Use conditional styling based on remaining count thresholds

easy12 min

Build a Character Counter

Build a textarea with a live character counter that shows how many characters have been typed and how many remain before reaching a maximum limit. The counter should change color when approaching or exceeding the limit.

Skills

useStatecontrolled inputsderived state

Tests

Renders with empty textarea and "0 / 150" count
Updates character count as user types
Shows warning color when near the limit
Shows error color when over the limit

Your Code

Loading editor...