Day 02: React Life Cycle Methods & Lists & Keys

Day 02: React Life Cycle Methods & Lists & Keys

·

1 min read

#100DaysOfCode

Day 02: React Life Cycle Methods & Lists & Keys

Learned about the react life cycle methods, there are three stages:

1. Mounting

2. Updating

3. Unmounting

Following are the life cycle methods:
1. constructor(): Set up initial state and event handlers.

2. componentDidMount(): Perform side effects after rendering.

3. shouldComponentUpdate(nextProps, nextState): Control re-rendering based on prop/state changes.

4. componentDidUpdate(prevProps, prevState): Perform post-update side effects.

5. componentWillUnmount(): Clean up resources before unmounting.

6. getDerivedStateFromProps(nextProps, prevState): Update state based on new props.

7. getSnapshotBeforeUpdate(prevProps, prevState): Capture info before DOM update.

For lists and keys topic, learned about the need for key props while rendering lists and also learned to display nested lists and add interaction with list items.

#reactjs #frontenddev #webdev #javascript #learnreact