Day 02: React Life Cycle Methods & Lists & Keys

Moazam AliMoazam Ali
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

0
Subscribe to my newsletter

Read articles from Moazam Ali directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Moazam Ali
Moazam Ali

Frontend Developer who is always passionate in discovering new stuff and building networks.