๐Ÿฆ„ Cukehater

cukehater

๐Ÿฆ„ Cukehater

๊ฐœ๋ฐœ ๊ฒฝํ—˜๊ณผ ๊ธฐ์ˆ ์  ์ธ์‚ฌ์ดํŠธ๋ฅผ ๊ณต์œ ํ•ฉ๋‹ˆ๋‹ค ๐Ÿ’ปโœจ

์ „์ฒด 5๊ฐœ ํฌ์ŠคํŠธ

Oh My Zsh์—์„œ git ๋‹จ์ถ•ํ‚ค

์ด ๋‹จ์ถ•ํ‚ค๋“ค์€ Oh My Zsh์˜ git ํ”Œ๋Ÿฌ๊ทธ์ธ์—์„œ ์ œ๊ณต๋˜๋Š” ๊ฒƒ๋“ค์ž…๋‹ˆ๋‹ค. ์‹ค์ œ ์‚ฌ์šฉ ์‹œ์—๋Š” ์ž์‹ ์˜ ์›Œํฌํ”Œ๋กœ์šฐ์— ๋งž๋Š” ๋‹จ์ถ•ํ‚ค๋“ค์„ ์„ ๋ณ„ํ•˜์—ฌ ์‚ฌ์šฉํ•˜์‹œ๋Š” ๊ฒƒ์ด ์ข‹์Šต๋‹ˆ๋‹ค.

1๊ฐœ์›” ์ „

React 18+ ์ž๋™ ๋ฐฐ์นญ(Batching)

2022๋…„ 3์›” ๋ฆฌ์•กํŠธ 18๋ฒ„์ „์ด ์ถœ์‹œ๋˜์—ˆ๋Š”๋ฐ, ์ด์ „ ๋ฒ„์ „์ธ ๋ฆฌ์•กํŠธ 17์ด 16์— ๋น„ํ•ด ํฌ๊ฒŒ ๋‹ฌ๋ผ์ง€์ง€ ์•Š์€ ์ ๊ณผ ๋‹ฌ๋ฆฌ 18๋ฒ„์ „์—์„œ๋Š” ์—ฌ๋Ÿฌ ์ƒˆ๋กœ์šด ๊ธฐ๋Šฅ์ด ์†Œ๊ฐœ๋˜์—ˆ๋‹ค. ํŠนํžˆ ์ž๋™ ๋ฐฐ์นญ์€ 2๋…„์ด ์ง€๋‚œ ์ง€๊ธˆ๊นŒ์ง€ ๋ฆฌ์•กํŠธ ์ƒํƒœ๊ณ„์— ๋Œ€ํ•œ ๊นŠ์€ ์ดํ•ด ์—†์ด๋„ ์„ฑ๋Šฅ์„ ์ตœ์ ํ™”ํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ์ ์—์„œ ๊ฐœ๋ฐœ์ž๋“ค์ด ์‰ฝ๊ฒŒ ์ ‘๊ทผํ•˜๊ณ  ์ดํ•ดํ•  ์ˆ˜ ์žˆ๋Š” ๊ธฐ๋Šฅ์œผ๋กœ ํ‰๊ฐ€๋ฐ›๊ณ  ์žˆ๋‹ค.

1๋…„ ์ „

CSS ์ปจํ…Œ์ด๋„ˆ ์ฟผ๋ฆฌ(Container Query)

์ปจํ…Œ์ด๋„ˆ ์ฟผ๋ฆฌ๋Š” ๋ถ€๋ชจ ์ปจํ…Œ์ด๋„ˆ์˜ ํฌ๊ธฐ๋‚˜ ์ƒํƒœ์— ๋”ฐ๋ผ ์Šคํƒ€์ผ์„ ๋™์ ์œผ๋กœ ์กฐ์ •ํ•  ์ˆ˜ ์žˆ๊ฒŒ ํ•ด์ฃผ๋Š” ์ตœ์‹  CSS ๊ธฐ๋Šฅ ์ค‘ ํ•˜๋‚˜์ด๋‹ค. ๊ธฐ์กด ๋ฏธ๋””์–ด ์ฟผ๋ฆฌ๊ฐ€ ๋ทฐํฌํŠธ ํฌ๊ธฐ์— ๋”ฐ๋ผ ์Šคํƒ€์ผ์„ ๋ณ€๊ฒฝํ•˜๋Š” ๋ฐ ์‚ฌ์šฉ๋˜์—ˆ๋‹ค๋ฉด, ์ปจํ…Œ์ด๋„ˆ ์ฟผ๋ฆฌ๋Š” ์š”์†Œ๊ฐ€ ๋ฐฐ์น˜๋˜๋Š” ๊ณณ ์ž์ฒด์— ์ง‘์ค‘ํ•˜์—ฌ ์Šคํƒ€์ผ์„ ์กฐ์ ˆํ•˜๋Š” ์ƒˆ๋กœ์šด ์ ‘๊ทผ ๋ฐฉ์‹์„ ์ œ๊ณตํ•œ๋‹ค.

1๋…„ ์ „

JavaScript ํด๋กœ์ €(Closure)

MDN์—์„œ๋Š” ํด๋กœ์ €๋ฅผ "์ฃผ๋ณ€ ์ƒํƒœ(์–ดํœ˜์  ํ™˜๊ฒฝ)์— ๋Œ€ํ•œ ์ฐธ์กฐ์™€ ํ•จ๊ป˜ ๋ฌถ์ธ(ํฌํ•จ๋œ) ํ•จ์ˆ˜์˜ ์กฐํ•ฉ์ด๋ฉฐ, ์ด๋ฅผ ํ†ตํ•ด ์™ธ๋ถ€ ํ•จ์ˆ˜์˜ ์‹คํ–‰์ด ์ข…๋ฃŒ๋˜๋”๋ผ๋„ ๋‚ด๋ถ€ ํ•จ์ˆ˜์—์„œ ์™ธ๋ถ€ ํ•จ์ˆ˜์˜ ๋ฒ”์œ„์— ๋Œ€ํ•œ ์ ‘๊ทผ์„ ์ œ๊ณตํ•œ๋‹ค." ๋ผ๊ณ  ์„ค๋ช…ํ•œ๋‹ค.

2๋…„ ์ „

JavaScript์—์„œ this

JavaScript์—์„œ this๋Š” ์‹คํ–‰ ์ปจํ…์ŠคํŠธ๊ฐ€ ์ƒ์„ฑ๋  ๋•Œ ๊ฒฐ์ •๋˜๋Š”๋ฐ, ์‹คํ–‰ ์ปจํ…์ŠคํŠธ๋Š” ํ•จ์ˆ˜๊ฐ€ ํ˜ธ์ถœ๋  ๋•Œ ์ƒ์„ฑ๋˜๋ฏ€๋กœ this๋Š” ํ•จ์ˆ˜์˜ ํ˜ธ์ถœ ๋ฐฉ์‹์— ๋”ฐ๋ผ ๊ฐ’์ด ๋‹ฌ๋ผ์งˆ ์ˆ˜ ์žˆ๋‹ค.

2๋…„ ์ „