Express

hyena_leeยท2023๋…„ 2์›” 7์ผ
0

Node.js

๋ชฉ๋ก ๋ณด๊ธฐ
2/3
post-thumbnail

###๐ŸŒ– Node.js Event Emitter
๋ธŒ๋ผ์šฐ์ €์—์„œ JavaScript๋กœ ์ž‘์—…ํ•œ ๊ฒฝ์šฐ ๋งˆ์šฐ์Šค ํด๋ฆญ, ํ‚ค๋ณด๋“œ ๋ฒ„ํŠผ ๋ˆ„๋ฅด๊ธฐ, ๋งˆ์šฐ์Šค ์›€์ง์ž„์— ๋Œ€ํ•œ ๋ฐ˜์‘ ๋“ฑ๊ณผ ๊ฐ™์€ ์ด๋ฒคํŠธ๋ฅผ ํ†ตํ•ด ์‚ฌ์šฉ์ž ์ƒํ˜ธ ์ž‘์šฉ์ด ์–ผ๋งˆ๋‚˜ ์ฒ˜๋ฆฌ๋˜๋Š”์ง€ ์•Œ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
์ด๋Ÿฌํ•œ ๊ฒƒ ์ฒ˜๋Ÿผ ๋ฐฑ์—”๋“œ ์ธก์—์„œ Node.js๋„ event-driven ์‹œ์Šคํ…œ์„ ์ด์šฉํ•ด์„œ ์ž‘๋™ ๋ฉ๋‹ˆ๋‹ค.

์ด ํŒจํ„ด์—๋Š” ํŠน์ • Subject๋ฅผ ๊ด€์ฐฐํ•˜๋Š” ๋งŽ์€ Observer๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค.
๊ด€์ฐฐ์ž๋Š” ๊ธฐ๋ณธ์ ์œผ๋กœ ๊ด€์‹ฌ์ด ์žˆ๊ณ  ํ•ด๋‹น ์ฃผ์ œ ๋‚ด๋ถ€์— ๋ณ€๊ฒฝ ์‚ฌํ•ญ์ด ์žˆ์„ ๋•Œ ์•Œ๋ฆผ์„ ๋ฐ›๊ธฐ๋ฅผ ์›ํ•ฉ๋‹ˆ๋‹ค.
๊ทธ๋ž˜์„œ ๊ทธ๋“ค์€ ๊ทธ ์ฃผ์ œ์— ์Šค์Šค๋กœ๋ฅผ ๋“ฑ๋ก(Register)ํ•ฉ๋‹ˆ๋‹ค.
์ฃผ์ œ์— ๋Œ€ํ•œ ๊ด€์‹ฌ์„ ์žƒ์œผ๋ฉด ๋‹จ์ˆœํžˆ ํ•ด๋‹น ์ฃผ์ œ์—์„œ ๋“ฑ๋ก์„ ์ทจ์†Œํ•ฉ๋‹ˆ๋‹ค. ๋•Œ๋•Œ๋กœ ์ด ๋ชจ๋ธ์€ ๊ฒŒ์‹œ์ž-๊ตฌ๋…์ž(Publisher-Subscriber) ๋ชจ๋ธ์ด๋ผ๊ณ ๋„ ํ•ฉ๋‹ˆ๋‹ค.

๐ŸŒŽ Express js

Express๋Š” ์›น ๋ฐ ๋ชจ๋ฐ”์ผ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ๊ตฌ์ถ•์„ ์œ„ํ•œ ๊ด‘๋ฒ”์œ„ํ•œ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•˜๋Š” ๋…ธ๋“œ js ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ํ”„๋ ˆ์ž„์›Œํฌ์ž…๋‹ˆ๋‹ค. ๋‹จ์ผ ํŽ˜์ด์ง€, ๋‹ค์ค‘ ํŽ˜์ด์ง€ ๋ฐ ํ•˜์ด๋ธŒ๋ฆฌ๋“œ ์›น ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๋นŒ๋“œํ•˜๋Š” ๋ฐ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค.
์„œ๋ฒ„์™€ ๊ฒฝ๋กœ๋ฅผ ๊ด€๋ฆฌํ•˜๋Š” ๋ฐ ๋„์›€์ด ๋˜๋Š” Node js ์ƒ๋‹จ์— ๊ตฌ์ถ•๋œ ๋ ˆ์ด์–ด์ž…๋‹ˆ๋‹ค.
=> Node.js์˜ API๋ฅผ ๋‹จ์ˆœํ™”ํ•˜๊ณ  ์œ ์šฉํ•œ ๊ธฐ๋Šฅ๋“ค์€ ๋” ์ถ”๊ฐ€ ์‹œ์ผœ Node.js๋ฅผ ๋” ํŽธ๋ฆฌํ•˜๊ณ  ์œ ์šฉํ•˜๊ฒŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด์ฃผ๋Š” ํ”„๋ ˆ์ž„์›Œํฌ

