์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
์ธํ”„๋Ÿฐ ์˜๋ฌธ ๋ธŒ๋žœ๋“œ ๋กœ๊ณ 
BEST

React + API Server ํ”„๋กœ์ ํŠธ ๊ฐœ๋ฐœ๊ณผ ๋ฐฐํฌ (CI/CD)

SPA์˜ ๋Œ€๋ช…์‚ฌ์ธ React ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์„ ๋งŒ๋“ค๊ณ , Node.js ๊ธฐ๋ฐ˜์˜ API Server์™€ Swagger๋ฅผ ํ†ตํ•œ API ๋ฌธ์„œ๋ฅผ ์ž๋™ ์ƒ์„ฑํ•ฉ๋‹ˆ๋‹ค. ๋กœ์ปฌ ๊ฐœ๋ฐœํ™˜๊ฒฝ๊ณผ ๊ฐœ๋ฐœ์„œ๋ฒ„์˜ ์ฐจ์ด๋ฅผ ์ดํ•ดํ•˜๊ณ , AWS๋ฅผ ์‰ฝ๊ฒŒ ๋”ฐ๋ผ์„œ ์ด์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

Thumbnail

์ดˆ๊ธ‰์ž๋ฅผ ์œ„ํ•ด ์ค€๋น„ํ•œ
[๋ฐ๋ธŒ์˜ต์Šค ยท ์ธํ”„๋ผ] ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๊ฑธ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์–ด์š”

  • React ๊ฐœ๋ฐœ ํ™˜๊ฒฝ๊ณผ ์„œ๋ฒ„ ๊ตฌ์„ฑ

  • Vite ๊ธฐ๋ฐ˜์˜ React ๊ฐœ๋ฐœํ™˜๊ฒฝ ๋งŒ๋“ค๊ธฐ

  • Node.js ๊ธฐ๋ฐ˜์˜ API Server

  • Swagger๋ฅผ ํ†ตํ•œ API ๋ฌธ์„œ ์ž๋™ํ™”

  • ๋กœ์ปฌ ๊ฐœ๋ฐœํ™˜๊ฒฝ๊ณผ ๊ฐœ๋ฐœ์„œ๋ฒ„ ์ฐจ์ด

  • CORS ์ด์Šˆ ํ•ด๊ฒฐ

  • AWS EC2 ์„œ๋ฒ„ ๊ตฌ์ถ• ๊ธฐ๋ณธ

  • Nginx(์›น์„œ๋ฒ„) ๊ธฐ๋ณธ ์‚ฌ์šฉ๋ฒ•

  • Nginx์™€ Node.js ์—ฐ๊ฒฐ

  • ๋ฌด๋ฃŒ HTTPS ์ธ์ฆ์„œ ๋ฐœ๊ธ‰

  • GitHub Actions๋ฅผ ์ด์šฉํ•œ CI/CD ์ž๋™ํ™”

SPA ํ”„๋กœ์ ํŠธ ๋กœ์ปฌ ๊ฐœ๋ฐœํ™˜๊ฒฝ ๊ตฌ์ถ•๋ถ€ํ„ฐ 
์„œ๋ฒ„ ๋ฐฐํฌ ์ž๋™ํ™”๊นŒ์ง€ ์ง์ ‘ ๋„์ „ํ•ด๋ณด์„ธ์š”! โœŒ

๐Ÿ“ข ์ˆ˜๊ฐ• ์ „ ํ™•์ธํ•ด์ฃผ์„ธ์š”! 

  • ๋ณธ ๊ฐ•์˜๋Š” React ๋ฐ Node.js์˜ ๋ฌธ๋ฒ•์€ ์„ค๋ช…ํ•˜์ง€ ์•Š๊ณ , ๊ฐœ๋ฐœํ™˜๊ฒฝ ๊ตฌ์ถ•๊ณผ ๋ฐฐํฌ์— ๋Œ€ํ•ด ๋‹ค๋ฃน๋‹ˆ๋‹ค.
  • ๊ฐ•์˜ ์ž๋ฃŒ๋Š” ์„น์…˜ 1 - SPA ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ๊ตฌ์„ฑ (1) ์ˆ˜์—…์—์„œ ๋‹ค์šด๋กœ๋“œํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

React SPA ํ”„๋กœ์ ํŠธ, 
์„œ๋ฒ„ ๋ฐฐํฌ + ์ž๋™ํ™”๊นŒ์ง€ ๐Ÿ’ก

ํ”„๋ก ํŠธ์—”๋“œ ํ™˜๊ฒฝ๊ณผ API ์„œ๋ฒ„๋ฅผ ๊ฐœ๋ฐœํ–ˆ์ง€๋งŒ ๋ง‰์ƒ ์–ด๋–ป๊ฒŒ ๋ฐฐํฌ๋ฅผ ํ•ด์•ผ ํ• ์ง€ ๋ง‰๋ง‰ํ•˜์‹ ๊ฐ€์š”? ์ƒ์†Œํ•œ ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ์„ธํŒ…๊ณผ ๋ฐฐํฌ CI/CD๋ฅผ ์œ„ํ•œ ํ๋ฆ„์„ ์ตํžˆ๊ณ  ์‹ถ์œผ์‹ ๊ฐ€์š”

