์ฒ์์ผ๋ก ๋ฆฌ์กํธ ์ฌ์ดํธ๋ฅผ ๋ง๋ค์ด ๋ณธ๋ค. ์ปดํผ๋ํธ ๋ฐ props()๋ฅผ ์ด์ฉํ์ฌ ์ฌ์ดํธ๋ฅผ ๋ง๋ค๊ณ ์ฌ์ดํธ๋ฅผ ๊ตฌ์ฑํฉ๋๋ค. ๊ฐ์ ๋(Virtual DOM), ์ปดํฌ๋ํธ ๊ธฐ๋ฐ, ๋ฐ์ดํฐ ์ฒ๋ฆฌ, JSX๋ฅผ ์ด์ฉํ์ฌ ์์ ํ์์ต๋๋ค.
React๋ ์น ํ๋ ์์ํฌ๋ก, ์๋ฐ์คํฌ๋ฆฝํธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ํ๋๋ก์ ์ฌ์ฉ์ ์ธํฐํ์ด์ค๋ฅผ ๋ง๋ค๊ธฐ ์ํด ์ฌ์ฉ๋๋ค.์ฑ๊ธ ํ์ด์ง ์ ํ๋ฆฌ์ผ์ด์ ์ด๋ ๋ชจ๋ฐ์ผ ์ ํ๋ฆฌ์ผ์ด์ ์ ๊ฐ๋ฐ ์ ํ ๋๋ก ์ฌ์ฉ๋ ์ ์๋ค.
- ๋ฆฌ์กํธ์ ํน์ง ๋ค์ฏ๊ฐ์ง
- Data Flow
- Component ๊ธฐ๋ฐ ๊ตฌ์กฐ
- Virtual Dom
- Props and State
- JSX
npx create-react-app react-webpage https://react-basic-site01.netlify.app
๋์์ธ์ ์น์์ ๊ณต์ ๋์ด์๋ ๋์์ธ์ผ๋ก ์์ ํ์๋ค. ํผ๊ทธ๋ง ๋์์ธ
- ํ์์๋ ํ์ผ ์ญ์ [src์๋ app.js / index.js ๋ง ๋จ๊น]
- rafce : ๊ธฐ๋ณธ ๋ฌธ๋ฒ ๋์ค๊ฒ ํ๊ธฐ ---> ํ์ฅ ํ๋ก๊ทธ๋จ์์ ES7๋ฅผ ์ค์นํด์ผ ์๋.
- ๋ฆฌ์กํธ ์์
npm start