Events and Conditional Rendering

Handle clicks, keys and form submissions with React's synthetic events, then show and hide parts of the UI based on state.

Level

Beginner

Chapters

4

Exercises

2

Reading time

14 min

What you will cover

1. 1. Handling EventsAttaching handlers, the synthetic event object, and passing arguments.
2. 2. Conditional RenderingTernaries, logical AND, early returns and when to use each.
3. 3. Conditional Styling and RemountingToggling classes, and how keys decide whether React reuses or rebuilds an element.
4. 4. Putting It TogetherA short review of the pieces and how they combine into an interactive component.

Up next after this one: Lists, Keys and Forms