๐Ÿ—“ 2019.08.26 ~ 2019.09.01


๐Ÿ“” ๋ธ”๋กœ๊ทธ

๐Ÿ‡ฐ๐Ÿ‡ท ๋‰ด์งˆ๋žœ๋“œ ์ด๋ฏผ ํ›„ S/W ๊ฐœ๋ฐœ์ž ์ด์ง ๊ฒฝํ—˜๊ธฐ #1~2

  • ๋‰ด์งˆ๋žœ๋“œ ์ด๋ฏผ ํ›„ ๋ช‡๋ช‡ ํšŒ์‚ฌ์— ํ”„๋ก ํŠธ์—”๋“œ ๊ฐœ๋ฐœ์ž๋กœ ์ง€์›ํ•˜๋ฉด์„œ ๊ฒฝํ—˜ํ•œ ๊ฒƒ๋“ค์„ ์ ์€ ํ›„๊ธฐ๊ธ€.
  • ๊ตฌ์ง ํŒ, ์ธํ„ฐ๋ทฐ ํŒ๋“ค์„ ์ž์„ธํžˆ ์ ์–ด์ฃผ์…จ๋‹ค.

๐Ÿ‡ฐ๐Ÿ‡ท 'Getting Closure on React Hooks' ์ •๋ฆฌ

  • JSConf Asia 2019์˜ 'Getting Closure on React Hooks' ๋ฐœํ‘œ๋ฅผ ํ•œ๊ธ€๋กœ ์ •๋ฆฌํ•œ ๊ธ€.
  • React hooks์˜ useState, useEffect๋ฅผ ์•ฝ์‹์œผ๋กœ ์ง์ ‘ ๊ตฌํ˜„ํ•ด๋ณด๋Š” ๊ณผ์ •์„ ์„ค๋ช…ํ•œ๋‹ค.

๐Ÿ‡ฐ๐Ÿ‡ท ๋ฌธ๊ณผ์ƒ์˜ ์นด์นด์˜ค ๊ฐœ๋ฐœ์ž ์ด์ง๊ธฐ - 1~4

  • ํ–‰์ •ํ•™, ๊ฒฝ์˜ํ•™์„ ์ „๊ณตํ•˜๊ณ  ์กธ์—…ํ•˜์‹  ๋น„์ „๊ณต์ž๋ถ„์ด ์นด์นด์˜ค๋กœ ์ด์งํ•˜๋ฉด์„œ ๊ฑฐ์นœ ๋ฉด์ ‘ ํ”„๋กœ์„ธ์Šค ๋™์•ˆ ์“ฐ์‹  ๋„คํŽธ์˜ ๊ธ€.

๐Ÿ‡ฐ๐Ÿ‡ท ๐Ÿšซ ์•ˆํ‹ฐ ํŒจํ„ด์œผ๋กœ์„œ์˜ CSS background-image ์†์„ฑ

  • ์ด๋ฒˆ ์ฃผ์— ๋ฒˆ์—ญํ•œ "The CSS background-image property as an anti-pattern"๋ผ๋Š” ์ œ๋ชฉ์˜ ๊ธ€.
  • ์ด๋ฏธ์ง€ ์‚ฌ์šฉ์‹œ ํ•ญ์ƒ <img>๋ฅผ ์‚ฌ์šฉํ•ด์•ผํ•˜๋Š”์ง€ background-image๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ์ข‹์€์ง€ ๋ญ๊ฐ€ ๋‹ค๋ฅธ๊ฑด์ง€ ๊ถ๊ธˆํ–ˆ์—ˆ๋Š”๋ฐ ์ž˜ ์„ค๋ช…๋œ ๊ธ€์ด ์žˆ์–ด์„œ ๋ฒˆ์—ญํ–ˆ๋‹ค.

๐Ÿ“ฐ ๋‰ด์Šค