์ด ๊ฐ•์˜์—์„œ๋Š” ๋ฆฌ์•กํŠธ ํ”„๋กœ์ ํŠธ์˜ ๋กœ์ปฌ ๊ฐœ๋ฐœํ™˜๊ฒฝ ๊ตฌ์ถ• ๋ฐ ์„œ๋ฒ„ ๋ฐฐํฌ ์ž๋™ํ™” ๊ณผ์ •์„ ์ง์ ‘ ๊ฒฝํ—˜ํ•ด๋ด…๋‹ˆ๋‹ค. ๊ธฐ์กด ์›น ๊ฐœ๋ฐœ ๋ฐฉ์‹๊ณผ ๋‹ฌ๋ผ์ง„ ๋ฆฌ์•กํŠธ๋ฅผ ์ด์šฉํ•œ ์‹ฑ๊ธ€ ํŽ˜์ด์ง€ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜(SPA) ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์„ ๋‹ค๋ฃจ๋ฉฐ, ์ด๋ฅผ ์„œ๋ฒ„์— ๋ฐฐํฌํ•ด์„œ ์„œ๋น„์Šคํ•˜๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ์†Œ๊ฐœํ•ฉ๋‹ˆ๋‹ค. ๋˜ํ•œ Swagger๋ฅผ ์ด์šฉํ•œ API ๋ฌธ์„œ ์ž๋™ํ™”๋ฅผ ํ•จ๊ป˜ ๋‹ค๋ฃจ๋ฉฐ, ๋กœ์ปฌ ๊ฐœ๋ฐœ ํ™˜๊ฒฝ๊ณผ ๋ฐฐํฌ๋˜๋Š” ์„œ๋ฒ„ ํ™˜๊ฒฝ๊ณผ์˜ ์ฐจ์ด๋ฅผ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์œˆ๋„์šฐ ๊ธฐ์ค€์œผ๋กœ ์˜์ƒ์„ ๋งŒ๋“ค์—ˆ์ง€๋งŒ, ๋งฅ๊ณผ ๋ฆฌ๋ˆ…์Šค์—์„œ๋„ ๊ฑฐ์˜ ๋Œ€๋ถ€๋ถ„ ๋™์ผํ•˜๊ฒŒ ๋”ฐ๋ผํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ์„ธํŒ…๋ถ€ํ„ฐ ๋ฐฐํฌ, ์ž๋™ํ™”๊ฐ€ ์–ด๋–ป๊ฒŒ ์ด๋ฃจ์–ด์ง€๋Š”์ง€ ๊ฐ•์˜์—์„œ ์ง์ ‘ ํ™•์ธํ•ด ๋ณด์„ธ์š”!


์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜ ์ถ”์ฒœํ•ฉ๋‹ˆ๋‹ค ๐ŸŽ

  • โœ… ๋ฌธ๋ฒ• ์ค‘์‹ฌ๋ณด๋‹ค ์„œ๋น„์Šค ์ค‘์‹ฌ์˜ ๊ฐœ๋ฐœ์„ ์„ ํ˜ธํ•˜๋Š” ๋ถ„
  • โœ… ์„œ๋ฒ„์— ๋™์ž‘ํ•˜๋Š” ์ฝ”๋“œ๋ฅผ ์–ด๋–ป๊ฒŒ ์˜ฌ๋ฆฌ๋Š”์ง€ ๋ชจ๋ฅด์‹œ๋Š” ๋ถ„
  • โœ… ํด๋ž˜์‹ ์›น๊ณผ ์ฐจ์ด๋‚˜๋Š” ๋ฐฉ๋ฒ•์„ ์•Œ๊ณ  ์‹ถ์€ ๋ถ„
  • โœ… AWS ์‚ฌ์šฉ์ด ์ฒ˜์Œ์ด๊ฑฐ๋‚˜, HTTPS ์„œ๋ฒ„ ๊ตฌ์„ฑ์„ ๋ฐฐ์šฐ๊ณ  ์‹ถ์€ ๋ถ„

๐Ÿ“Œ ๊ฐ•์˜์—์„œ ์“ฐ์ด๋Š” ์Šคํ‚ฌ ๋ชจ์•„๋ณด๊ธฐ

VSCode

Node.js

Git

GitHub

GitHub Actions

AWS EC2

AWS Route53

Nginx + HTTPS
(SSL ์ธ์ฆ์„œ)


ํ•™์Šต ๋‚ด์šฉ ๋ฏธ๋ฆฌ๋ณด๊ธฐ ๐Ÿ“š

01. ์ค€๋น„ํ•˜๊ธฐ

๊ผญ ํ•„์š”ํ•œ ๊ฐœ๋ฐœ ํ”Œ๋žซํผ๊ณผ ๊ฐœ๋ฐœ ๋„๊ตฌ, ๊ด€๋ จ๋œ ๊ณ„์ • ๋“ฑ๋ก ์†Œ๊ฐœ

