avatar

Javascript 40

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