Inflearn brand logo image
Inflearn brand logo image
์ฑ„๋„ํ†ก ์•„์ด์ฝ˜
BEST

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์˜ ๋ชจ๋“  ๊ฒƒ

Node.js ์ง„์˜์˜ ํ‘œ์ค€, TypeScript ์–ด๋–ป๊ฒŒ ์“ฐ๊ณ  ๊ณ„์‹ ๊ฐ€์š”? ํƒ€์ž… ์ฃผ์„๋งŒ ๋‹ฌ๊ณ  ๊ณ„์‹ ๋‹ค๋ฉด ์ง„์งœ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๊ฐ€ ์•„๋‹™๋‹ˆ๋‹ค. ๋ฌด์—‡์„ ์ข‹์•„ํ• ์ง€ ๋ชฐ๋ผ์„œ ๋‹ค ์ค€๋น„ํ–ˆ์Šต๋‹ˆ๋‹ค. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ A to Z๋ฅผ ์•Œ์•„๋ด…์‹œ๋‹ค :)

Thumbnail

์ดˆ๊ธ‰์ž๋ฅผ ์œ„ํ•ด ์ค€๋น„ํ•œ
[ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด, ์›น ๊ฐœ๋ฐœ] ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.

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

  • ES6+

  • Typescript

  • Deno

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๊ฐœ๋ฐœ์ž๋ผ๋ฉด ๋ ˆ๋ฒจ ์—…! 
์ฒ˜์Œ ์‹œ์ž‘ํ•˜๋Š” ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ A to Z. 

TypeScript, ์™œ ์จ์•ผ ํ• ๊นŒ์š”?

โ€œTypeScript๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด JavaScript๋กœ ๋” ํฌ๊ณ  ๊ฐ•๋ ฅํ•œ ์‹œ์Šคํ…œ์„ ๊ตฌ์ถ•ํ•  ์ˆ˜ ์žˆ๋‹ค.โ€
โ€• Ryan Dahl (Node.js ์ฐฝ์‹œ์ž)

ํฌ๊ณ  ๊ฐ•๋ ฅํ•œ ์‹œ์Šคํ…œ์ด๋ž€ ์–ด๋–ค ๊ฒƒ์„ ์˜๋ฏธํ• ๊นŒ์š”? ์ €๋Š” โ€œํฌ๊ณ โ€ = โ€œํŒŒ์ผ์ด ๋งŽ์€ ๊ฐ์ฒด์ง€ํ–ฅ ํ”„๋กœ๊ทธ๋ž˜๋ฐโ€ = โ€œ๊ฐ•๋ ฅํ•œโ€ = โ€œ๋Ÿฐํƒ€์ž„/์ปดํŒŒ์ผ ๋‹จ๊ณ„์—์„œ ์—๋Ÿฌ๊ฐ€ ์—†๋Š”โ€ ์ด๋ผ๋Š” ๋œป์œผ๋กœ ์ƒ๊ฐ์ด ๋ฉ๋‹ˆ๋‹ค.

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ํ•™์Šต์„ ๊ณ ๋ฏผํ•˜๋Š” ๊ฐœ๋ฐœ์ž๋ผ๋ฉด, ๊ฐ•์˜๋ฅผ ๋“ค์œผ๋ฉฐ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๊ฐ€ ์–ด๋–ป๊ฒŒ ํฌ๊ณ  ๊ฐ•๋ ฅํ•ด์งˆ ์ˆ˜ ์žˆ๋Š”์ง€ ์•Œ์•„๊ฐ€๋ด…์‹œ๋‹ค :)


์ง€๊ธˆ TypeScript ๊ฐœ๋ฐœ์ž๋กœ 
์—…๊ทธ๋ ˆ์ด๋“œํ•ด์•ผ ํ•  ์ด์œ !

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

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” ์„ ํƒ์ด ์•„๋‹ˆ๋ผ ํ•„์ˆ˜์ž…๋‹ˆ๋‹ค.

๋งˆ์ดํฌ๋กœ์†Œํ”„ํŠธ์—์„œ ๋งŒ๋“  ์–ธ์–ด, ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” ๊ตฌ๊ธ€์ด ๊ณต์‹์ ์œผ๋กœ ์‚ฌ์šฉํ•œ ์ด๋ž˜ ๋ฏธ์นœ๋“ฏํ•œ ์ƒ์Šน์„ธ๋ฅผ ๋ณด์ด๋ฉฐ ์–ด๋Š๋ง ์ƒ์œ„๊ถŒ ์–ธ์–ด์— ์œ„์น˜ํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

