profile
Front ๐Ÿ’” End
post-thumbnail

๋ฏธ๋ฆฌ๋ณด๋Š” ๋ฆฌ์—‘ํŠธ 18 ์˜ ๋ณ€ํ™”..!

๋ณธ ๋ฌธ์„œ๋Š” 2022/03/21 ๊ธฐ์ค€ https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html ์—์„œ ๋ฐœ์ทŒํ•˜์˜€์Šต๋‹ˆ๋‹ค. Release Candidate ๋‹จ๊ณ„ ๋‚ด์šฉ์„ ์ž‘์„ฑํ•˜์˜€๊ธฐ ๋•Œ๋ฌธ์— ๋ณ€๊ฒฝ๋  ๊ฐ€๋Šฅ์„ฑ์ด ์žˆ์Šต๋‹ˆ๋‹ค. 1.

2022๋…„ 3์›” 22์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท

์„ ํƒ์ž ์ ์ˆ˜ ๋‚ฎ์ถ”๊ธฐ

์ด๋ฒˆ์— ํŒ€ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ•˜๋ฉฐ, Table ํ˜•์‹์˜ Grid ์ปดํฌ๋„ŒํŠธ ๊ตฌํ˜„์„ ๋‹ด๋‹นํ•˜๊ฒŒ ๋˜์—ˆ๋‹ค. ์ด๋•Œ ๊ฐ€์žฅ ์ค‘์š”ํ•˜๊ฒŒ ์ƒ๊ฐํ–ˆ๋˜ ๊ฒƒ์€ ์‚ฌ์šฉ์„ฑ์ด๋‹ค.Grid์ฒ˜๋Ÿผ ๋‹ค์–‘ํ•œ ๊ณณ์—์„œ ์žฌํ™œ์šฉ๋˜๋Š” ํ•„์ˆ˜ ์ปดํฌ๋„ŒํŠธ์˜ ๊ฒฝ์šฐ, ํ˜ธ์ถœ๋˜๋Š” ์ƒํ™ฉ์— ๋”ฐ๋ผ css๋ฅผ ๋ณ€๊ฒฝํ•  ์ผ์ด ๋นˆ๋ฒˆํžˆ ๋ฐœ์ƒํ•œ๋‹ค. props๋กœ

2022๋…„ 2์›” 2์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท
post-thumbnail

TIL: ์ด๋ฒคํŠธ ํ”„๋กœํผํ‹ฐ ๋ฐฉ์‹๊ณผ addEventListener ๋ฉ”์„œ๋“œ ๋ฐฉ์‹(feat: ์›ํ‹ฐ๋“œ ํ”„๋ฆฌ์˜จ๋ณด๋”ฉ ์ง€์›๊ณผ์ œ)

1. useCallback ์ผ๋ฐ˜ํ•จ์ˆ˜์—์„œ๋Š” ์ ์šฉ๋˜์ง€ ์•Š์œผ๋‚˜, ํ•ด๋‹นํ•จ์ˆ˜๋ฅผ useCallback์œผ๋กœ memoํ–ˆ์„ ๋•Œ ๋ฐœ๊ฒฌ๋œ ๋ฌธ์ œ๊ฐ€ ์žˆ์—ˆ๋‹ค. ์ƒํ™ฉ document.addEventListener์— useCallback์œผ๋กœ ๋ฉ”๋ชจ๋ผ์ด์ง•ํ•œ ํ•จ์ˆ˜๋ฅผ ์‚ฌ์šฉํ•  ๊ฒฝ์šฐ, removeEven

2022๋…„ 1์›” 23์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท

TIL: react key, callback ref, mouseEvent[clientX, screenX, pageX], text-overflow

react์˜ key๋Š” stable, predictable, unique ํ•ด์•ผํ•œ๋‹ค. ๋ฌดํ•œ slide๋ฅผ ๊ตฌํ˜„ํ•˜๋ฉฐ ์–‘์ชฝ ๋์— ๋™์ผํ•œ asset์ด ์ž…๋ ฅ๋˜๊ธฐ ๋•Œ๋ฌธ์— id๊ฐ€ ๊ฒน์น˜๋Š” ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ–ˆ๋‹ค. ์ด๋ฅผ ๊ฐ„๋‹จํ•˜๊ฒŒ ํ•ด๊ฒฐํ•˜๊ณ  ์‹ถ์–ด index + Math.random์„ ์‚ฌ์šฉํ–ˆ์œผ๋‚˜ 3๊ฐ€

2022๋…„ 1์›” 18์ผ
ยท
0๊ฐœ์˜ ๋Œ“๊ธ€
ยท