๋ชฉ๋ก๋ถ„๋ฅ˜ ์ „์ฒด๋ณด๊ธฐ (181)

๐ŸŒฑ → ๐ŸŒณ

[node.js] Express ๊ธฐ๋ณธ ํด๋” ๊ตฌ์กฐ

๐Ÿ“Œ Static : ๋ธŒ๋ผ์šฐ์ €์—์„œ ์ ‘๊ทผ์ด ๊ฐ€๋Šฅํ•œ ํด๋”์˜ ์œ„์น˜๋ฅผ ์ง€์ •ํ•ด ์ฃผ๋Š” ์—ญํ•  app.use(express.static('views')); ์œ„์˜ ๋ฏธ๋“ค์›จ์–ด๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ํ”„๋กœ์ ํŠธ์—์„œ ์‚ฌ์šฉํ•˜๋Š” ํด๋” ๊ฒฝ๋กœ์˜ ์‹œ์ž‘์  -> localhost:4000/views ./ ์˜ ์ƒ๋Œ€ ๊ฒฝ๋กœ -> localhost:4000/views/ ์™€ ๋™์ผํ•œ ์˜๋ฏธ๋ฅผ ๊ฐ€์ง ๋ธŒ๋ผ์šฐ์ €์—์„œ ์ ‘๊ทผ ๊ฐ€๋Šฅํ•œ ๊ธฐ๋ณธ ํด๋”๋ฅผ ์„ค์ •ํ•˜๋Š” ๋งŒํผ ๋„ˆ๋ฌด ๋งŽ์€ ํด๋”๋ฅผ ์ •ํ•˜๋Š” ๊ฒƒ์€ ํ”ผํ•˜๋Š” ํŽธ์ด ์ข‹์Œ ๋ณดํ†ต public ์ด๋ผ๋Š” ํด๋”๋ฅผ ๊ธฐ๋ณธ์œผ๋กœ ์„ค์ •ํ•ด ๋†“๊ณ  ํ•ด๋‹น ํด๋”๋งŒ ์„ค์ • public ํด๋”์˜ ๊ฒฝ์šฐ ๋ธŒ๋ผ์šฐ์ € ๋“ฑ์˜ ํด๋ผ์ด์–ธํŠธ๊ฐ€ ์ ‘๊ทผ์ด ๊ฐ€๋Šฅํ•œ ํด๋”๋กœ์จ ๋ณดํ†ต CSS, ๋ธŒ๋ผ์šฐ์ €์—์„œ ์‚ฌ์šฉํ•˜๋Š” JS, ์ด๋ฏธ์ง€ ๋“ฑ์„ ์œ„์น˜ ๐Ÿ“Œ Express ๊ธฐ๋ณธ ํด๋” ๊ตฌ์กฐ /images = /img /jav..

Server/Node.js 2022. 9. 5. 17:20
middleware๋ž€?