๐Ÿ‘‰Express js ๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ์ด์œ 

  • Node.js์˜ API๋ฅผ ์‰ฝ๊ฒŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด ์ค๋‹ˆ๋‹ค. (Expressjs๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๋ฒ•์„ ์‰ฝ๊ฒŒ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.)
  • ๊ต‰์žฅํžˆ ๋งŽ์€ ์‚ฌ๋žŒ๋“ค์ด ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.
  • ExpressJS๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ํ•˜๋Š” ๋‹ค๋ฅธ ํ”„๋ ˆ์ž„์›Œํฌ๋“ค๋„ ๋งŒ๋“ค์–ด์ง€๊ณ  ์žˆ๊ธฐ ๋•Œ๋ฌธ์—, ์ด ํ”„๋ ˆ์ž„์›Œํฌ ํ•˜๋‚˜๋งŒ ๋ฐฐ์šฐ๋ฉด ๋‹ค๋ฅธ ๋…ธ๋“œ js ํ”„๋ ˆ์ž„ ์›Œํฌ๋„ ๋น ๋ฅด๊ฒŒ ๋ฐฐ์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๐ŸŒž Express js ๊ธฐ๋ณธ ๊ตฌ์กฐ ์ฝ”๋“œ

  • npm init
  • npm install express

โœ๏ธ๋ผ์šฐํŠธ ํ•ธ๋“ค๋Ÿฌ ์ƒ์„ฑ

Request object

'HTTP request'๋กœ์จ 'req'๋กœ ํ‘œํ˜„๋˜๋Š” ๊ฐ์ฒด์ด๋‹ค. request 'query string', 'parameters, 'body', 'HTTP header' ๋“ฑ์˜ ํ”„๋กœํผํ‹ฐ๋ฅผ ๊ฐ–๋Š”๋‹ค. 'req'๊ฐ์ฒด๋Š” 'Node'์˜ request ๊ฐ์ฒด๋ณด๋‹ค ํ–ฅ์ƒ๋œ ๋ฒ„์ „์ด๋‹ค.

req.params

๊ฒฝ๋กœ ๋งค๊ฐœ๋ณ€์ˆ˜๋Š” URL์˜ ํ•ด๋‹น ์œ„์น˜์— ์ง€์ •๋œ ๊ฐ’์„ ์บก์ฒ˜ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉ๋˜๋Š” ๋ช…๋ช…๋œ URL ์„ธ๊ทธ๋จผํŠธ์ž…๋‹ˆ๋‹ค. ์บก์ฒ˜๋œ ๊ฐ’์€ ๊ฒฝ๋กœ์— ์ง€์ •๋œ ๊ฒฝ๋กœ ๋งค๊ฐœ๋ณ€์ˆ˜์˜ ์ด๋ฆ„์„ ํ•ด๋‹น ํ‚ค๋กœ ์‚ฌ์šฉํ•˜์—ฌ req.params ๊ฐ์ฒด์— ์ฑ„์›Œ์ง‘๋‹ˆ๋‹ค.

res.json() vs res.send()

res.send์™€ res.json๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์€ ๊ธฐ๋Šฅ์ƒ์œผ๋กœ ๊ฑฐ์˜ ๋™์ผํ•ฉ๋‹ˆ๋‹ค.
๊ทธ๋Ÿฌ๋ฉด res.send()๋ฅผ ์ด์šฉํ•ด์„œ object๋ฅผ ๋ณด๋‚ด๋„ ๋˜๋Š” ๊ฑด์ง€ ์•„๋ž˜์—์„œ ๋ด๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค.

res.json ์†Œ์Šค ์ฝ”๋“œ

res.send ์†Œ์Šค ์ฝ”๋“œ

res.json() vs res.send() ๊ฒฐ๋ก 

res.send์™€ res.json ์‚ฌ์ด์—๋Š” ์‹ค์ œ ์ฐจ์ด ์™ธ๋ถ€์—์„œ ๋ณด๊ธฐ์—๋Š” ์ฐจ์ด๊ฐ€ ์—†์ง€๋งŒ ๋‚ด๋ถ€์—์„œ ํ˜ธ์ถœ ํ•œ ๋ฒˆ์ด ๋” ์ผ์–ด๋‚˜๋Š” ๊ฒƒ์„ ๋ณผ ์ˆ˜ ์žˆ๋‹ค. ๋˜ํ•œ object๋ฅผ ๋ณด๋‚ผ ๋• res.json()์„ ์ด์šฉํ•˜๋Š” ๊ฒŒ ๋” ์ง๊ด€์ ์ด๊ธฐ๋„ ํ•˜๊ธฐ ๋•Œ๋ฌธ์— res.json()์„ ์ด์šฉํ•˜๋Š” ๊ฒƒ์„ ์ถ”์ฒœํ•ฉ๋‹ˆ๋‹ค.

