Your First Components
Intermediate
About React →
Components, props, lists and state, each shown live in a mock browser you can actually click. 9 lessons that build on Intro to JavaScript and Intro to HTML.
0 / 9 lessons complete
Start Lesson 1
1
Your First Component
Write a component: a function that returns what to show.
2
Curly Braces Run JavaScript
Drop live JavaScript values into the middle of JSX.
3
One Parent Tag
Return more than one tag by wrapping them in a parent.
4
Props: Components with Inputs
Write a component once and reuse it with different values.
5
Lists with map
Turn an array of data into a list on screen.
6
State: A Counter
Give a component memory, and click a real button to change it.
7
Reading an Input
React to every keystroke as someone types.
8
Showing and Hiding
Let state decide what appears on screen at all.
9
Mini App: Pizza Vote
Combine components, props and state into a tiny working app.