๐ŸŠ ๋‚‘๊นกํŒœ_03 : Next.js ์‹คํ–‰ ํฌํŠธ ๋ณ€๊ฒฝํ•˜๊ธฐ

์ง„ํ–‰ ์ƒํ™ฉ

  • ๋‚‘๊นกํŒœ ํ”ผ๋“œ
    • ํŒ”๋กœ์šฐ๊ฐ€ ์žˆ์„ ๊ฒฝ์šฐ, ํŒ”๋กœ์šฐ์˜ ๊ฒŒ์‹œ๊ธ€์ด ๋‚˜ํƒ€๋‚œ๋‹ค.
  • ๊ณ„์ • ๊ฒ€์ƒ‰ : ์‚ฌ์šฉ์ž ์ด๋ฆ„ ๊ฒ€์ƒ‰
  • ์œ ์ € ํŽ˜์ด์ง€
    • ์œ ์ € ์ •๋ณด
    • ํŒ๋งค์ค‘์ธ ์ƒํ’ˆ์ด ์žˆ์„ ๊ฒฝ์šฐ ํŒ๋งค์ค‘์ธ ์ƒํ’ˆ ๋ชฉ๋ก์ด ๋ณด์ธ๋‹ค
    • ํ”ผ๋“œ๋Š” ๋ฆฌ์ŠคํŠธํ˜•/์•จ๋ฒ”ํ˜•์œผ๋กœ ๋‚˜ํƒ€๋‚œ๋‹ค.
    • ์ƒ๋‹จ ๋”๋ณด๊ธฐ ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ํŒ์—…์ฐฝ์ด ๋‚˜ํƒ€๋‚œ๋‹ค
  • ๋งˆ์ด ํŽ˜์ด์ง€
    • ๋‚˜์˜ ์ •๋ณด : ํ”„๋กœํ•„ ์ˆ˜์ • ๋ฒ„ํŠผ์„ ํด๋ฆญํ•˜๋ฉด, ํ”„๋กœํ•„ ํŽธ์ง‘ ์ฐฝ์ด ๋‚˜ํƒ€๋‚œ๋‹ค.
    • ํŒ๋งค์ค‘์ธ ์ƒํ’ˆ, ํ”ผ๋“œ๋Š” ์œ ์ € ํŽ˜์ด์ง€์™€ ๋™์ผ
    • ํ”ผ๋“œ, ํŒ๋งค์ค‘์ธ ์ƒํ’ˆ์— ๋Œ€ํ•œ ํŒ์—…์ฐฝ์ด ๋‚˜ํƒ€๋‚œ๋‹ค.
  • ํŒ”๋กœ์šฐ ๋ฆฌ์ŠคํŠธ
    • ํŒ”๋กœ์šฐ ํ•œ ์‚ฌ์šฉ์ž์ผ ๊ฒฝ์šฐ ์ทจ์†Œ ๋ฒ„ํŠผ, ํŒ”๋กœ์šฐ ํ•˜์ง€ ์•Š์€ ์‚ฌ์šฉ์ž์ผ ๊ฒฝ์šฐ ํŒ”๋กœ์šฐ ๋ฒ„ํŠผ์ด ๋‚˜ํƒ€๋‚œ๋‹ค.

Next.js ์‹คํ–‰ ํฌํŠธ ๋ณ€๊ฒฝํ•˜๊ธฐ

  • ๋‚‘๊นกํŒœ ๋ง๊ณ  ๋‹ค๋ฅธ ํ”„๋กœ์ ํŠธ๋„ Next.js๋กœ ์ง„ํ–‰ํ•˜๊ณ  ์žˆ๋Š”๋ฐ, ์‹คํ–‰ ํฌํŠธ๊ฐ€ 3000๋ฒˆ์œผ๋กœ ๋™์ผํ•ด์„œ ๋‘˜ ๋‹ค ์ผœ๋†“๊ณ  ์‹ถ์„ ๋•Œ ๋ถˆํŽธ..
    => ์‹คํ–‰ ํฌํŠธ ๋ณ€๊ฒฝํ•ด์„œ ๋‘˜ ๋‹ค ์ผœ๋†”๋ฒ„๋ ค์–ด~

  • package.json ํŒŒ์ผ ๋‚ด "scripts" ์ˆ˜์ •ํ•ด์ฃผ๊ธฐ

    • -p ์˜ต์…˜์„ ์ฃผ๊ณ  ์›ํ•˜๋Š” ํฌํŠธ ๋ฒˆํ˜ธ๋ฅผ ์ž…๋ ฅ : "dev": "next dev -p ${PORT}"
// ๋ณ€๊ฒฝ ์ „
  "scripts": {
    "dev": "next dev"
  }

// ๋ณ€๊ฒฝ ํ›„
  "scripts": {
    "dev": "next dev -p 3005"
  }

์ฐธ๊ณ ๋งํฌ

์ข‹์€ ์›นํŽ˜์ด์ง€ ์ฆ๊ฒจ์ฐพ๊ธฐ