02. SPA ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ๊ตฌ์„ฑ

๋กœ์ปฌ ์ปดํ“จํ„ฐ์—์„œ ์ž‘์—…ํ•˜๊ธฐ ์œ„ํ•œ ํ”„๋ก ํŠธ์—”๋“œ์™€ ๋ฐฑ์—”๋“œ์˜ ๊ธฐ๋ณธ์ ์ธ ํ”„๋กœ์ ํŠธ ํ™˜๊ฒฝ ๊ตฌ์„ฑ

03. ๋ฐฐํฌ ํ”„๋กœ์„ธ์Šค

์„œ๋น„์Šค๋ฅผ ์œ„ํ•ด ์„œ๋ฒ„์— ๋ฐฐํฌํ•˜๋Š” ์ ˆ์ฐจ, ๋ฐฉ๋ฒ• ์†Œ๊ฐœ

04. ๋„๋ฉ”์ธ ๋“ฑ๋ก๊ณผ HTTPS ์„ค์ •

๋„๋ฉ”์ธ๊ณผ ์„œ๋ฒ„๋ฅผ ์—ฐ๊ฒฐํ•˜๊ณ , HTTPS ์—ฐ๊ฒฐ์„ ์œ„ํ•œ ๋ฐฉ๋ฒ• ์†Œ๊ฐœ

05. ๋ฐฐํฌ ์ž๋™ํ™”ํ•˜๊ธฐ

์ฝ”๋“œ๊ฐ€ ๋ณ€๊ฒฝ๋˜๋ฉด ์ž๋™์œผ๋กœ ๊ฐœ๋ฐœ ์„œ๋ฒ„์— ๋ฐฐํฌ๋˜๋Š” ์ž‘์—… ์„ค๋ช…

06. CORS ์„ค์ •

๋กœ์ปฌ ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์—์„œ ๋ฐœ์ƒํ•˜๋Š” CORS ์ด์Šˆ์™€ ๋นŒ๋“œ ํ™˜๊ฒฝ ๋ณ€์ˆ˜ ๊ตฌ์„ฑ


์ง€์‹๊ณต์œ ์ž ์†Œ๊ฐœ โœ’๏ธ

Kenu (ํ—ˆ๊ด‘๋‚จ)

์ข…์ข… ์œ ํŠœ๋ธŒ์—์„œ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์†ก์„ ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

  • 2000.12 OKJSP ์‹œ์ž‘ โ†’ ํ˜„์žฌ๋Š” okky.kr๋กœ ์šด์˜ ์ค‘
    • ์ผ ๋ฐฉ๋ฌธ 50,000๋ช…์˜ ๊ตญ๋‚ด ์ฃผ์š” ๊ฐœ๋ฐœ์ž ์ปค๋ฎค๋‹ˆํ‹ฐ
  • ็พ okdevtv.com ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์†ก BJ
  • ๅ‰ '18~'19 ํŽซํ”„๋ Œ์ฆˆ CTO
  • ๅ‰ '17~'18 ํ—ฌ๋กœ๋„ค์ด์ฒ˜ CTO
  • ๅ‰ '15~'17 GS SHOP ๋ฒค์ฒ˜ํˆฌ์žํŒ€ CoE ํŒŒํŠธ
  • ๅ‰ '12~'16 ์ „์ž์ •๋ถ€ ํ‘œ์ค€ํ”„๋ ˆ์ž„์›Œํฌ ์—๋ฐ˜์ ค๋ฆฌ์ŠคํŠธ

๋ฐ˜๊ฐ‘์Šต๋‹ˆ๋‹ค, Kenu์ž…๋‹ˆ๋‹ค!

Hello World๋ฅผ ์ฐ์œผ๋ฉด ๊ฐœ๋ฐœ ์ค€๋น„๋Š” ๋๋‚ฌ์Šต๋‹ˆ๋‹ค! ๋‹จ์ˆœํžˆ ์ฝ”๋“œ๋ฅผ ์งœ๋ณธ ๊ฒฝํ—˜์ด ์žˆ๋‹ค๋Š” ์ˆ˜์ค€์—์„œ ๊ทธ์น˜๋Š” ๊ฒƒ์ด ์•„๋‹ˆ๋ผ, ๋‚ด๊ฐ€ ๋งŒ๋“  ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ์‚ฌ๋žŒ๋“ค์ด ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ์„œ๋ฒ„์— ์ž์‹ ์ด ๋งŒ๋“  ์ฝ”๋“œ๋ฅผ ์˜ฌ๋ ค์„œ ์„œ๋น„์Šคํ•  ์ˆ˜ ์žˆ๋Š” ์ž์‹ ๊ฐ์ด ์ƒ๊น๋‹ˆ๋‹ค.


Q&A๋ฅผ ํ™•์ธํ•ด๋ณด์„ธ์š”! ๐Ÿ’ฌ

