React: Component Lifecycle Events 🌱
- React lets you define components as classes or functions. The methods that you are able to use on these are called lifecycle events. These methods can be called during the lifecycle of a component, and they allow you to update the UI and application states.
## Based off the diagram, what happens first, the ‘render’ or the ‘componentDidMount’? the ‘render’ first.
## What is the very first thing to happen in the lifecycle of React? constractor.
## Put the following things in the order that they happen: componentDidMount, render, constructor, componentWillUnmount, React Updates ??
constructor ,React Updates , render , componentDidMount , componentWillUnmount .
## What does componentDidMount do?
This is where you run statements that requires that the component is already placed in the DOM.
<hr>
Props 🆚 State
## What types of things can you pass in the props?
The values can be any data type, from strings to functions, objects, etc.
## What is the big difference between props and state?
- state > It is something like attributes in OOP and it’s be local to a class.
- props
like parameters - they are passed to a component (from the parent).
## When do we re-render our application?
React components automatically re-render whenever there is a change in their state or props.
## What are some examples of things that we could store in state?
some data like you want to change or update in your application.
Props
- passed into the component(not inside).
- render dynamic data.
- dealing with title and subtitle.
State
- inside the component.
- not deling with dynamic data.
- not deling with title and subtitle.
- What does setState do?
- setState() schedules an update to a component’s state object. When state changes, the component responds by re-rendering.
#### React Bootstrap * React-Bootstrap replaces the code to react components,without unneeded dependencies and that givs us more countrol with the component.