์—ฌ๋Ÿฌ๋ถ„์ด React, Vue, NestJS ๊ฐœ๋ฐœ์ž๋ผ๋ฉด ๋”์šฑ์ด ๊ฐœ๋ฐœ์ž ์ฑ„์šฉ ๊ณต๊ณ ์—์„œ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ๊ฒฝํ—˜์ž๋ฅผ ์ฐพ๋Š” ๊ธ€์ด ๋งŽ์Œ์„ ์•Œ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์Šคํƒ€ํŠธ์—…์— ์ทจ์งํ•˜๋“ , ๋Œ€๊ธฐ์—…์— ์ทจ์ง์„ ํ•˜๋“  ์ง€๊ธˆ ์‹œ์ ์—์„œ Node.js ์ง„์˜์˜ ๊ฐœ๋ฐœ์ž๋ผ๋ฉด ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋Š” ํ•„์ˆ˜์ž…๋‹ˆ๋‹ค.

๊ฐœ๋ฐœ ๋” ์ž˜ํ•˜๊ณ  ์‹ถ์€ JavaScript ๊ฐœ๋ฐœ์ž๋ผ๋ฉด, TypeScript ํ•™์Šต์„ ๋†“์น˜์ง€ ๋งˆ์„ธ์š”! 

๐Ÿ’ก Node.js ๋Ÿฐํƒ€์ž„์—์„œ ๊ฐœ๋ฐœ์„ ํ•˜์‹œ๋Š” ๋ถ„

๐Ÿ’ก TypeScript๋ฅผ ์ž˜ ์จ๋ณด๊ณ  ์‹ถ์€ ๊ฐœ๋ฐœ์ž

๐Ÿ’ก Deno๋ฅผ ๊ฒฝํ—˜ํ•ด๋ณด๊ณ  ์‹ถ์€ ๊ฐœ๋ฐœ์ž


์ด ๊ฐ•์˜์—์„œ๋Š” 
์ด๋Ÿฐ ๋‚ด์šฉ์„ ๋ฐฐ์›Œ์š” ๐Ÿƒ

1. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์—์„œ ์ž์ฃผ ์“ฐ์ด๋Š” ES6+ ๋ฌธ๋ฒ•

ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์—๋„ ์ž์ฃผ ์“ฐ์ด๋Š” ES6+ ๋ฌธ๋ฒ•์„ ๊ฐ„๋‹จํžˆ ์งš๊ณ  ๋„˜์–ด๊ฐ‘๋‹ˆ๋‹ค! (ํ•„์ˆ˜ ๊ณผ์ •์ด ์•„๋‹™๋‹ˆ๋‹ค. ์ด๋ฏธ ES6์— ๋Œ€ํ•ด ์ž˜ ์•„์‹ ๋‹ค๋ฉด ๊ฑด๋„ˆ๋›ฐ์…”๋„ ๋ฉ๋‹ˆ๋‹ค.)

2. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ๊ธฐ์ดˆ

์ฒ˜์Œ ๋ฐฐ์šฐ์‹œ๋Š” ๋ถ„๋“ค๋„ ๋”ฐ๋ผ์˜ค๊ธฐ ์‰ฝ๋„๋ก ๊ธฐ์ดˆ์ ์ธ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ๋ฌธ๋ฒ•์„ ์ตํž™๋‹ˆ๋‹ค. (ํ•„์ˆ˜ ๊ณผ์ •์ด ์•„๋‹™๋‹ˆ๋‹ค. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์จ๋ณด์…จ๋‹ค๋ฉด ๊ฑด๋„ˆ๋›ฐ์…”๋„ ๋ฉ๋‹ˆ๋‹ค!)

3. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์ค‘๊ธ‰

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์— ๋Œ€ํ•œ ์ดํ•ด๋„๊ฐ€ ์žˆ๋Š” ๋ถ„๋“ค์ด ๋”ฐ๋ผ์˜ฌ ์ˆ˜ ์žˆ๋Š” ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์ค‘๊ธ‰ ๋ฌธ๋ฒ•์„ ๋ฐฐ์›๋‹ˆ๋‹ค! (ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์˜ˆ์ œ์˜ ๊ทผ๊ฐ„์ด ๋˜๋Š” ์„น์…˜์ด๋ฏ€๋กœ ๋“ฃ๊ธฐ๋ฅผ ๊ฐ•๋ ฅํžˆ ๊ถŒํ•ฉ๋‹ˆ๋‹ค.)

4. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์˜ ์œ ์šฉํ•œ ์žก๊ธฐ์ˆ 

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

5. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ์˜ˆ์ œ

์ง€๋ฃจํ•œ ์ด๋ก  ์ˆ˜์—…์ด ๋๋‚ฌ๋‹ค๋ฉด, ์ด์ œ ๋ฐฐ์šด ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋กœ ์žฌ๋ฏธ์žˆ๊ฒŒ ํ™œ์šฉํ•ด๋ด…์‹œ๋‹ค! (๋ฐ˜๋“œ์‹œ ๋“ค์œผ์‹œ๋Š” ๊ฒƒ์„ ์ถ”์ฒœ๋“œ๋ฆฝ๋‹ˆ๋‹ค. ์ด ๊ฐ•์˜์—์„œ ์ œ์ผ ํ•ต์‹ฌ์ ์ธ ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค.)

6. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ์™€ ๋ฐฑ์—”๋“œ with NestJS

NestJS์—์„œ ์ตœ๋Œ€ํ•œ ํšจ์œจ์ ์œผ๋กœ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•ด๋ด…์‹œ๋‹ค. (NestJS๋Š” ๋ฐฑ์—”๋“œ ํ”„๋ ˆ์ž„์›Œํฌ์ง€๋งŒ, ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž ๋ถ„๋“ค์—๊ฒŒ๋„ ๋ฐ˜๋“œ์‹œ ๋„์›€์ด ๋  ๊ฒƒ์ž…๋‹ˆ๋‹ค.)

7. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ๋Ÿฐํƒ€์ž„, Deno

์ƒˆ๋กœ์šด ๋Ÿฐํƒ€์ž„ Deno! ๋‹ฌ๋ผ์ง„ ์ ์„ ์•Œ์•„๋ด…์‹œ๋‹ค.
(Deno๋ฅผ ์™„๋ฒฝํžˆ ๋ฐฐ์šฐ๊ธฐ๋ณด๋‹ค๋Š” ๋ฏธ๋ฆฌ ๊ฒฝํ—˜ํ•ด๋ณธ๋‹ค๋Š” ๋Š๋‚Œ์œผ๋กœ ๊ฐ€๋ณ๊ฒŒ ๋“ฃ๋Š” ๊ฑธ ์ถ”์ฒœ๋“œ๋ฆฝ๋‹ˆ๋‹ค. Deno๋Š” ์ƒ์šฉํ™”๊ฐ€ ๋˜๋ ค๋ฉด ์กฐ๊ธˆ ๋” ์ต์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.)


Q&A ๐Ÿ’ฌ

Q. ๊ฐ•์˜๊ฐ€ ๊ณ„์† ์—…๋ฐ์ดํŠธ๋˜๋‚˜์š”?

ํ˜„์žฌ TypeScript4์„ ๊ธฐ์ค€์œผ๋กœ ์ดฌ์˜ ์ค‘์ด๋ฉฐ, TypeScript5 ๋ฌธ๋ฒ•๋„ ์ถ”๊ฐ€๋กœ ์ดฌ์˜ํ•  ์˜ˆ์ •์ž…๋‹ˆ๋‹ค. ์ดํ›„ ์ถ”๊ฐ€์ ์ธ ๋ณ€๋™์‚ฌํ•ญ์ด๋‚˜ ์ค‘์š”ํ•œ ์—…๋ฐ์ดํŠธ๊ฐ€ ์ƒ๊ธฐ๋ฉด ๊ฐ•์˜๋ฅผ ์—…๋ฐ์ดํŠธํ•  ์˜ˆ์ •์ž…๋‹ˆ๋‹ค. (23๋…„ ํ•˜๋ฐ˜๊ธฐ๊นŒ์ง€)

Q. ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ๋ฌธ๋ฒ•์„ ์•„์˜ˆ ๋ชฐ๋ผ๋„ ๋˜๋‚˜์š”?

