๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

์ „์ฒด ๊ธ€

(59)
Specified module format (CommonJs) is not matching the module format of the source code (EcmaScript Modules) Specified module format (CommonJs) is not matching the module format of the source code (EcmaScript Modules) The CommonJs module format was specified in the package.json that is affecting this source file or by using an special extension, but Ecmascript import/export syntax is used in the source code. The module was automatically converted to an EcmaScript module, but that is in conflict with th..
[โš›๏ธ React conf 2024] ๋‘ ๋Œ€์˜ ์ปดํ“จํ„ฐ๋กœ ๋Œ์•„๊ฐ€๋Š” ๋ฆฌ์•กํŠธ (React for Two Computers | Dan Abramov) 2024.09.24 - [๐Ÿ‘ฉ๐Ÿป‍๐Ÿ’ป dev] - [โš›๏ธ React Conf 2024] ๋ฆฌ์•กํŠธ 19์—์„œ ์ƒˆ๋กœ์›Œ์ง„ ๊ฒƒ๋“ค (What's new in React 19 | Lydia Hallie) [โš›๏ธ React Conf 2024] ๋ฆฌ์•กํŠธ 19์—์„œ ์ƒˆ๋กœ์›Œ์ง„ ๊ฒƒ๋“ค (What's new in React 19 | Lydia Hallie)What's new in React 19 | Lydia Hallie์•ฝ 2 ๋‹ฌ ์ „์— REACT CONF 2024๊ฐ€ ์—ด๋ ธ๋‹ค.์—ฌ๋Ÿฌ ํ† ํฌ๋“ค์ด ์ง„ํ–‰๋˜์—ˆ์—ˆ๋Š”๋ฐ, ๊ทธ์ค‘ ๋”ฐ๋ˆ ๋”ฐ๊ทผ(?)ํ•œ React 19์˜ ์ƒˆ ์†Œ์‹๋“ค์„ ์‚ดํŽด๋ณด๊ณ ์ž ํ•œ๋‹ค.canary ๋ฒ„์ „์˜ ๋ฆฌ์•กํŠธ๋ฅผ ์“ฐ๊ณ  ์žˆ์—ˆ๋‹ค๋ฉดpyotato-dev.tistory.com์ด์ „ ๊ธ€์€ ๋ฆฌ์•กํŠธ 19์—์„œ ์ƒˆ๋กœ์›Œ์ง„ ๊ธฐ๋Šฅ๋“ค์ด๋‚˜ ๊ฐœ์„ ๋œ ์‚ฌํ•ญ์— ๋Œ€ํ•ด ์‚ดํŽด๋ดค์—ˆ๋‹ค.์˜ค๋Š˜..
[TOSS] useFunnel ๋งŒ๋“ค์–ด๋ณด๊ธฐ 2024.07.05 - [๐Ÿ‘ฉ๐Ÿป‍๐Ÿ’ป dev] - ํ† ์Šคใ…ฃSLASH 23 - ํผ๋„ : ์Ÿ์•„์ง€๋Š” ํŽ˜์ด์ง€ ํ•œ ๋ฐฉ์— ๊ด€๋ฆฌํ•˜๊ธฐ (TOSH | SLASH 23 - Funnel Pattern : Organizing an overflow of pages at once) ํ† ์Šคใ…ฃSLASH 23 - ํผ๋„ : ์Ÿ์•„์ง€๋Š” ํŽ˜์ด์ง€ ํ•œ ๋ฐฉ์— ๊ด€๋ฆฌํ•˜๊ธฐ (TOSH | SLASH 23 - Funnel Pattern : Organizing an ovโš ๏ธ ์ €์ž‘๊ถŒ ๋ณดํ˜ธ๋ฅผ ์œ„ํ•ด ์ž๋ฃŒ ๋ฐ ์˜ˆ์‹œ๊ฐ€ ๋Œ€์ฒด๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ์˜ˆ์‹œ ์ฝ”๋“œ๋Š” Reactโš›๏ธ๋กœ ์ž‘์„ฑ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.๐Ÿซจ ํ†ต์‹ ์‚ฌ ๊ฐ€์ž…์„ ํ•˜๊ธฐ ์œ„ํ•ด์„œ ์•„๋ž˜์™€ ๊ฐ™์ด ๊ธด ํผ๊ณผ ์•ฝ์ •์ด ํฌํ•จ๋œ ํŽ˜์ด์ง€๋ฅผ ๋งˆ์ฃผ์น˜๊ฒŒ ๋  ๋•Œpyotato-dev.tistory.com์ด์ „ ํ† ์Šค SLASH23์— ์†Œ๊ฐœ๋œ useFunnel์— ๋Œ€ํ•ด ์‚ด..
[โš›๏ธ React Conf 2024] ๋ฆฌ์•กํŠธ 19์—์„œ ์ƒˆ๋กœ์›Œ์ง„ ๊ฒƒ๋“ค (What's new in React 19 | Lydia Hallie) What's new in React 19 | Lydia Hallie์•ฝ 2 ๋‹ฌ ์ „์— REACT CONF 2024๊ฐ€ ์—ด๋ ธ๋‹ค.์—ฌ๋Ÿฌ ํ† ํฌ๋“ค์ด ์ง„ํ–‰๋˜์—ˆ์—ˆ๋Š”๋ฐ, ๊ทธ์ค‘ ๋”ฐ๋ˆ ๋”ฐ๊ทผ(?)ํ•œ React 19์˜ ์ƒˆ ์†Œ์‹๋“ค์„ ์‚ดํŽด๋ณด๊ณ ์ž ํ•œ๋‹ค.canary ๋ฒ„์ „์˜ ๋ฆฌ์•กํŠธ๋ฅผ ์“ฐ๊ณ  ์žˆ์—ˆ๋‹ค๋ฉด ์†Œ๊ฐœํ•  ๋‚ด์šฉ๋“ค์ด ์ด๋ฏธ ์ต์ˆ™ํ•œ ๊ฒƒ๋“ค์ผ ์ˆ˜ ์žˆ์ง€๋งŒ,์•ˆ์ •ํ™”๋œ ๋ฒ„์ „์„ ๊ธฐ๋‹ค๋ฆฐ ๋‚˜์™€ ๊ฐ™์€ ์‚ฌ๋žŒ๋“ค์€ ํ•ด๋‹น ํ† ํฌ์—์„œ ๋ฐ˜๊ฐ€์šด ์†Œ์‹๋“ค์„ ์ „ํ•ด ๋“ค์„ ์ˆ˜ ์žˆ์„ ๊ฑฐ ๊ฐ™๋‹ค.์ด๋ฒˆ์—๋Š” ๊ฐ„๋‹จํ•˜๊ฒŒ ์–ด๋–ค ๊ฒƒ๋“ค์ด ๋‹ฌ๋ผ์กŒ๋‚˜ ์‚ดํŽด๋ณด๊ณ , ์‹ค์ œ๋กœ ์†Œ๊ฐœ๋œ 19 ๋ฒ„์ „์˜ ๊ธฐ๋Šฅ๋“ค์„ ์‚ฌ์šฉํ•ด ๋ณด๊ณ ์ž ํ•œ๋‹ค.๐Ÿ‘‡ ๋‹ค๋ฃฌ ์ฃผ์ œ ๋ชฉ์ฐจ๋กœ ์‚ดํŽด๋ณด๊ธฐ๋”๋ณด๊ธฐ1. Asynchoronous transitions: startTransition์— async ํ•จ์ˆ˜๋ฅผ ์ „๋‹ฌํ•˜๊ธฐ2. Actions:  transition์„ ํŠธ๋ฆฌ๊ฑฐ..
๊ฒธ์†ํ•œ ์ž์„ธ์™€ resilience ์˜ค๋Š˜์€ ๊ฐœ๋ฐœ์ด ์•„๋‹Œ ๋‹ค๋ฅธ ์ด์•ผ๊ธฐ์— ๋Œ€ํ•ด ๋‹ค๋ฃฐ ์˜ˆ์ •์ด๋‹ค.๋‚ด ์ƒ๊ฐ๊ณผ ๋Š๋‚Œ์„ ๋ˆ„๊ตฌ๋ผ๋„ ๋ณผ ์ˆ˜ ์žˆ๋Š” ๊ณต๊ฐ„์— ๋‚จ๊ธฐ๋Š” ๊ฒŒ ์–ด์ƒ‰ํ•˜์ง€๋งŒ, ์กฐ๊ธˆ์”ฉ ๋‚ด comfort zone์—์„œ ๋ฒ—์–ด๋‚˜๋Š” ์ผํƒˆ(?)์„ ํ•ด๋ณผ๊นŒ ์‹ถ๋‹ค. ๊ธ€์„ ์ ์œผ๋ฉด์„œ ์ƒ๊ฐ ์ •๋ฆฌ๋„ ํ•  ๊ฒธ, ๋‚˜์ค‘์— ๊ฐ™์€ ์‹ฌ๋ž€ํ•จ์„ ๋Š๊ปด๋„ '๊ทธ๋•Œ๋„ ์ด๋Ÿฐ ๋งˆ์Œ์ด์—ˆ๊ตฌ๋‚˜'ํ•˜๊ณ  ํ„ธ์–ด๋ฒ„๋ฆฌ๊ณ , ๋” ์ข‹์€ ๋ฐฉํ–ฅ์œผ๋กœ ๋‚˜์•„๊ฐ€๊ธฐ ์œ„ํ•ด ๋„์ ์—ฌ ๋ณธ๋‹ค. '๋‚ด๊ฐ€ ์•Œ๊ณ  ์žˆ๋Š” ๊ฒƒ์— ๋Œ€ํ•œ ์˜์‹ฌ'๊ณผ '๋‚ด๊ฐ€ ํ‹€๋ฆด ์ˆ˜๋„ ์žˆ๋‹ค๋Š” ๊ฒธ์†'์˜ ์ฐจ์ด๋ฅผ ๋งŒ๋“œ๋Š” ๊ฒŒ ๋ญ˜๊นŒ. ๋Œ€ํ•™ ์žฌํ•™ ์‹œ์ ˆ ์‹ฌ๋ฆฌํ•™ ์ „๊ณต ์ˆ˜์—… ์ค‘, ํ•œ ํ•™์ƒ์ด ๊ต์ˆ˜๋‹˜๊ป˜ ์–ด๋–ค ์ฃผ์ œ์— ๋Œ€ํ•ด ์—ฌ์ญค๋ดค์—ˆ๋‹ค.๊ต์ˆ˜๋ผ๋Š” ์ง์—… ํŠน์„ฑ์ƒ, ๋ฐ•ํ•™ํ•˜๊ฒŒ ํ•ด๋‹น ์ฃผ์ œ์— ๋Œ€ํ•œ ์„ค๋ช…์„ ํ•ด์ค„ ๊ฑฐ๋ผ๋Š” ๊ธฐ๋Œ€์™€๋Š” ๋‹ฌ๋ฆฌ๋‹น์‹ ๊ป˜์„œ๋Š” ํ•ด๋‹น ๋ถ„์•ผ๊ฐ€ ์ „๋ฌธ์€ ์•„๋‹ˆ๋ผ ์ง์ ‘์ ์ธ ๋Œ€๋‹ต์€ ํ•˜๊ธฐ ์–ด๋ ค์šฐ๋‚˜, ๋‹น์‹ ์˜ ๋ถ„์•ผ์—์„œ๋Š” ์ด๋Ÿฐ ..
[โš›๏ธ react] synthetic event (ft. +17 ๋น„ํฌ&์• ํ”„ํ„ฐ) [์ด์ „ ๊ธ€]2024.08.16 - [๐Ÿ‘ฉ๐Ÿป‍๐Ÿ’ป dev] - [ํ† ์Šค] Transpiler, “์‚ฌ์šฉ”๋ง๊ณ  “ํ™œ์šฉ”ํ•˜๊ธฐ [ํ† ์Šค] Transpiler, “์‚ฌ์šฉ”๋ง๊ณ  “ํ™œ์šฉ”ํ•˜๊ธฐ๐Ÿ—ฃ๏ธ ์ด๋ฒคํŠธ ๋ฒ„๋ธ”๋ง๊ณผ ์บก์ณ๋ง์— ๋Œ€ํ•ด์„œ ์•Œ๊ณ  ๊ณ„์‹œ๋‚˜์š”?๋ชจ๋˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋”ฅ๋‹ค์ด๋ธŒ์—์„œ ๋ดค์—ˆ๋Š”๋ฐ;;๋ฒ„๋ธ”๋ง์€ ๋ฒ„๋ธ” ์ •๋ ฌ์ฒ˜๋Ÿผ bubble up์ด๋ผ๋Š” ๋ง์—์„œ ์œ ์ถ”ํ•  ์ˆ˜ ์žˆ๋“ฏ์ด ์–ด๋–ค ์ด๋ฒคํŠธ๊ฐ€ ์•„๋ž˜์—์„œ ์œ„pyotato-dev.tistory.com์ด๋ฒคํŠธ ์œ„์ž„+ ํŠธ๋žœ์ŠคํŒŒ์ผ๋Ÿฌ๋ฅผ ํ†ตํ•ด์„œ ๋กœ๊น…์„ ์ฝ”๋“œ์— ์ฃผ์ž…ํ•˜๋Š” ํ† ์Šค์˜ ์ด์šฉ ์‚ฌ๋ก€๋ฅผ ์‚ดํŽด๋ดค์—ˆ๋‹ค.์ด๋ฒคํŠธ ๋ฒ„๋ธ”๋ง ๋Œ€์‹  ์บก์ฒ˜๋ฅผ ์‚ฌ์šฉํ•œ ์ด์œ ์— ๋Œ€ํ•œ ์งˆ๋ฌธ์ด ์žˆ์—ˆ๋Š”๋ฐ, ์™œ ๊ทธ๋žฌ์„๊นŒ ๋‚˜๋ฆ„๋Œ€๋กœ ์ด์œ ๋ฅผ ์ฐพ๋‹ค๊ฐ€,๋ฆฌ์•กํŠธ์—์„œ ์ด๋ฒคํŠธ ์ „ํŒŒ ๋ฐฉ์‹์ด dom๊ณผ๋Š” ์‚ด์ง ๋‹ค๋ฅด๋‹ค๋Š” ๊ธ€๋“ค์„ ์ฝ๊ฒŒ ๋˜์–ด ๋” ์ž์„ธํžˆ ํŒŒ๋ณด๊ธฐ๋กœ ํ–ˆ๋‹ค.Legacy reac..
[ํ† ์Šค] Transpiler, “์‚ฌ์šฉ”๋ง๊ณ  “ํ™œ์šฉ”ํ•˜๊ธฐ ๐Ÿ—ฃ๏ธ ์ด๋ฒคํŠธ ๋ฒ„๋ธ”๋ง๊ณผ ์บก์ณ๋ง์— ๋Œ€ํ•ด์„œ ์•Œ๊ณ  ๊ณ„์‹œ๋‚˜์š”?๋ชจ๋˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋”ฅ๋‹ค์ด๋ธŒ์—์„œ ๋ดค์—ˆ๋Š”๋ฐ;;๋ฒ„๋ธ”๋ง์€ ๋ฒ„๋ธ” ์ •๋ ฌ์ฒ˜๋Ÿผ bubble up์ด๋ผ๋Š” ๋ง์—์„œ ์œ ์ถ”ํ•  ์ˆ˜ ์žˆ๋“ฏ์ด ์–ด๋–ค ์ด๋ฒคํŠธ๊ฐ€ ์•„๋ž˜์—์„œ ์œ„๋กœ ์ „์ด๋˜๋Š” ๊ฑฐ๊ณ , ์บก์ณ๋ง์€ ๋ฐ˜๋Œ€๋กœ ์œ„์—์„œ ์•„๋ž˜๋กœ ์ „์ด๋˜๋Š” ๊ฑฐ ์•„๋‹ˆ์—ˆ๋‚˜?๊ฐœ๋…์€ ์–ด๋Š ์ •๋„ ์•Œ๊ณ  ์žˆ์ง€๋งŒ ์‹ค์ œ ์ ์šฉ์„ ํ•˜๋Š” ๊ฒฝ์šฐ๋กœ๋Š” ์—ฐ๊ฒฐ์ด ๋˜์ง€ ์•Š์•˜์—ˆ๋‹ค.์ด๋ฒˆ ๊ธฐํšŒ์— ์‹ค์ œ๋กœ ์บก์ณ๋ง์„ ํ™œ์šฉํ•œ ํ† ์Šค์˜ 'Transpiler, “์‚ฌ์šฉ”๋ง๊ณ  “ํ™œ์šฉ”ํ•˜๊ธฐ'๊ฐ€ ์ข‹์€ ์˜ˆ์‹œ์ธ ๊ฑฐ ๊ฐ™์•„์„œ ์•Œ์•„๋ณด๊ณ ์ž ํ•œ๋‹ค.๋ฒ•์  ์˜์—ญ์„ ์ž˜ ๋ชจ๋ฅด๋Š” ์ž…์žฅ์—์„œ ์‚ฌ์šฉ์ž์˜ ์ผ๊ฑฐ์ˆ˜์ผํˆฌ์กฑ์„ ๋กœ๊น…ํ•˜๋Š” ๊ฑด ๋™์˜ํ•˜์—๋งŒ ๊ฐ€๋Šฅํ•  ๊ฑฐ ๊ฐ™๊ธฐ ๋•Œ๋ฌธ์— ์ ์šฉํ•ด ๋ณผ ๊ธฐํšŒ๊ฐ€ ์žˆ์„์ง€๋Š” ๋ชจ๋ฅด๊ฒ ์ง€๋งŒ, ์‹ค์ œ ์‚ฌ์šฉ ์‚ฌ๋ก€๋ฅผ ์•Œ์•„์•ผ ๊ธฐ์–ต์— ๋” ๋‚จ์„ ๊ฑฐ ๊ฐ™์•„์„œ,  ์–ด๋–ค ์‹์œผ๋กœ ํŠธ๋žœ์ŠคํŒŒ์ผ๋Ÿฌ์™€ ์ด๋ฒคํŠธ ์บก์ณ๋ง..
[spotify-api] VINYLIFY : ์Šคํฌํ‹ฐํŒŒ์ด apiํ™œ์šฉํ•œ ๊ฒ€์ƒ‰ + ์žฌ์ƒ ํ”„๋กœ์ ํŠธ(7) Sentry ์„ค์ • 2024.08.10 - [๐Ÿ‘ฉ๐Ÿป‍๐Ÿ’ป dev] - [spotify-api] VINYLIFY : ์Šคํฌํ‹ฐํŒŒ์ด apiํ™œ์šฉํ•œ ๊ฒ€์ƒ‰ + ์žฌ์ƒ ํ”„๋กœ์ ํŠธ(6)  [spotify-api] VINYLIFY : ์Šคํฌํ‹ฐํŒŒ์ด apiํ™œ์šฉํ•œ ๊ฒ€์ƒ‰ + ์žฌ์ƒ ํ”„๋กœ์ ํŠธ(6)[์ด์ „๊ธ€] 2024.08.09 - [๐Ÿ‘ฉ๐Ÿป‍๐Ÿ’ป dev] - [spotify-api] VINYLIFY : ์Šคํฌํ‹ฐํŒŒ์ด apiํ™œ์šฉํ•œ ๊ฒ€์ƒ‰ + ์žฌ์ƒ ํ”„๋กœ์ ํŠธ(5) react router ์„ค์ • [spotify-api] VINYLIFY : ์Šคํฌํ‹ฐํŒŒ์ด apiํ™œ์šฉํ•œ ๊ฒ€์ƒ‰ + ์žฌ์ƒ ํ”„๋กœ์ ํŠธ(5) react routerpyotato-dev.tistory.comsentry can't fix this ์œ ํŠœ๋ธŒ ๊ด‘๊ณ ๋กœ ์ข…์ข… ๋ดค๋˜ sentry! ์˜ค๋Š˜์€ sentry ์ ์šฉ์— ๋Œ€ํ•ด ์ •๋ฆฌ๋ฅผ ํ•˜..