avatar
$

Javascript 34

  • Socket.IO ๊ณต๋ถ€ํ•˜๊ธฐ (1)

    Published on
    ยท
    4๋ถ„
    ## WebSocket ์›น์€ ์ „ํ˜•์ ์œผ๋กœ HTTP ์š”์ฒญ์— ๋Œ€ํ•œ HTTP ์‘๋‹ต์„ ๋ฐ›๊ณ , ์ด์— ๋”ฐ๋ผ ๋ธŒ๋ผ์šฐ์ € ํ™”๋ฉด์„ ์ƒˆ๋กœ ๋งŒ๋“œ๋Š” ๋ฐฉ์‹์ด๋‹ค. ๋”ฐ๋ผ์„œ ๋ฐ์ดํ„ฐ ํ†ต์‹ ์€ ์š”์ฒญ๊ณผ ์‘๋‹ต์ด ํ•œ ์Œ์œผ๋กœ ๋ฌถ์—ฌ์™”๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ ์›น ํŽ˜์ด์ง€๊ฐ€ ๋ณด๋‹ค ์‰ฝ๊ฒŒ ์ƒํ˜ธ์ž‘์šฉ์„ ํ•˜๋ ค๋ฉด, ๋ธŒ๋ผ์šฐ์ €์™€ ์›น ์‚ฌ์ด์— ์ด๋Ÿฌํ•œ ์š”์ฒญ - ์‘๋‹ต ๋ฐฉ์‹์ด ์•„๋‹Œ ๋” ์ž์œ ๋กœ์šด ์–‘๋ฐฉํ–ฅ ๋ฉ”์‹œ์ง€ ์†ก์ˆ˜์‹  ๊ธฐ์ˆ ์ด ํ•„์š”ํ•˜๋‹ค. ์ด๋Ÿฌํ•œ ...
  • NextJS 1. Page & Route

    Published on
    ยท
    8๋ถ„
    ์š”์ฆ˜ ๋ฆฌ์•กํŠธ๋ฅผ ์“ฐ๋Š” ๋งŽ์€ ํ”„๋กœ์ ํŠธ์—์„œ, SSR์„ ์ง€์›ํ•˜๊ธฐ ์œ„ํ•ด [nextjs](https://nextjs.org/)๋ฅผ ์“ฐ๊ณ  ์žˆ๋‹ค. ์ดˆ๊ธฐ ๋กœ๋”ฉ ์†๋„๋‚˜, SEO ์ง€์› ์ด์Šˆ ๋“ฑ ๋“ฑ ๋•Œ๋ฌธ์— ์•„๋ฌด๋ž˜๋„ SPA๋Š” ์š”์ฆ˜ ํŠธ๋ Œ๋“œ์—์„œ ๋งŽ์ด ๋ฐ€๋ฆฐ ๊ธฐ๋ถ„์ด๋‹ค. ๋ฌผ๋ก  [razzle](https://github.com/jaredpalmer/razzle) ์„ ์“ฐ๊ฑฐ๋‚˜ custom ser...
  • NextJS 2. Data Fetching

    Published on
    ยท
    13๋ถ„
    [nextjs์˜ ๊ณต์‹ ๋ฌธ์„œ](https://nextjs.org/docs/basic-features/data-fetching)๋ฅผ ๋ณด๊ณ  ์š”์•ฝํ•œ ๋‚ด์šฉ์ž…๋‹ˆ๋‹ค. ```toc tight: true, from-heading: 1 to-heading: 2 ``` ## 1. getInitialProps Nextjs 9.3 ์ด์ „์—๋Š” `getInitialProps` ๋ฐ–์—...
  • ## ์ปค๋ง [์ด ๊ธ€](https://www.sitepoint.com/currying-in-functional-javascript/) ์— ์ž˜ ์ •๋ฆฌ ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค. Currying์€ ์—ฌ๋Ÿฌ ๊ฐœ์˜ ์ธ์ž๋ฅผ ๊ฐ€์ง„ ํ•จ์ˆ˜๋ฅผ ํ˜ธ์ถœ ํ•  ๊ฒฝ์šฐ, ํŒŒ๋ผ๋ฏธํ„ฐ์˜ ์ˆ˜๋ณด๋‹ค ์ ์€ ์ˆ˜์˜ ํŒŒ๋ผ๋ฏธํ„ฐ๋ฅผ ์ธ์ž๋กœ ๋ฐ›์œผ๋ฉด ๋ˆ„๋ฝ๋œ ํŒŒ๋ผ๋ฏธํ„ฐ๋ฅผ ์ธ์ž๋กœ ๋ฐ›๋Š” ๊ธฐ๋ฒ•์„ ๋งํ•œ๋‹ค. ์ฆ‰ ์ปค๋ง์€ ํ•จ์ˆ˜ ํ•˜๋‚˜๊ฐ€ n๊ฐœ...
  • `toc tight: true, from-heading: 2 to-heading: 3 ` ## 1. ์„œ๋ก  ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์—์„œ http ์š”์ฒญ์„ ํ•˜๋Š” ๊ฒƒ์€ ์ด์ œ ๋น„์ผ๋น„์žฌํ•œ ์ผ์ด ๋˜์—ˆ๋‹ค. ์„œ๋ฒ„์—์„œ ๋ชจ๋“  ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์™€์„œ static ํ•œ html์„ ๋งŒ๋“ค์–ด์„œ ๋ณด์—ฌ์ฃผ๊ณ  ์žˆ๋Š” ์›นํŽ˜์ด์ง€๋Š” ์•„๋งˆ ์ฐพ๊ธฐ ์–ด๋ ค์šธ ๊ฒƒ์ด๋‹ค. ๋งจ ์ฒ˜์Œ ์›น์„ ๋ฐฐ์šธ ๋•Œ, jquery์˜ ajax ...