res.end()

reponse ๊ฐ€ ์žˆ๊ณ  ์ผ๋‹จ ๋ฐ์ดํ„ฐ๋ฅผ ์ˆ˜์ง‘ํ•˜๊ฑฐ๋‚˜ ํ˜ธ์ถœ์ž์—๊ฒŒ ์ œ๊ณตํ•˜๊ณ  ์‹ถ์€ ๋‹ค๋ฅธ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜๋ฉด ๋งˆ์ง€๋ง‰ ๋‹จ๊ณ„๋กœ ์„ธ์…˜์„ ์ข…๋ฃŒํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ์ด๋Š” res.end()๋ฅผ ํ˜ธ์ถœํ•˜์—ฌ ์ˆ˜ํ–‰ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

req.query

  • req.query๋Š” ํ•ด๋‹น ๋ผ์šฐํŠธ ๊ฒฝ๋กœ์—์„œ ๊ฐ๊ฐ์˜ 'query string'์„ ํŒŒ๋ผ๋ฏธํ„ฐ๋กœ ๊ฐ–๋Š” ๊ฐ์ฒด ํ”„๋กœํผํ‹ฐ์ด๋‹ค. ๋งŒ์•ฝ 'query parser'๊ฐ€ ๊ฐ’์ด ์—†์œผ๋ฉด ๋นˆ ๊ฐ์ฒด๊ฐ€ ๋‚˜์˜ฌ ๊ฒƒ์ด๊ณ , ๊ทธ๋ ‡์ง€ ์•Š์œผ๋ฉด ํ•ด๋‹น์— ๋งž๋Š” 'query parser'๊ฐ€ ๋‚˜์˜ฌ ๊ฒƒ.
  • req.query์˜ ํ˜•ํƒœ๋Š” ์‚ฌ์šฉ์ž์˜ ์ž„์˜์— ๋”ฐ๋ผ ๊ฒฐ์ •๋˜๋ฏ€๋กœ ๊ทธ ํ•ด๋‹น ๊ฐ์ฒด์˜ ํ”„๋กœํผํ‹ฐ์™€ ๊ฐ’์„ ์‹ ๋ขฐํ•˜๊ธฐ ์ „์— ํƒ€๋‹นํ•œ ๊ฒƒ์ธ์ง€ ์ž…์ฆ๋˜์–ด์•ผ ํ•œ๋‹ค. ์˜ˆ๋ฅผ ๋“ค์–ด 'req.query.foo.toString()'์€ ์—ฌ๋Ÿฌ ์ด์œ ์—์„œ ์ž…์ฆ์ด ์‹คํŒจ๋  ์ˆ˜ ์žˆ๋‹ค. 'foo'๊ฐ€ ์—†์„ ์ˆ˜๋„ ์žˆ๊ณ  string์ด ์•„๋‹ ์ˆ˜๋„ ์žˆ์œผ๋ฉฐ, toString'์€ function์ด ์•„๋‹Œ string์ผ ์ˆ˜ ์žˆ๋Š” ๊ฒƒ์ด๋‹ค.

req.body

'request body'์— 'key-value'์˜ ๋ฐ์ดํ„ฐ๊ฐ€ ๋‹ด๊ธด ๊ฐ์ฒด ํ”„๋กœํผํ‹ฐ์ด๋‹ค. JSON ๊ฐ์ฒด์— ์ ‘๊ทผ ๊ฐ€๋Šฅํ•˜๋‹ค.

- res.end()๋กœ ์ข…๋ฃŒํ•ด์•ผ ํ•˜๋Š” ๋•Œ

==> ๋ฐ์ดํ„ฐ๋ฅผ ์ œ๊ณตํ•˜์ง€ ์•Š๊ณ  ์‘๋‹ต์„ ์ข…๋ฃŒํ•˜๋ ค๋ฉด res.end()๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด๊ฒƒ์€ 404 ํŽ˜์ด์ง€์— ์œ ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

res.status(404).end();

  • res.end()๋กœ ์ข…๋ฃŒํ•˜์ง€ ์•Š์•„๋„ ๋˜๋Š” ๋•Œ
    ==> ๋ฐ์ดํ„ฐ๋ฅผ res.json() ์ด๋‚˜ res.send()๋กœ ๋ณด๋‚ด๋ฉด ์•Œ์•„์„œ ์ข…๋ฃŒํ•ฉ๋‹ˆ๋‹ค.

middleware