๐Ÿ“Œ middleware๋ž€? (์‚ฌ์ „์ ์˜๋ฏธ) ์„œ๋กœ ๋‹ค๋ฅธ ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜(ํ”„๋กœ๊ทธ๋žจ)์ด ์„œ๋กœ ํ†ต์‹ ์„ ํ•˜๋Š”๋ฐ ์‚ฌ์šฉ๋˜๋Š” ์†Œํ”„ํŠธ์›จ์–ด ์ฆ‰, ์–‘์ชฝ ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜ ๊ฐ€์šด๋ฐ์—์„œ ์—ญํ• ์„ ํ•˜๋Š” ์†Œํ”„ํŠธ์›จ์–ด Express: ๋ฒก์—”๋“œ ์„œ๋น„์Šค ๊ตฌ์„ฑ์„ ์œ„ํ•œ ๋‹ค์–‘ํ•œ ์ƒํ™ฉ์— ๋งž๋Š” ์—ฌ๋Ÿฌ๊ฐ€์ง€ ์„œ๋น„์Šค๋ฅผ ๋ฏธ๋“ค์›จ์–ด ํ˜•ํƒœ๋กœ ์ œ๊ณต Express ์—์„œ์˜ ๋ฏธ๋“ค์›จ์–ด๋Š” ์„œ๋ฒ„์— ๋“ค์–ด์˜จ ์š”์ฒญ์ด ๋“ค์–ด์™€์„œ ์‘๋‹ต์œผ๋กœ ๋‚˜๊ฐˆ ๋•Œ ๊นŒ์ง€ ๊ฑฐ์น˜๋Š” ๋ชจ๋“  ํ•จ์ˆ˜ ๋˜๋Š” ๊ธฐ๋Šฅ์„ ์˜๋ฏธ ์š”์ฒญ -> ๋ฏธ๋“ค์›จ์–ด -> ์‘๋‹ต โœ… middleware ์‚ฌ์šฉํ•˜๊ธฐ Express ์—์„œ๋Š” app.use ๋˜๋Š” app.method ํ•จ์ˆ˜๋ฅผ ์ด์šฉํ•ด์„œ ๋ฏธ๋“ค์›จ์–ด ์‚ฌ์šฉ ๊ธฐ์กด์— ํ•จ์ˆ˜๋ฅผ ์„ ์–ธํ•˜์—ฌ ์‚ฌ์šฉํ–ˆ๋˜ ๊ฒƒ ์ฒ˜๋Ÿผ, ์œ„์˜ ๋ฉ”์†Œ๋“œ๋ฅผ ์ด์šฉํ•ด์„œ req, res ์— ๋Œ€ํ•œ ์ฒ˜๋ฆฌ app.use(‘์š”์ฒญ ์ฃผ์†Œ‘, (req, res, next) =>..

Server 2022. 9. 2. 18:00
[node.js] Yarn์ด๋ž€?

๐Ÿ“Œ Yarn ์ด๋ž€? Facebook์—์„œ ๋งŒ๋“  ๋…ธ๋“œ ํŽ˜ํ‚ค์ง€ ๊ด€๋ฆฌ์ž ๋„๊ตฌ npm๊ณผ ์ •ํ™•ํ•˜๊ฒŒ ๊ฐ™์€ ์ผ์„ ํ•ด์คŒ(but, ๊ฐ€๋ณ๊ณ  ๋น ๋ฆ„) + React๋„ Facebook์—์„œ ๋งŒ๋“ค์–ด์„œ ์ถ”ํ›„์— ํŽธ๋ฆฌํ•จ โœ… Yarn์˜ ์žฅ์  ์†๋„ ํŒจํ‚ค์ง€ ๋ฐ์ดํ„ฐ๋ฅผ Cache ์— ์ €์žฅํ•˜์—ฌ ์ค‘๋ณต๋œ ๋ฐ์ดํ„ฐ๋Š” ๋‹ค์šด ๋ฐ›์ง€ ์•Š๊ณ  ์„ค์น˜ ํ•ฉ๋‹ˆ๋‹ค -> ์†๋„๊ฐ€ ๋” ๋น ๋ฆ…๋‹ˆ๋‹ค ์•ˆ์ •์„ฑ & ๋ณด์•ˆ์„ฑ Yarn ์€ ์ด์ „์— npm์ด ์ œ๊ณตํ•˜์ง€ ์•Š๋˜ yarn.lock ํŒŒ์ผ์„ ์ œ๊ณต ๊ฐ„๋‹จํ•œ ์ •๋ณด๋งŒ ํฌํ•จํ•˜๋˜ packge.json ์ด ์•„๋‹ˆ๋ผ ๊ฐ ํŒจํ‚ค์ง€์˜ ์„ธ๋ถ€ ์ •๋ณด๋ฅผ ์ „๋ถ€ ํฌํ•จํ•˜๋Š” lock ํŒŒ์ผ์˜ ์กด์žฌ๋Š” ์–ด๋Š ํ™˜๊ฒฝ์—์„œ๋‚˜ ๊ฐ™์€ ํŒจํ‚ค์ง€๋ฅผ ์„ค์น˜ํ•  ์ˆ˜ ์žˆ๋„๋ก ๋ณด์žฅ์„ ํ•ด์คฌ๊ธฐ ๋•Œ๋ฌธ์— ์•ˆ์ „์„ฑ๊ณผ ๋ณด์•ˆ์„ฑ์ด ๋›ฐ์–ด๋‚จ ๋‚˜์ค‘์—, npm ๋„ pakage-lock.json ์„ ๋„์ž…ํ•˜์—ฌ ์ด์™€ ๊ฐ™์€ ๋ฌธ์ œ ํ•ด๊ฒฐ ์ง€๊ธˆ..

Server/Node.js 2022. 9. 2. 15:24
[JavaScript] JS์—์„œ Module ์‚ฌ์šฉํ•˜๊ธฐ

๐Ÿ“ Code Refactoring : ํ”„๋กœ๊ทธ๋žจ์˜ ๋™์ž‘์€ ๋ณ€ํ•˜์ง€ ์•Š๊ณ , ํ”„๋กœ๊ทธ๋žจ์˜ ๋‚ด๋ถ€ ๊ตฌ์กฐ๋ฅผ ๊ฐœ์„  ํ•˜๋Š” ๊ฒƒ! ์›์‹œ ๊ธฐ์ˆ  -> ์ƒˆ๋กœ์šด ๊ธฐ์ˆ  ์ฝ”๋“œ ๋น„ํšจ์œจ -> ํšจ์œจ(๋ฐ˜๋ณต๋ฌธ ์ค„์ด๊ธฐ, ์ค‘๋ณต ๊ธฐ๋Šฅ ์ œ๊ฑฐ, ๋ฉ”๋ชจ๋ฆฌ ํšจ์œจ ์ฆ๋Œ€) ์ฝ”๋“œ ๊ฐ€๋…์„ฑ ๋†’์ด๊ธฐ ์ฝ”๋“œ์˜ ํ™•์žฅ์„ฑ ๋†’์ด๊ธฐ ๐Ÿ“Œ JS์—์„œ Module ์‚ฌ์šฉํ•˜๊ธฐ JS ๋„ Module ์„ ์ง€์›ํ•จ ๐Ÿ“ 2๊ฐ€์ง€ ๋ฐฉ์‹ CommonJS ๋ฐฉ์‹ ES6 ๋ฐฉ์‹ โœ… CommonJS ๋ฐฉ์‹ node.js์—์„œ ์‚ฌ์šฉํ•˜๋Š” ๋ชจ๋“ˆ ๋ฐฉ์‹ ํ‚ค์›Œ๋“œ : require/ exports require๋กœ ๋ชจ๋“ˆ์„ ๋ถˆ๋Ÿฌ ์˜ฌ ๋•Œ, ์ฝ”๋“œ ์–ด๋Š ๊ณณ์—์„œ๋‚˜ ๋ถˆ๋Ÿฌ ์˜ฌ ์ˆ˜ ์žˆ์Œ โœ”๏ธ ์ „์ฒด ๋ชจ๋“ˆ๋กœ์จ ๋‚ด๋ณด๋‚ด๊ณ , ์ „์ฒด๋ฅผ ํ•˜๋‚˜์˜ Obj๋กœ ๋ฐ›์•„์„œ ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ• animals.js // @ts-check const animals = ['dog', ..

Client/Javascript 2022. 8. 29. 18:37
JSDoc ๋ž€?

๐Ÿ“Œ JSDoc ๋ž€? ์ผ์ข…์˜ ์ฃผ์„ ๋‹ฌ๊ธฐ ๊ฑฐ์˜ ํ‘œ์ค€ํ™”๊ฐ€ ๋˜์–ด์„œ Vscode, Webstorm ๋“ฑ ์—์„œ๋Š” ๊ธฐ๋ณธ์œผ๋กœ ๊ธฐ๋Šฅ์„ ์ œ๊ณต ํŠน์ • ํ˜•ํƒœ๋กœ ์ฃผ์„์„ ๋‹ฌ๋ฉด ํ•ด๋‹น ์ฃผ์„ ๋‚ด์šฉ์„ ํ†ตํ•ด ํ•จ์ˆ˜์˜ ๊ธฐ๋Šฅ ๋˜๋Š” ๋งค๊ฐœ ๋ณ€์ˆ˜์˜ ํƒ€์ž…๋“ฑ์„ ๋ฏธ๋ฆฌ ์•Œ๋ ค์ค„ ์ˆ˜ ์žˆ์Œ ์ฃผ์„์„ ๋‹ฌ ๋•Œ /** */ ๋กœ ๋‹ฌ๋ฉด ๋จ โœ… JSDoc ๋ถ€๊ฐ€ ๊ธฐ๋Šฅ @todo ๋ฉ”๋ชจ์ฒ˜๋Ÿผ ์‚ฌ์šฉ ๊ฐ€๋Šฅ, ๊ฐœ๋ฐœํ•˜๋‹ค๊ฐ€ ๋ฉˆ์ถœ๋•Œ ๋‹ค์Œ๋ถ€ํ„ฐ ํ•ด์•ผํ•  ๊ฒƒ ์จ๋†“๊ธฐ /** * @todo ๋‚ด์ผ ์ƒˆ๋กœ์šด ๋งค๊ฐœ๋ณ€์ˆ˜ ์ถ”๊ฐ€ ํ•ด์•ผํ•จ due to 10:30 .. */ @deprecated ๋” ์ด์ƒ ํ•ด๋‹น ๊ธฐ๋Šฅ์„ ์“ฐ์ง€ ์•Š์„ ๋•Œ ์ถ”๊ฐ€ -> ํ•จ์ˆ˜ ์“ฐ๋ฉด ๊ฐ€๋กœ์ค„์ด ๊ทธ์–ด์ง @type {ํƒ€์ž… ํ˜•ํƒœ} ๋ณ€์ˆ˜์— ํŠน์ • ํƒ€์ž…์„ ์“ฐ๋ผ๊ณ  ์•Œ๋ ค ์ค„ ๋•Œ ์‚ฌ์šฉ์ด ๊ฐ€๋Šฅ ์š”์ฆ˜์€ typescript๊ฐ€ ์ด ์—ญํ• ์„ ๋Œ€์‹  ํ•ด์ค˜์„œ ์ž˜ ์•ˆ์“ฐ๊ธด ํ•จ โœ… JSDoc..

Client/Javascript 2022. 8. 29. 13:43