๋„ค! ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ๋ฌธ๋ฒ•์„ 1๋ถ€ํ„ฐ 10๊นŒ์ง€ ๋ชจ๋‘ ๋‹ค๋ฃจ๊ธฐ ๋•Œ๋ฌธ์— 1๋„ ๋ชจ๋ฅด์…”๋„ ๋ฉ๋‹ˆ๋‹ค. ๋‹ค๋งŒ ๊ธฐ์ดˆ์ ์ธ ๋ฐ”๋‹๋ผ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋ฌธ๋ฒ•์€ ๊ผญ ์•Œ๊ณ  ๊ณ„์…”์•ผ ํ•ฉ๋‹ˆ๋‹ค. ES6+ ๋ฌธ๋ฒ•์„ ์ค‘์š”ํ•œ ๋ถ€๋ถ„์„ ์งš๊ณ  ๋„˜์–ด๊ฐ€์ง€๋งŒ ๋ฏธ๋ฆฌ ์•Œ๊ณ  ๊ณ„์‹ ๋‹ค๋ฉด ๋”์šฑ ์ข‹์Šต๋‹ˆ๋‹ค.

Q. NestJS์— ๋Œ€ํ•ด ๊นŠ์ด ๋‹ค๋ฃจ๋‚˜์š”?

์ด ๊ฐ•์˜๋Š” ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ๊ฐ•์˜๊ธฐ ๋•Œ๋ฌธ์— NestJS ์„น์…˜์—์„œ ๋ฐฑ์—”๋“œ์˜ ์„ค๋ช…๊ณผ ์ฝ”๋“œ ํ’ˆ์งˆ์„ ๊ณ ๋ คํ•œ ์ฝ”๋”ฉ์€ ๋”ฐ๋กœ ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์˜ค๋กœ์ง€ NestJS์—์„œ ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ๋ฅผ ์–ด๋–ป๊ฒŒ ํšจ์œจ์ ์œผ๋กœ ์“ธ ์ˆ˜ ์žˆ์„์ง€๋งŒ์„ ๊ณ ๋ คํ•œ ์„น์…˜์ž…๋‹ˆ๋‹ค.

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

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

  • Node.js ๋Ÿฐํƒ€์ž„์—์„œ ๊ฐœ๋ฐœ์„ ํ•˜์‹œ๋Š” ๋ถ„

  • Deno๋ฅผ ๊ฒฝํ—˜ํ•ด๋ณด๊ณ  ์‹ถ์€ ๋ถ„

  • TypeScript๋ฅผ ์ž˜ ์จ๋ณด๊ณ  ์‹ถ์€ ๋ถ„

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

  • ๊ธฐ์ดˆ์ ์ธ JavaScript ๋ฌธ๋ฒ•

์•ˆ๋…•ํ•˜์„ธ์š”
yongsoocho์ž…๋‹ˆ๋‹ค.

347

๋ช…

์ˆ˜๊ฐ•์ƒ

13

๊ฐœ

์ˆ˜๊ฐ•ํ‰

33

๊ฐœ

๋‹ต๋ณ€

5.0

์ 

๊ฐ•์˜ ํ‰์ 

2

๊ฐœ

๊ฐ•์˜

์•ˆ๋…•ํ•˜์„ธ์š”! ์ œ ๊ฒฝํ—˜์„ ์ž์œ ๋กญ๊ฒŒ ๊ณต์œ ํ•˜๊ณ  ์‹ถ์Šต๋‹ˆ๋‹ค.
yongsoocho578@gmail.com ์œผ๋กœ ํ”ผ๋“œ๋ฐฑ๊ณผ ์˜๊ฒฌ์€ ํ™˜์˜์ž…๋‹ˆ๋‹ค.

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

์ „์ฒด

65๊ฐœ โˆ™ (7์‹œ๊ฐ„ 15๋ถ„)

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

์ˆ˜๊ฐ•ํ‰

์•„์ง ์ถฉ๋ถ„ํ•œ ํ‰๊ฐ€๋ฅผ ๋ฐ›์ง€ ๋ชปํ•œ ๊ฐ•์˜์ž…๋‹ˆ๋‹ค.
๋ชจ๋‘์—๊ฒŒ ๋„์›€์ด ๋˜๋Š” ์ˆ˜๊ฐ•ํ‰์˜ ์ฃผ์ธ๊ณต์ด ๋˜์–ด์ฃผ์„ธ์š”!

โ‚ฉ22,000