Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
public:computer:react.js [2023/01/02 16:36] – alex | public:computer:react.js [2023/01/10 14:34] (current) – alex | ||
---|---|---|---|
Line 11: | Line 11: | ||
===== Preparings ===== | ===== Preparings ===== | ||
- | * Install Node.js on Ubuntu <sxh bash> | ||
- | # to install node.js we need CURL | ||
- | $ sudo apt install -y curl | ||
- | # install | + | {{page> |
- | $ sudo apt update & sudo apt upgrade -y | + | |
- | $ sudo apt install nodejs | + | |
- | $ nodejs -v | + | |
- | $ sudo apt install npm | + | |
- | $ npm -v | + | |
- | # using PPA | ||
- | $ curl -sL https:// | ||
- | $ sudo bash nodesource_setup.sh | ||
- | $ sudo apt-get install nodejs | ||
- | $ sudo apt-get install build-essential | ||
- | </ | ||
- | * nvm <sxh bash> | + | ===== Getting Started ===== |
- | $ curl -o- https:// | + | ==== Hello, World ==== |
- | $ source ~/.bashrc | + | <sxh html> |
- | $ nvm list-remote | + | <!DOCTYPE html> |
- | $ nvm install | + | <html> |
- | $ nvm list | + | <head> |
- | $ nvm use <version> | + | < |
- | </sxh> | + | |
- | | + | |
- | $ npm install | + | |
- | $ npm -v | + | |
- | </sxh> | + | |
+ | < | ||
+ | |||
+ | <script src=" | ||
+ | <script src=" | ||
+ | <script src=" | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | <div id=" | ||
+ | |||
+ | <script type=" | ||
+ | class App extends React.Component { | ||
+ | render() { | ||
+ | return < | ||
+ | } | ||
+ | } | ||
+ | |||
+ | ReactDOM.render(< | ||
+ | </ | ||
+ | </ | ||
+ | </ | ||
+ | </ | ||
+ | ==== Concepts ==== | ||
+ | * react | ||
+ | * jsx(JavaScript XML) | ||
+ | * props; | ||
+ | * defaultProps | ||
+ | * props.children | ||
+ | *isSpecial | ||
+ | * useState (@React Hooks), state | ||
+ | * 함수형 업데이트 | ||
+ | * useRef (@React Hooks) | ||
+ | * useEffect (@React Hooks) | ||
+ | * useMemo (@React Hooks) | ||
+ | * useCallback (@React Hooks) | ||
+ | * useReducer | ||
+ | * cutom hooks | ||
+ | * LifeCycle | ||
+ | * Mount; constructor, | ||
+ | * Update; getDerivedStateFromProps, | ||
+ | * Unmount; componentWillUnmount | ||
+ | | ||
===== References ===== | ===== References ===== | ||
* [[https:// | * [[https:// | ||
+ | * [[https:// | ||
* [[https:// | * [[https:// | ||
+ | * [[https:// | ||
+ | * [[https:// | ||
* [[https:// | * [[https:// | ||
- | * [[https:// | ||