Search
Duplicate

React ๊ฐœ๋ฐœํ™˜๊ฒฝ ์„ค์น˜

Node.js ์„ค์น˜ํ•˜๊ธฐ (Windows)

1. winget์œผ๋กœ Node.js ์„ค์น˜

winget install OpenJS.NodeJS
Bash
๋ณต์‚ฌ

2. ์„ค์น˜ ํ™•์ธ

์„ค์น˜๊ฐ€ ์™„๋ฃŒ๋˜๋ฉด ๋‹ค์Œ ๋ช…๋ น์–ด๋กœ Node.js์™€ npm ๋ฒ„์ „์„ ํ™•์ธํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:
node --version
Bash
๋ณต์‚ฌ

3. PowerShell ๊ด€๋ฆฌ์ž ๊ถŒํ•œ ์„ค์ •

npm ์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‹คํ–‰ํ•˜๋Š” ๋ฐ ํ•„์š”ํ•œ ๊ถŒํ•œ์„ ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค:
Set-ExecutionPolicy RemoteSigned -Scope CurrentUser
PowerShell
๋ณต์‚ฌ
์ด ๋ช…๋ น์€ ๋กœ์ปฌ์—์„œ ์ž‘์„ฑํ•œ ์Šคํฌ๋ฆฝํŠธ๋Š” ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ์ง€๋งŒ, ์ธํ„ฐ๋„ท์—์„œ ๋‹ค์šด๋กœ๋“œํ•œ ์Šคํฌ๋ฆฝํŠธ๋Š” ์„œ๋ช…๋œ ๊ฒฝ์šฐ์—๋งŒ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ๋„๋ก ์„ค์ •ํ•ฉ๋‹ˆ๋‹ค.

4. React ํ”„๋กœ์ ํŠธ ์ƒ์„ฑ

์ด์ œ React ํ”„๋กœ์ ํŠธ๋ฅผ ์ƒ์„ฑํ•ด ๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. ๋‹ค์Œ ๋ช…๋ น์–ด๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ƒˆ React ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋งŒ๋“ค ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค:
npx create-react-app my-app
Bash
๋ณต์‚ฌ
์œ„ ๋ช…๋ น์–ด๋Š” 'my-app'์ด๋ผ๋Š” ์ด๋ฆ„์˜ ์ƒˆ React ํ”„๋กœ์ ํŠธ๋ฅผ ์ƒ์„ฑํ•ฉ๋‹ˆ๋‹ค. ํ”„๋กœ์ ํŠธ ์ด๋ฆ„์€ ์›ํ•˜๋Š” ๋Œ€๋กœ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

5. ๋ชจ๋“ˆ ์„ค์น˜

React ํ”„๋กœ์ ํŠธ์—์„œ ํ•„์š”ํ•œ ๋ชจ๋“ˆ์„ ์„ค์น˜ํ•˜๋ ค๋ฉด ํ”„๋กœ์ ํŠธ ๋””๋ ‰ํ† ๋ฆฌ๋กœ ์ด๋™ํ•œ ํ›„ npm์„ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค:
โ€ข
ํ”„๋กœ์ ํŠธ๋กœ ์ด๋™
cd my-app
Bash
๋ณต์‚ฌ
npm install
Bash
๋ณต์‚ฌ

6. ์„œ๋ฒ„ ์‹คํ–‰

๊ฐœ๋ฐœ ์„œ๋ฒ„๋ฅผ ์‹คํ–‰ํ•˜๋ ค๋ฉด ๋‹ค์Œ ๋ช…๋ น์–ด๋ฅผ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค:
โ€ข
npx
npm start
Bash
๋ณต์‚ฌ
โ€ข
vite
npm run dev
Bash
๋ณต์‚ฌ
์ด ๋ช…๋ น์–ด๋Š” ๊ฐœ๋ฐœ ์„œ๋ฒ„๋ฅผ ์‹œ์ž‘ํ•˜๊ณ  ๋ธŒ๋ผ์šฐ์ €์—์„œ http://localhost:3000 ์ฃผ์†Œ๋กœ React ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ์ž๋™์œผ๋กœ ์—ด์–ด์ค๋‹ˆ๋‹ค.

7. ๋ธŒ๋ผ์šฐ์ € ์‹คํ–‰