React JS Fundamentals practice
-
jsx & components & props
- jsx => basic document obj in react
- function components <- props as arg.
- props.name / props.image ... can be passed
- class componenets => class - extends ReactComponent
- how to check if props is passed: [prop-types] ex) {prop.anything} = PropTypes.string.isRequired
-
state
- used when? dynamic data in class component
- manipulate state: [setState()] need to call 'render' again
- [current] get current state ex) this.setState(current => ({count: current.count-1}));
-
component life-cycle
-
Mounting: These methods are called in the following order when an instance of a component is being created and inserted into the DOM
- [constructor()]
- [render()]
- [cmponentDidMount()]
-
Updating: An update can be caused by changes to props or state. These methods are called in the following order when a component is being re-rendered
- [render()]
- [componentDidUpdate()]
-
Unmount: This method is called when a component is being removed from the DOM
- [componentWillUnmount()]
-
-
fetching api data: [axios]
-
wait for inner function: [async] - [await]
-
routing: [react-router-dom]
-
deploying -> package.json
- setup homepage
- npm run build
- setup deploy & predeploy
- DEPLOY!