https://github.com/fullstackacademy/2207-ftb-et-web-pt-react-lifecycle-demo
Component Lifecycle Methods
https://github.com/fullstackacademy/2207-ftb-et-web-pt-react-lifecycle-demo
Last synced: 9 months ago
JSON representation
Component Lifecycle Methods
- Host: GitHub
- URL: https://github.com/fullstackacademy/2207-ftb-et-web-pt-react-lifecycle-demo
- Owner: FullstackAcademy
- Created: 2022-10-04T00:48:48.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-10-04T21:39:12.000Z (over 3 years ago)
- Last Synced: 2025-04-11T20:21:24.786Z (about 1 year ago)
- Language: JavaScript
- Size: 66.2 MB
- Stars: 0
- Watchers: 11
- Forks: 13
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# React Lifecycle
## About
We will learn about the component lifecycle of React class components.
Here is a [diagram](https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) noting the lifecycle methods.
**In this demo, we will be going over**:
- `render`
- `useEffect hook in relation to componentDidMount(Class based components)`
- `useEffect hook in relation to componentDidUpdate((Class based components)`
- `useEffect hook in relation to componentWillUnmount(class based components)`
**Other concepts that we will talk about are**:
- React list items
- Virtual DOM
- `root.render()` vs. `return statement render`
For this demo, we will be using [`Pokemon API`](https://pokeapi.co/). This will help us generate a RESTful API to fetch data and use it in our applicaiton
## Feature Set
To get a list of the features and implementation details of this demo to try on your own, go [here](https://hackmd.io/@rIwHnhEJTmmcE3kJJ7Joig/rJV56z9Mi)
## To Run
Fork and clone this repo and `npm install` just a disclaimer: I highly encouraged that you `git checkout end` to get the end point and follow along while taking notes instead of trying to type along with me from the starting point.
Then run, `npm run dev`