๐Ÿ‡ฐ๐Ÿ‡ท โ€˜๋ฑ…ํฌ์ƒ๋Ÿฌ๋“œโ€™ ์šด์˜์‚ฌ ๋ ˆ์ด๋‹ˆ์ŠคํŠธ, 450์–ต ๊ทœ๋ชจ ์‹œ๋ฆฌ์ฆˆ C ํˆฌ์ž ์œ ์น˜โ€ฆ๊ธฐ์—…๊ฐ€์น˜ 3000์–ต ํ‰๊ฐ€

  • ๋ฑ…ํฌ์ƒ๋Ÿฌ๋“œ๋ฅผ ๋งŒ๋“ค๊ณ ์žˆ๋Š” ๋ ˆ์ด๋‹ˆ์ŠคํŠธ๊ฐ€ 450์–ต ๊ทœ๋ชจ์˜ ์‹œ๋ฆฌ์ฆˆ C ํˆฌ์ž๋ฅผ ๋งˆ์ณค๋‹ค๊ณ  ํ•œ๋‹ค.
  • ์นด์นด์˜ค๋ฑ…ํฌ ์œ ์ €๋ผ ์‚ฌ์šฉ์€ ๋ชปํ•˜๊ณ ์žˆ๋Š”๋ฐ, API๋งŒ ์˜คํ”ˆ๋œ๋‹ค๋ฉด ์‚ฌ์šฉํ•  ์ž ์žฌ๊ณ ๊ฐ์ด ์—„์ฒญ ๋งŽ์ง€ ์•Š์„๊นŒ..

๐Ÿ‡ฐ๐Ÿ‡ท ์ „ ์„ธ๊ณ„ ์ผ๋ถ€ ํ•ญ๊ณต์‚ฌ๋“ค 15์ธ์น˜ Macbook Pro ๊ธฐ๋‚ด ๋ฐ˜์ž… ๋ฐ ์œ„ํƒ ์ˆ˜ํ™”๋ฌผ ์ฒ˜๋ฆฌ ๊ธˆ์ง€ ํ™•์‚ฐ

  • 15๋…„ ~ 17๋…„์— ์ƒ์‚ฐ๋œ Macbook Pro 15์ธ์น˜ ๋ชจ๋ธ์ด ์ „์„ธ๊ณ„ ์ผ๋ถ€ ํ•ญ๊ณต์‚ฌ์—์„œ ๋ฐฐํ„ฐ๋ฆฌ ์ด์Šˆ๋กœ ์ˆ˜ํ™”๋ฌผ ๋ฐ˜์ž…์„ ๊ธˆ์ง€๋ฅผ ํ•˜๊ณ ์žˆ๋‹ค๊ณ  ํ•œ๋‹ค.
  • ๋‚˜๋„ 17๋…„์— ์ƒ์‚ฐ๋œ Macbook Pro๋ฅผ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์–ด์„œ ํ™•์ธํ•ด๋ดค๋Š”๋ฐ ๋‹คํ–‰์ด ํ„ฐ์น˜๋ฐ” ๋ชจ๋ธ์€ ์•„๋‹ˆ๋ผ๊ณ  ํ•œ๋‹ค.

๐Ÿ‡บ๐Ÿ‡ธ npm bans terminal ads

  • ๊ฐ€๋” node package ์ค‘์—์„œ ์„ค์น˜ ์‹œ์— ๋ธ”๋ก์ฒด์ธ ์ง€๊ฐ‘์ฃผ์†Œ๋‚˜ Patreon ์ฃผ์†Œ๋ฅผ ๊ด‘๊ณ ํ•˜๋Š” ๊ฒฝ์šฐ๊ฐ€ ์žˆ๋Š”๋ฐ, npm์ด ๋‹ค์Œ ์—…๋ฐ์ดํŠธ์—์„œ ์ด๋ฅผ ๋ชจ๋‘ ๊ธˆ์ง€ํ•  ๊ฒƒ์ด๋ผ๊ณ  ํ•œ๋‹ค.
  • ๋งŽ์€ package๋“ค์ด ์„ค์น˜์‹œ ๊ด‘๊ณ ๋ฅผ ์ถ”๊ฐ€ํ•˜๊ฒŒ๋œ๋‹ค๋ฉด, ์œ ์ €๊ฐ€ ์•„๋ž˜์ชฝ์— ์ถœ๋ ฅ๋˜๋Š” ๊ด‘๊ณ ๋“ค๋งŒ ๋ณผ ์ˆ˜ ์žˆ๊ฒŒ ๋˜๋‹ˆ ๊ฒฐ๊ตญ ๋ฌธ์ œ๊ฐ€ ์ƒ๊ธด๋‹ค. yarn์€ post-install scripts๋ฅผ ์ถœ๋ ฅํ•˜์ง€ ์•Š์•„์„œ ๊ธฐ๋ณธ์ ์œผ๋กœ ๊ด‘๊ณ ๊ฐ€ ๋œจ์ง€ ์•Š๋Š”๋‹ค๊ณ  ํ•œ๋‹ค. ๊ด€๋ จ Github ์ด์Šˆ