Q. ๋น„์ „๊ณต์ž๋„ ๋“ค์„ ์ˆ˜ ์žˆ๋Š” ๊ฐ•์˜์ธ๊ฐ€์š”?

๋„ค, ๋น„์ „๊ณต์ž๋„ ์ถฉ๋ถ„ํžˆ ๋“ค์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ด€๋ จ ํ”„๋กœ๊ทธ๋žจ ์„ค์น˜๋ถ€ํ„ฐ ์ด˜์ด˜ํ•˜๊ฒŒ ์„ค๋ช…ํ•ด๋“œ๋ ค์š”!
(์„ ์ˆ˜ ์ง€์‹์œผ๋กœ JavaScript๋ฅผ ์•Œ๊ณ  ๊ณ„์…”์•ผ ํ•ฉ๋‹ˆ๋‹ค!)

Q. ์ˆ˜์—… ๋‚ด์šฉ์„ ์–ด๋А ์ˆ˜์ค€๊นŒ์ง€ ๋‹ค๋ฃจ๋‚˜์š”?

React์™€ Node.js์˜ ๋ฌธ๋ฒ•์€ ๋‹ค๋ฃจ์ง€ ์•Š๊ณ , ๊ฐœ๋ฐœํ™˜๊ฒฝ ๊ตฌ์ถ•๊ณผ ๋ฐฐํฌ ๋ฐ ์ž๋™ํ™”์— ๋Œ€ํ•˜์—ฌ ์„ค๋ช…ํ•ฉ๋‹ˆ๋‹ค.

Q. ๊ฐ•์˜์— ์‚ฌ์šฉ๋˜๋Š” ๊ธฐ์ˆ ๋“ค์˜ ๋ฒ„์ „์ด ์˜ฌ๋ผ๊ฐ€๋ฉด, ๊ฐ•์˜ ์—…๋ฐ์ดํŠธ๊ฐ€ ์ด๋ฃจ์–ด์ง€๋‚˜์š”?

๊ฐ•์˜ ์ง„ํ–‰์ด ์–ด๋ ค์šธ ์ •๋„๋กœ ๋ฉ”์ด์ € ๋ฒ„์ „์ด ์˜ฌ๋ผ๊ฐˆ ๊ฒฝ์šฐ ๊ฐ•์˜ ๋‚ด์šฉ ์—…๋ฐ์ดํŠธ๋Š” ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ๋”ฐ๋ผ์„œ 2025๋…„๊นŒ์ง€๋Š” ์—…๋ฐ์ดํŠธ๋ฅผ ์—ผ๋‘์— ๋‘๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜
์ถ”์ฒœ๋“œ๋ ค์š”!

ํ•™์Šต ๋Œ€์ƒ์€
๋ˆ„๊ตฌ์ผ๊นŒ์š”?

  • ์Šคํƒ€ํŠธ์—… ๊ฐœ๋ฐœ์ž๋กœ ์ž…์‚ฌํ–ˆ๋Š”๋ฐ ์‚ฌ์ˆ˜ ์—†๋Š” ๋ถ„

  • SPA ๊ฐœ๋ฐœํ™˜๊ฒฝ๊ณผ ์„œ๋ฒ„ ๋ฐฐํฌ๊ฐ€ ์ฒ˜์Œ์ด์‹  ๋ถ„

  • AWS ์‚ฌ์šฉ์ด ์ฒ˜์Œ์ด์‹  ๋ถ„

  • HTTPS ์„œ๋ฒ„ ๊ตฌ์„ฑ์„ ๋ฐฐ์šฐ๊ณ  ์‹ถ์€ ๋ถ„

  • CI/CD ์ž…๋ฌธ์ž

์„ ์ˆ˜ ์ง€์‹,
ํ•„์š”ํ• ๊นŒ์š”?

  • JavaScript

์•ˆ๋…•ํ•˜์„ธ์š”
Kenu ํ—ˆ๊ด‘๋‚จ์ž…๋‹ˆ๋‹ค.

744

๋ช…

์ˆ˜๊ฐ•์ƒ

47

๊ฐœ

์ˆ˜๊ฐ•ํ‰

42

๊ฐœ

๋‹ต๋ณ€

4.6

์ 

๊ฐ•์˜ ํ‰์ 

3

๊ฐœ

๊ฐ•์˜

https://okky.kr ์ฐฝ๋ฆฝ์ž์ด๋ฉฐ, https://github.com/kenu/okdevtv ์—์„œ ๋ฐฐ์šด ๊ฒƒ์„ ๊ณต์œ ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

https://mp4.okdevtv.com ์— ๊ฐœ๋ฐœ๊ด€๋ จ ์ฑ„๋„์˜ ์ตœ์‹  ์˜์ƒ์„ ๋ชจ์œผ๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

KenuHeo ์œ ํŠœ๋ธŒ์—์„œ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ฐฉ์†ก์„ 500ํšŒ ์ด์ƒ ์ง„ํ–‰ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

 

์ปค๋ฆฌํ˜๋Ÿผ

์ „์ฒด

8๊ฐœ โˆ™ (1์‹œ๊ฐ„ 48๋ถ„)

