Development๐ฉ๐ป๐ฆณ/Tutorial(3)
-
๋ฆฌ์กํธ ์ด๊ธฐ ์ธํ ๋ฐฉ๋ฒ๊ณผ ๊ธฐ๋ณธ ๋ถ๋ชจ ์์ ์ปดํฌ๋ํธ์์ ๋ถ์ (ํด์ ๋ง์ ์ฃผ์)
๊ฒ์์ผ๋ก ์ ์ ๋์ ๋ถ๋ค์ ctrl + f , Command+fํค๋ก ์ํ์๋ ์๋ฃ ์ฐพ์์ฃผ์ธ์! ๋ฆฌ์กํธ ํํ ๋ฆฌ์ผ ์์ํ๊ฒ ์ต๋๋ค๐ 1.npx create-react-app a -? ํด๋น ๋ช ๋ น์ด๋ Node.js ํ๊ฒฝ์์ React ์ ํ๋ฆฌ์ผ์ด์ ์ ์๋ก ์์ฑํ๊ธฐ ์ํ ๋ช ๋ น์ด์ ๋๋ค. ์ด ๋ช ๋ น์ด์ ๊ฐ ๋ถ๋ถ์ ๊ตฌ์ฒด์ ์ผ๋ก ํด์ํ๋ฉด ๋ค์๊ณผ ๊ฐ์ต๋๋ค: npx: Node.js ํ๊ฒฝ์์ ์คํ๋๋ ํจํค์ง ์คํ ๋๊ตฌ์ ๋๋ค. npx๋ฅผ ์ฌ์ฉํ๋ฉด, Node Package Manager(NPM)์ ํตํด ํจํค์ง๋ฅผ ์ค์นํ์ง ์๊ณ ๋ ํจํค์ง๋ฅผ ์คํํ ์ ์์ต๋๋ค. create-react-app -? create-react-app์ React ์ ํ๋ฆฌ์ผ์ด์ ์ ์ฝ๊ฒ ์์ฑํ ์ ์๋๋ก ๋์์ฃผ๋ ๋๊ตฌ์ ๋๋ค. ์ด ๋๊ตฌ๋ React ํ๋ก์ ํธ์ ๊ธฐ๋ณธ ๊ตฌ์กฐ๋ฅผ ์ค์ ..
2023.12.01 -
๋ฆฌ์กํธ์ ํ: ๊ณ ์ฑ๋ฅ ์น ์ฑ ๊ฐ๋ฐ
๋ฆฌ์กํธ(React)๋ ์ธ๊ธฐ ์๋ ์๋ฐ์คํฌ๋ฆฝํธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ก, ์น๊ณผ ๋ชจ๋ฐ์ผ ์ฑ ๊ฐ๋ฐ์์ ๋๋ฆฌ ์ฌ์ฉ๋ฉ๋๋ค. ๋ฆฌ์กํธ์ ์ฃผ์ ์ฅ์ ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค: ์ปดํฌ๋ํธ ๊ธฐ๋ฐ ์ํคํ ์ฒ: ๋ฆฌ์กํธ๋ ์ฌ์ฌ์ฉ ๊ฐ๋ฅํ ์ปดํฌ๋ํธ๋ฅผ ์ฌ์ฉํ์ฌ UI๋ฅผ ๊ตฌ์ถํฉ๋๋ค. ์ด๋ ์ฝ๋์ ๊ด๋ฆฌ์ ์ ์ง ๋ณด์๋ฅผ ์ฉ์ดํ๊ฒ ํ๋ฉฐ, ํฌ๊ณ ๋ณต์กํ ์ ํ๋ฆฌ์ผ์ด์ ์ ๋ ์ฝ๊ฒ ๊ด๋ฆฌํ ์ ์๋๋ก ํด์ค๋๋ค. ์ ์ธ์ UI: ๋ฆฌ์กํธ๋ฅผ ์ฌ์ฉํ๋ฉด, ์ ํ๋ฆฌ์ผ์ด์ ์ด ์ด๋ป๊ฒ ๋ณด์ฌ์ผ ํ ์ง ์ ์ธ์ ์ผ๋ก ๊ธฐ์ ํ ์ ์์ต๋๋ค. ์ด๋ ์ฝ๋๋ฅผ ์ฝ๊ณ ์ดํดํ๊ธฐ ์ฝ๊ฒ ๋ง๋ค๋ฉฐ, ๋์์ธ๊ณผ ์ฝ๋ ๊ฐ์ ์ผ๊ด์ฑ์ ์ ์งํ๋ ๋ฐ ๋์์ด ๋ฉ๋๋ค. ๊ฐ์ DOM: ๋ฆฌ์กํธ๋ ๊ฐ์ DOM์ ์ฌ์ฉํ์ฌ ์ค์ DOM์ ๋ํ ๋ณ๊ฒฝ ์ฌํญ์ ํจ์จ์ ์ผ๋ก ๊ด๋ฆฌํฉ๋๋ค. ์ด๋ ์ ํ๋ฆฌ์ผ์ด์ ์ ์ฑ๋ฅ์ ํฅ์์ํค๊ณ , ๋น ๋ฅธ UI ์ ๋ฐ์ดํธ๋ฅผ ๊ฐ๋ฅํ๊ฒ ..
2023.11.19 -
์์์ ์ฝ๋ ์ด์ผ๊ธฐ 2023.09.11