Essetial React
Functional components
One of the coolest things about React is that we can define our own components, and those components are just function. That’s correct, they’re just functions. So if we wanted to use this all over the place, and use it like this, as “Greeting”, we just wrap it in a function. So we’ll call this “function Greeting”. No arguments here, and return this “Hello, React!” h1. Now to prove I don’t have anything up my sleeve, I’m going to use that older function declaration syntax to do the same thing. [example]. Good to go! Now, I like this newer, kind of terse, syntax a little bit better, so let’s stick with that!
- Overview
- Project setup
- ReactDOM.render and React.createElement
- JSX
- Functional components
- Props
- Class Components
- onClick and other events
- Component initial state
- setState - object form
- setState - functional form
- Conditional rendering in JSX
- this.props.children
- Fetching pokeapi data
- componentDidMount
- setState and fetch
- Lists with Array.map()
- componentWillReceiveProps
- Component props
- Render props
- Separation of Concerns with components
- Higher-order components
- defaultProps
- Render prop actions
- Summary