๐Ÿ“น ์˜์ƒ

๐Ÿ‡บ๐Ÿ‡ธ (31:32) The Story of CodeSandbox || Ives van Hoorne - [Coding Tech]

  • CodeSandbox๋ฅผ ๋งŒ๋“  Ives van Hoorne์˜ React Amsterdam 2019 ๋ฐœํ‘œ ์˜์ƒ.
  • 3๋…„์ „ CodeSandbox๊ฐ€ ์–ด๋–ป๊ฒŒ ์‹œ์ž‘๋˜์—ˆ์œผ๋ฉฐ, ์–ด๋–ป๊ฒŒ ๋งŒ๋“ค์—ˆ๋Š”์ง€ 3๋…„๊ฐ„์˜ ์Šคํ† ๋ฆฌ๋ฅผ ์ด์•ผ๊ธฐํ•œ๋‹ค.

๐Ÿ’ป ์˜คํ”ˆ์†Œ์Šค

pagemap

  • VSCode minimap ๊ธฐ๋Šฅ์˜ Web ํ”Œ๋Ÿฌ๊ทธ์ธ ๋ฒ„์ „ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ.
  • ์Šคํฌ๋กค ์˜†์— ์›น์‚ฌ์ดํŠธ์˜ ์ „์ฒด ๋ฏธ๋‹ˆ๋งต์„ ๋ณด์—ฌ์ค€๋‹ค.

nushell

  • Rust๋กœ ์ž‘์„ฑ๋œ ๋ชจ๋˜ ์‰˜.

aos

  • ์Šคํฌ๋กค์— ๋”ฐ๋ผ ํŠน์ • DOM์— ์• ๋‹ˆ๋ฉ”์ด์…˜์„ ์ค„ ์ˆ˜ ์žˆ๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ.
  • API๊ฐ€ ๊ต‰์žฅํžˆ ์‚ฌ์šฉํ•˜๊ธฐ ์‰ฝ๊ณ  ๊น”๋”ํ•˜๊ฒŒ ๋˜์–ด์žˆ๋‹ค.

WebGL-Fluid-Simulation

  • WebGL์„ ์ด์šฉํ•œ ์œ ์ฒด ์‹œ๋ฎฌ๋ ˆ์ดํ„ฐ.

wttr.in

  • ๋‚ ์”จ๋ฅผ ํ™•์ธํ•  ์ˆ˜ ์žˆ๋Š” ์„œ๋น„์Šค.
  • curl wttr.in ๊ฐ™์€ HTTP client๋กœ ํ„ฐ๋ฏธ๋„์—์„œ ๋‚ ์”จ๋ฅผ ํ™•์ธํ•  ์ˆ˜ ์žˆ๋‹ค.

๐Ÿ”— ๊ทธ ์™ธ ์œ ์šฉํ•œ ๋งํฌ

๐Ÿ“• Elastic ๊ฐ€์ด๋“œ ๋ถ

  • Elastic ๊ฐ€์ด๋“œ๋ถ์ด ๊ณต๊ฐœ๋˜์—ˆ๋‹ค. 7.x ๋ฒ„์ „์„ ๊ธฐ์ค€์œผ๋กœ ์ž‘์„ฑ๋˜์—ˆ๋‹ค.

๐ŸŽจ logomaster.ai

  • ์„œ๋น„์Šค, ์ƒ‰, ๋ฌธ์–‘ ๋“ฑ์„ ๊ณ ๋ฅด๋ฉด ๋กœ๊ณ ๋ฅผ ๋งŒ๋“ค์–ด์ฃผ๋Š” ์„œ๋น„์Šค.