ํ•ด๋‹น ๊ฐ•์˜์—์„œ ์ œ๊ณต:

์ˆ˜์—…์ž๋ฃŒ
๊ฐ•์˜ ๊ฒŒ์‹œ์ผ: 
๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธ์ผ: 

์ˆ˜๊ฐ•ํ‰

์ „์ฒด

43๊ฐœ

4.6

43๊ฐœ์˜ ์ˆ˜๊ฐ•ํ‰

  • OHJUHYEON๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
    OHJUHYEON

    ์ˆ˜๊ฐ•ํ‰ 4

    โˆ™

    ํ‰๊ท  ํ‰์  5.0

    5

    100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

    ํ”„๋กœ๊ทธ๋ž˜๋ฐ์— ์ž…๋ฌธํ•˜๊ณ  ์ด์ œ ๋ง‰ ๋กœ์ปฌ์—์„œ ๊ฐœ๋ฐœํ•ด์„œ ํ”„๋กœ์ ํŠธ๋ฅผ ๊ฐ„๋‹จํ•˜๊ฒŒ ๋งŒ๋“ค ์ˆ˜ ์žˆ๊ฒŒ ๋˜์—ˆ๋Š”๋ฐ ์ด๋Ÿฐ ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ์…‹ํŒ…๊ณผ ๋ฐฐํฌ CI/CD์— ๋Œ€ํ•ด์„œ๋Š” ์ƒ์†Œํ•˜๊ธฐ๋„ ํ•˜๊ณ  ์ดํ•ด๊ฐ€ ์–ด๋ ค์›Œ ์ ‘ํ•˜๊ธฐ๊ฐ€ ๊นŒ๋‹ค๋กœ์› ์Šต๋‹ˆ๋‹ค. ํŠนํžˆ, ์„œ๋ฒ„์—์„œ ๋ฌด์—‡์„ ํ•œ๋‹ค๋Š” ๊ฒƒ์— ๋Œ€ํ•œ ์ดํ•ด๊ฐ€ ์–ด๋ ค์› ๋Š”๋ฐ ์„ค์น˜ํ•˜๋Š” ํŽ˜์ด์ง€ ์•ˆ๋‚ด๋ถ€ํ„ฐ ํ™˜๊ฒฝ ์…‹ํŒ…๊นŒ์ง€ ์„ค๋ช…ํ•ด ์ฃผ๊ณ  ์ „์ฒด์ ์ธ ์ƒ์„ฑ - ์…‹ํŒ… - ๊ฐ„๋‹จํ•œ ์˜ค๋ฅ˜ ํ•ด๊ฒฐ - ๋ฐฐํฌ๊นŒ์ง€ ๋‹ค๋ค„์ฃผ์–ด ํ•œ ์‹ธ์ดํด์„ ๋Œ๋ฆด ์ˆ˜ ์žˆ๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๋ฐฐ์šธ ๋•Œ ์ œ์ผ ์–ด๋ ค์šด ๊ฒŒ ๊ฒฝํ—˜ํ•ด ๋ณด์ง€ ๋ชปํ•œ ๊ฒƒ์„ ๊ทธ๋ ‡๊ตฌ๋‚˜ ํ•˜๊ณ  ์–ด์ฉ” ์ˆ˜ ์—†์ด ์ถ”์ƒ์ ์ธ ์ดํ•ด๋กœ ๋„˜์–ด๊ฐ€์•ผ ํ•˜๋Š” ๋ถ€๋ถ„์ธ๋ฐ ์ด๋ ‡๊ฒŒ ํ•œ ์‹ธ์ดํด์„ ๋Œ๋ฆฌ๊ณ  ๋‹ค์‹œ ๊ฐ•์˜ ์ž๋ฃŒ๋ฅผ ๋ณด๋‹ˆ ๊ฒฝํ—˜์„ ๊ธฐ๋ฐ˜์œผ๋กœ '์•„, ์•„๊นŒ ํ–ˆ๋˜ ๊ทธ๊ฑฐ!' ํ•˜๋ฉด์„œ ์–ป์–ด ๊ฐ€๋Š” ๊ฒŒ ๋” ๋งŽ์•„์ง€๋Š” ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ์…‹ํŒ…์—์„œ ๋ฐฐํฌ๊นŒ์ง€ ์‚ฌ์šฉ๋˜๋Š” ํ”„๋กœ์ ํŠธ(React..๋“ฑ)๋‚˜ ์ƒ์„ธ ์„ค๋ช…์„ ์–ป๊ธฐ ์œ„ํ•œ ๋ถ„๋“ค๋ณด๋‹ค๋Š” '๋„๋Œ€์ฒด ํ”„๋กœ์ ํŠธ๋ฅผ ์–ด๋–ป๊ฒŒ ๋งŒ๋“ค์–ด์„œ ์…‹ํŒ…ํ•˜๊ณ  ๋ฐฐํฌํ•˜๊ณ , ๊ทธ๊ฒƒ์„ ์ž๋™ํ™”ํ•˜์ง€?'์— ๋Œ€ํ•œ ๊ถ๊ธˆ์ฆ์„ ํ•ด๊ฒฐํ•˜์ง€ ๋ชป ํ•œ ๋ถ„๋“ค์ด ๋“ค์œผ๋ฉด ๋งค์šฐ ์ข‹์„ ๊ฒƒ ๊ฐ™์Šต๋‹ˆ๋‹ค. ์•„์ง ํ˜„์—…์—์„œ ์ผ์„ ํ•ด ๋ณธ ๊ฒฝํ—˜์ด ์—†์–ด์„œ ๊ฐ•์˜์—์„œ ์Šต๋“ํ•œ ์ง€์‹์„ ์–ผ๋งˆ๋‚˜ ํ™œ์šฉํ•  ์ˆ˜ ์žˆ์„์ง€๋Š” ๋ชจ๋ฅด๊ฒ ์ง€๋งŒ ๋‚˜์ค‘์— ํ”„๋กœ์ ํŠธ๋‚˜ ํ˜„์—…์—์„œ ์ผ์„ ํ•  ๋•Œ ๊ฐ•์˜๋ฅผ ํ†ตํ•ด ์–ป์€ ๊ฒฝํ—˜์„ ๋– ์˜ฌ๋ ค ํ•™์Šต์˜ ๊ธฐ๋ฐ˜์„ ๋งˆ๋ จํ•  ์ˆ˜ ์žˆ์„ ๊ฒƒ์ž„์„ ํ™•์‹ ํ•˜๋ฉฐ, ์ด ๊ฐ•์˜๊ฐ€ ์ €์™€ ๊ฐ™์€ ์ดˆ๋ณด์ž์—๊ฒŒ ๋งŽ์ด ์•Œ๋ ค์กŒ์œผ๋ฉด ์ข‹๊ฒ ๋„ค์š”! ์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

    • Kenu ํ—ˆ๊ด‘๋‚จ
      ์ง€์‹๊ณต์œ ์ž

      ์ˆ˜๊ฐ• ํ›„๊ธฐ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. ๋„์›€์ด ๋˜์–ด์„œ ์ €๋„ ๊ธฐ์ฉ๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ+๋ฐฐํฌ ํ™˜๊ฒฝ์„ ๊ตฌ์ถ•ํ•˜๋Š” ๊ฒƒ์€ ๊ธฐ๋ณธ์ž…๋‹ˆ๋‹ค. ์—ฌ๊ธฐ์— ์›ํ•˜๋Š” ์„œ๋น„์Šค๋ฅผ ๋งŒ๋“œ๋Š” ๊ฒƒ์€ ๋” ๋งŽ์€ ๋…ธ๋ ฅ์ด ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค. ์ข‹์€ ์„œ๋น„์Šค ๋งŒ๋“œ์‹œ๊ธธ ๋ฐ”๋ž๋‹ˆ๋‹ค. ์‘์›ํ•ฉ๋‹ˆ๋‹ค!

  • moonhyeok song๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
    moonhyeok song

    ์ˆ˜๊ฐ•ํ‰ 1

    โˆ™

    ํ‰๊ท  ํ‰์  5.0

    5

    75% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

    for ๊ฒฐ์ œ๊ณ ๋ฏผํ•˜๋Š” ์ˆ˜๊ฐ•์ƒ - ๋งค๋ฒˆ ๋กœ์ปฌ์—์„œ๋งŒ ๋™์ž‘ํ•ด๋ณด๊ณ  CI/CD๋ฅผ ๊ณ ๋ คํ•œ ์ดˆ๋ฐ˜ ๊ฐœ๋ฐœํ™˜๊ฒฝ ๊ตฌ์ถ•์€ ์•ˆํ•ด๋ดค๋Š”๋ฐ ๋ณธ ๊ฐ•์˜๋ฅผ ํ†ตํ•ด ๊ฐ„๋‹จํ•˜์ง€๋งŒ ์ „์ฒด ๊ณผ์ •์ด ์–ด๋–ค์‹์œผ๋กœ ์ง„ํ–‰๋˜์•ผ ํ•˜๋Š”์ง€ ์•Œ ์ˆ˜ ์žˆ์–ด์„œ ์ข‹์•˜์Šต๋‹ˆ๋‹ค. - ๊ทธ๋ ‡๋‹ค๋ณด๋‹ˆ ํ™˜๊ฒฝ ์„ค์ •์„ ์œ„ํ•ด ์ž‘์„ฑํ•œ ์ฝ”๋“œ๋‚˜ ์„ค์น˜ํ•œ ํŒจํ‚ค์ง€/ํ”„๋ ˆ์ž„์›Œํฌ ์„ค๋ช…์€ ์ƒ๋žต๋˜์—ˆ๋‹ค๋Š” ์ ์„ ์—ผ๋‘ํ•ด ๋‘์…”์•ผํ•  ๋“ฏ ์‹ถ์Šต๋‹ˆ๋‹ค. - ์•„๋งˆ ์›น ๊ฐœ๋ฐœ์ž์ฒด๋„ ์ฒ˜์Œ์ธ๋ฐ '์š”์ฆ˜ CI/CD๋Š” ํ•„์ˆ˜๋‹ˆ๊นŒ ๊ทธ๋ƒฅ ์ˆ˜๊ฐ•ํ•ด์•ผ๊ฒ ๋‹ค'๋ผ๋Š” ์ƒ๊ฐ์œผ๋กœ ๊ฐ•์˜๋ฅผ ๋“ค์œผ์‹  ์ดˆ๊ธ‰์ž๋ถ„๋“ค๋„ ๋งŽ์œผ์‹ค๊ฒ๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ์‹  ๋ถ„๋“ค์€ ๋ณธ ๊ฐ•์˜๋ฅผ ํ•™์Šตํ•˜์‹œ๊ณ  ํ›—๋‚  ์ง„ํ–‰ํ•˜์‹ค ํ”„๋กœ์ ํŠธ์— ๋งž๊ฒŒ CI/CD๋ฅผ ์ปค์Šคํ…€ํ•ด์•ผํ•  ๋•Œ๊ฐ€ ์˜ฌ๊ฑด๋ฐ ๊ทธ ๋•Œ ๋ณธ ๊ฐ•์˜์—์„œ ์ตํžŒ ๊ธฐ๋ณธ ๊ณจ๊ฒฉ์—์„œ ๊ฐ•์˜์— ์ฒจ๋ถ€๋œ ์ฝ”๋“œ๋“ค์˜ ์˜๋ฏธ๋ฅผ ์ฐธ๊ณ  + ์กฐ์‚ฌํ•˜์‹œ๋ฉด CI/CD๋ฅผ ์ œ๋Œ€๋กœ ์ดํ•ดํ•˜๊ฒŒ ๋˜์ง€์•Š์„๊นŒ ์‹ถ๋„ค์š”. ๊ฒฐ๋ก  - CI/CD ํฐ ํ‹€ ์žก๋Š” ๋ชฉ์ ์œผ๋กœ ๋“ค์œผ์‹ค ๊ฐœ๋ฐœ์ž๋ถ„๋“ค๊ป˜์„œ ์ถ”์ฒœ - ์‹ฌ๋„์žˆ๊ฒŒ ์ปค์Šคํ…€ํ•ด์•ผํ•  ๋•Œ๋Š” ๋ณธ ๊ฐ•์˜ ์ฝ”๋“œ๋ฅผ ๋ถ„์„ํ•ด๊ฐ€๋ฉด์„œ ํ•„์š”ํ•œ ๋ถ€๋ถ„์„ ์ถ”๊ฐ€ ํ•™์Šตํ•œ๋‹ค๋ฉด ์‹ค๋ ฅ์ฆ์ง„์— ๋„์›€์ด ๋งŽ์ด ๋  ๊ฒƒ์œผ๋กœ ๊ธฐ๋Œ€ - ์ข‹์€ ๊ฐ•์˜๋ฅผ ์—ด์–ด์ฃผ์…”์„œ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค!

    • Kenu ํ—ˆ๊ด‘๋‚จ
      ์ง€์‹๊ณต์œ ์ž

      ์ˆ˜๊ฐ•ํ‰ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. ๋ง์”€ํ•˜์‹  ๊ฒƒ์ฒ˜๋Ÿผ ๋” ์ข‹์€ ๊ธฐ๋Šฅ๋“ค๋„ ๋งŽ์ด ์žˆ์œผ๋‹ˆ ์ž˜ ์ด์šฉํ•˜์‹œ๊ธธ ๋ฐ”๋ž๋‹ˆ๋‹ค. ํ–‰๋ณตํ•œ ํ”„๋กœ๊ทธ๋ž˜๋จธ ๋˜์„ธ์š”.

  • ํ”„๋กœ๊ทธ๋ž˜๋จธ๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
    ํ”„๋กœ๊ทธ๋ž˜๋จธ

    ์ˆ˜๊ฐ•ํ‰ 3

    โˆ™

    ํ‰๊ท  ํ‰์  5.0

    5

    100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

    ๋ฐฐํฌ ๊ด€๋ จํ•ด์„œ ํฉ์–ด์ง„ ๊ฐœ๋…๋“ค์„ ํ•œ ๋ฒˆ์— ๋ชจ์•„๋ณผ ์ˆ˜ ์žˆ์–ด์„œ ์œ ์ตํ•œ ๊ฐ•์˜์˜€์Šต๋‹ˆ๋‹ค. ์™„๊ฐ•ํ•˜๊ณ  ๋‚˜๋‹ˆ ๋ฌด์—‡์„ ์ข€ ๋” ์ง‘์ค‘์ ์œผ๋กœ ๊ณต๋ถ€ํ•ด์•ผํ•˜๋Š”์ง€ ๊ฐ์ด ์™”์Šต๋‹ˆ๋‹ค.

    • ํ…Œ๋ผ๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
      ํ…Œ๋ผ

      ์ˆ˜๊ฐ•ํ‰ 4

      โˆ™

      ํ‰๊ท  ํ‰์  4.5

      5

      100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

      ์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค! ๋ฐฐํฌ ์ž๋™ํ™”์— ๋Œ€ํ•œ ๋‚ด์šฉ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ๊ธฐ์ดˆ์ ์ธ ํˆด ์‚ฌ์šฉ๋ฐฉ๋ฒ•๊นŒ์ง€ ์ƒ์„ธํ•˜๊ฒŒ ์•Œ ์ˆ˜ ์žˆ์–ด์„œ ๋งŽ์€ ๋„์›€์ด ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๊ณ„์† PHP๋งŒ ํ•ด์™€์„œ ํ”„๋ก ํŠธ ๋ฐฑ ๋ถ„๋ฆฌ๋ฅผ ์ œ๋Œ€๋กœ ๋ชปํ•ด๋ดค๋Š”๋ฐ ์ข‹์€ ๊ฐ•์˜๋ฅผ ๋ณด๋ฉฐ ์ฒ˜์Œ์œผ๋กœ ๋ถ„๋ฆฌํ•ด๋ณด๊ณ  ์ง์ ‘ ๋ฐฐํฌ๊นŒ์ง€ ํ•ด๋ดค์Šต๋‹ˆ๋‹ค. ๋”๋ถˆ์–ด github ์‚ฌ์šฉ๊นŒ์ง€ ๋ฐฐ์šธ ์ˆ˜ ์žˆ๋Š” ๊ธฐํšŒ๊ฐ€ ์žˆ์–ด์„œ ๋งŽ์€ ๋„์›€์ด ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

      • Kenu ํ—ˆ๊ด‘๋‚จ
        ์ง€์‹๊ณต์œ ์ž

        ์ข‹์€ ๋ฆฌ๋ทฐ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. SPA๋Š” ๋‹ค๋ฃฐ ๊ฒŒ ํ”„๋ก ํŠธ์—”๋“œ๊ฐ€ ํ•˜๋‚˜ ๋” ์žˆ์–ด์„œ ๊ทธ ๋ถ€๋ถ„์— ์ง‘์ค‘ํ–ˆ์Šต๋‹ˆ๋‹ค. ํ–‰๋ณตํ•œ ํ”„๋กœ๊ทธ๋ž˜๋จธ ๋˜์„ธ์š”.

    • Mx๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
      Mx

      ์ˆ˜๊ฐ•ํ‰ 9

      โˆ™

      ํ‰๊ท  ํ‰์  4.4

      5

      100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

      ๊ฐ•์˜์—์„œ๋„ ์–ธ๊ธ‰์„ ํ•˜์ง€๋งŒ React๋‚˜ Node.js์— ๋Œ€ํ•ด์„œ ๋‹ค๋ฃจ๋Š” ๊ฐ•์˜๋Š” ์•„๋‹™๋‹ˆ๋‹ค. ๋ฐฐํฌ์™€ ๋„๋ฉ”์ธ ๋“ฑ๋ก, CI/CD ์„ค์ • ๋“ฑ์˜ ๊ณผ์ •์— ์ดˆ์ ์ด ๋งž์ถฐ์ง„ ๊ฐ•์˜์ž…๋‹ˆ๋‹ค. ์ฃผ๋‹ˆ์–ด ๊ฐœ๋ฐœ์ž์˜ ๊ฒฝ์šฐ ๊ฐœ๋ฐœ์— ๋น„ํ•ด CI/CD ๊ฐ™์€ ์š”์†Œ์— ์†Œํ™€ํ•˜๊ธฐ ์‰ฌ์šด๋ฐ CI/CD๋Š” ํ”„๋กœ๊ทธ๋žจ์˜ ์ง€์†์ ์ธ ๋ฐœ์ „์„ ์œ„ํ•ด์„œ๋Š” ๊ผญ ํ•„์š”ํ•œ ๊ณผ์ •์ด์ฃ . ์ด ๊ฐ•์˜๋ฅผ ํ†ตํ•˜์—ฌ CI/CD๊ฐ€ ์‹ค์ œ๋กœ ์–ด๋–ป๊ฒŒ ์ด๋ฃจ์–ด์ง€๋Š”์ง€ ์‰ฝ๊ฒŒ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค. ์ข‹์€ ๊ฐ•์˜ ์ž˜ ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค :)

      • Kenu ํ—ˆ๊ด‘๋‚จ
        ์ง€์‹๊ณต์œ ์ž

        ์ข‹์€ ์ˆ˜๊ฐ•ํ‰ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. ํ–‰๋ณตํ•˜์„ธ์š”. ๐Ÿ˜Š

    ๋น„์Šทํ•œ ๊ฐ•์˜

    ๊ฐ™์€ ๋ถ„์•ผ์˜ ๋‹ค๋ฅธ ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”!

    ์›” โ‚ฉ15,400

    5๊ฐœ์›” ํ• ๋ถ€ ์‹œ

    โ‚ฉ77,000