Express๋Š” ์ž์ฒด ๊ธฐ๋Šฅ์ด ์ตœ์†Œํ™”๋œ ๋ผ์šฐํŒ… ๋ฐ ๋ฏธ๋“ค์›จ์–ด ์›น ํ”„๋ ˆ์ž„์›Œํฌ์ž…๋‹ˆ๋‹ค. Express ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์€ ๋ณธ์งˆ์ ์œผ๋กœ ์ผ๋ จ์˜ ๋ฏธ๋“ค์›จ์–ด ๊ธฐ๋Šฅ ํ˜ธ์ถœ์ž…๋‹ˆ๋‹ค.

๋ฏธ๋“ค์›จ์–ด ๊ธฐ๋Šฅ์€ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ์š”์ฒญ-์‘๋‹ต ์ฃผ๊ธฐ์—์„œ ์š”์ฒญ ๊ฐ์ฒด(req), ์‘๋‹ต ๊ฐ์ฒด(res), next ๋ฏธ๋“ค์›จ์–ด ํ•จ์ˆ˜์— ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋Š” ๊ธฐ๋Šฅ์ž…๋‹ˆ๋‹ค. next ๋ฏธ๋“ค์›จ์–ด ๊ธฐ๋Šฅ์€ ์ผ๋ฐ˜์ ์œผ๋กœ next๋ผ๋Š” ๋ณ€์ˆ˜๋กœ ํ‘œ์‹œ๋ฉ๋‹ˆ๋‹ค.

MVC Pattern

MVC(๋ชจ๋ธ-๋ทฐ-์ปจํŠธ๋กค๋Ÿฌ)๋Š” ๊ด€๋ จ ํ”„๋กœ๊ทธ๋žจ ๋กœ์ง์„ ์ƒํ˜ธ ์—ฐ๊ฒฐ๋œ 3๊ฐœ์˜ ์š”์†Œ๋กœ ๋‚˜๋ˆ„๋Š” ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค๋ฅผ ๊ฐœ๋ฐœํ•˜๋Š” ๋ฐ ์ผ๋ฐ˜์ ์œผ๋กœ ์‚ฌ์šฉ๋˜๋Š” ์†Œํ”„ํŠธ์›จ์–ด ์•„ํ‚คํ…์ฒ˜ ํŒจํ„ด์ž…๋‹ˆ๋‹ค. - ์œ„ํ‚ค ํ”ผ๋””์•„
MVC (๋ชจ๋ธ-๋ทฐ-์ปจํŠธ๋กค๋Ÿฌ) ๋Š” ์‚ฌ์šฉ์ž ์ธํ„ฐํŽ˜์ด์Šค, ๋ฐ์ดํ„ฐ ๋ฐ ๋…ผ๋ฆฌ ์ œ์–ด๋ฅผ ๊ตฌํ˜„ํ•˜๋Š”๋ฐ ๋„๋ฆฌ ์‚ฌ์šฉ๋˜๋Š” ์†Œํ”„ํŠธ์›จ์–ด ๋””์ž์ธ ํŒจํ„ด์ž…๋‹ˆ๋‹ค. ์†Œํ”„ํŠธ์›จ์–ด์˜ ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง๊ณผ ํ™”๋ฉด์„ ๊ตฌ๋ถ„ํ•˜๋Š”๋ฐ ์ค‘์ ์„ ๋‘๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค. - MDN
-Model: ๋ฐ์ดํ„ฐ์™€ ๋น„์ฆˆ๋‹ˆ์Šค ๋กœ์ง์„ ๊ด€๋ฆฌํ•ฉ๋‹ˆ๋‹ค.
-View: ๋ ˆ์ด์•„์›ƒ๊ณผ ํ™”๋ฉด์„ ์ฒ˜๋ฆฌํ•ฉ๋‹ˆ๋‹ค.
-Controller: ๋ช…๋ น์„ ๋ชจ๋ธ๊ณผ ๋ทฐ ๋ถ€๋ถ„์œผ๋กœ ๋ผ์šฐํŒ… ํ•ฉ๋‹ˆ๋‹ค.

Router

ํด๋ผ์ด์–ธํŠธ์˜ ์š”์ฒญ ๊ฒฝ๋กœ(path)์— ๋”ฐ๋ผ ์ด ์š”์ฒญ์„ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ๋Š” ๊ณณ์œผ๋กœ ๊ธฐ๋Šฅ์„ ์ „๋‹ฌํ•ด์ฃผ๋Š” ๊ฒƒ์ด ๋ผ์šฐํ„ฐ ์ž…๋‹ˆ๋‹ค.

profile
์‹ค์ˆ˜๋ฅผ ๋‘๋ ค์›Œ ๋ง๊ณ  ๊ณ„์† ๋„์ „ ํ•˜๋Š” ๊ฐœ๋ฐœ์ž์˜ ์—ฌ์ •!

0๊ฐœ์˜ ๋Œ“๊ธ€