In this video we go over how to use React's useEffect hook complete with translations to componentDidMount, componentDidUpdate, and componentWillUnmount as well as fetch requests for api and data with Axios.
- 0:00 Introduction
- 0:55 The component lifecycle overview
- 3:00 UseEffect Basics
- 3:50 The array in the useEffect
- 4:00 Mount useEffect (componentDidMount)
- 4:20 Update useEffect (componentDidUpdate)
- 7:00 Unmount / Cleanup useEffect (componentWillUnmount)
- 8:55 No array useEffect
- 9:55 Combining update useEffect with cleanup
- 12:40 API Requests with useEffect
CodeSandbox.io link:
https://codesandbox.io/s/ecstatic-shadow-3dopx?file=/src/TodoList.js
Fake JSON data:
https://jsonplaceholder.typicode.com/
https://jsonplaceholder.typicode.com/todos
Axios Example:
https://www.digitalocean.com/community/tutorials/react-axios-react
React useEffect Hook Docs:
https://reactjs.org/docs/hooks-effect.html
The Forge Coding Tutorials...http://theforge.ca
Follow me on Social Media:
https://www.linkedin.com/in/asistilli/
https://www.tiktok.com/@anthonysistilli
https://www.instagram.com/asistilli/