Transparent White Star

๐Ÿ› ๏ธ ํ”„๋กœ์ ํŠธ/[Taskify] - ํ˜‘์—… ํˆด(์ผ์ • ๊ด€๋ฆฌ ์‹œ์Šคํ…œ)

Zustand์™€ ์ฟ ํ‚ค๋ฅผ ํ™œ์šฉํ•œ ์•ˆ์ „ํ•œ ๋กœ๊ทธ์ธ ์ƒํƒœ ๊ด€๋ฆฌโ˜„๏ธ ๋ฌธ์ œ์ : ์ƒˆ๋กœ ๊ณ ์นจ ์‹œ ๋กœ๊ทธ์ธ ์ƒํƒœ ์œ ์ง€ ์•ˆ๋จํ˜„์žฌ ๋กœ๊ทธ์ธ ํ›„ ๋ฐ›์€ ์‚ฌ์šฉ์ž ์ •๋ณด๋ฅผ Zustand์˜ userStore์— ์ €์žฅํ•˜์—ฌ ์ƒํƒœ๋ฅผ ๊ด€๋ฆฌํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.ํ•˜์ง€๋งŒ ์ƒˆ๋กœ ๊ณ ์นจ ์‹œ ์ƒํƒœ๊ฐ€ ์ดˆ๊ธฐํ™”๋˜์–ด ๋กœ๊ทธ์ธ ์ƒํƒœ๊ฐ€ ์œ ์ง€๋˜์ง€ ์•Š๋Š” ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค.ํ† ํฐ์ด๋‚˜ ์‚ฌ์šฉ์ž ์ •๋ณด๋ฅผ ๋กœ์ปฌ ์Šคํ† ๋ฆฌ์ง€๋‚˜ ์„ธ์…˜ ์Šคํ† ๋ฆฌ์ง€์— ์ €์žฅํ•˜๋Š” ๊ฒƒ์ด ํ•„์š”ํ• ์ง€ ๊ณ ๋ฏผ์ด ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๐Ÿš€ ๊ณ ๋ฏผ๋กœ๊ทธ์ธ ์ƒํƒœ ์œ ์ง€๋ฅผ ์œ„ํ•ด ์–ด๋–ค ์ €์žฅ ๋ฐฉ์‹์ด ๊ฐ€์žฅ ์ ํ•ฉํ• ๊นŒ?zustand๋ฅผ ์‚ฌ์šฉํ•  ๋•Œ ๋กœ์ปฌ ์Šคํ† ๋ฆฌ์ง€๋‚˜ ์„ธ์…˜ ์Šคํ† ๋ฆฌ์ง€๋ฅผ ์ถ”๊ฐ€๋กœ ํ™œ์šฉํ•ด์•ผ ํ• ๊นŒ, ์•„๋‹ˆ๋ฉด ๋‹ค๋ฅธ ๋ฐฉ๋ฒ•์„ ๊ณ ๋ คํ•ด์•ผ ํ• ๊นŒ?์ฟ ํ‚ค๋ฅผ ์‚ฌ์šฉํ•œ๋‹ค๋ฉด ์–ด๋–ป๊ฒŒ ์•ˆ์ „ํ•˜๊ฒŒ ํ† ํฐ์„ ์ €์žฅํ•˜๊ณ  ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์„๊นŒ? ์ƒํƒœ ๊ด€๋ฆฌ์˜ ๊ธฐ๋ณธ ๋ฌธ์ œโ˜๐Ÿป ์—ฌ๊ธฐ์„œ ์ž ๊นzustand๋Š” ๋ฉ”๋ชจ๋ฆฌ ์ƒ..
์šฐ์„  ,Taskify ํ”„๋กœ์ ํŠธ๋ฅผ ๊ฐœ๋ฐœํ•˜๋ฉด์„œ, ์—๋Ÿฌ ์ฒ˜๋ฆฌ ๋กœ์ง์ด ์—ฌ๋Ÿฌ ์ปดํฌ๋„ŒํŠธ์— ๋ถ„์‚ฐ๋˜์–ด ์žˆ์Œ์„ ์•Œ๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๊ฐ ์ปดํฌ๋„ŒํŠธ์—์„œ ์ค‘๋ณต๋œ ๋ฐฉ์‹์œผ๋กœ ์—๋Ÿฌ๋ฅผ ์ฒ˜๋ฆฌํ•˜๊ณ , ์—๋Ÿฌ ๋ฉ”์‹œ์ง€๋ฅผ ํ‘œ์‹œํ•˜๋Š” ๋ฐฉ๋ฒ•์ด ์ผ๊ด€๋˜์ง€ ์•Š์•„ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์ด ์ €ํ•˜๋˜๋Š” ๋ฌธ์ œ๋ฅผ ๊ฒช์—ˆ์Šต๋‹ˆ๋‹ค. ๐Ÿ˜ž ์ด ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด, useErrorModal์ด๋ผ๋Š” ์ปค์Šคํ…€ ํ›…์„ ๋งŒ๋“ค์–ด ์ „์—ญ์ ์œผ๋กœ ์ผ๊ด€๋œ ์—๋Ÿฌ ์ฒ˜๋ฆฌ ๋ฐฉ์‹์„ ๊ตฌํ˜„ํ–ˆ์Šต๋‹ˆ๋‹ค.์ด๋ฅผ ํ†ตํ•ด ์—๋Ÿฌ ์ฒ˜๋ฆฌ ๋กœ์ง์„ ํ†ตํ•ฉํ•˜๊ณ , ์‚ฌ์šฉ์ž์—๊ฒŒ ์„œ๋ฒ„์—์„œ ๋ฐœ์ƒํ•œ ์—๋Ÿฌ ๋ฉ”์‹œ์ง€๋ฅผ ๋ช…ํ™•ํ•˜๊ฒŒ ์ „๋‹ฌํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.  โ˜„๏ธ ๋ฌธ์ œ ์ƒํ™ฉ - ์—๋Ÿฌ ์ฒ˜๋ฆฌ ๋กœ์ง์˜ ์ค‘๋ณต๊ณผ ์ผ๊ด€์„ฑ ๋ถ€์กฑํ”„๋กœ์ ํŠธ ์ดˆ๊ธฐ์—๋Š” ๊ฐ๊ฐ์˜ ์ปดํฌ๋„ŒํŠธ์—์„œ ์—๋Ÿฌ๋ฅผ ๊ฐœ๋ณ„์ ์œผ๋กœ ์ฒ˜๋ฆฌํ•˜๊ณ  ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค.์˜ˆ๋ฅผ ๋“ค์–ด, API ์š”์ฒญ ์‹คํŒจ ์‹œ ๋ฐœ์ƒํ•˜๋Š” ์—๋Ÿฌ๋‚˜ ์‚ฌ์šฉ์ž ์ž…๋ ฅ์—์„œ ๋ฐœ์ƒํ•˜๋Š” ์—๋Ÿฌ๋ฅผ..
Zustand๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๋กœ๊ทธ์ธ ์ƒํƒœ์™€ ์œ ์ € ์ •๋ณด๋ฅผ ํšจ์œจ์ ์œผ๋กœ ๊ด€๋ฆฌํ•˜๋ ค๋Š” ๊ณ ๋ฏผTaskify ํ”„๋กœ์ ํŠธ๋ฅผ ๊ฐœ๋ฐœํ•˜๋ฉด์„œ, ์—ฌ๋Ÿฌ ์ปดํฌ๋„ŒํŠธ์—์„œ ์‚ฌ์šฉ๋˜๋Š” ์ธ์ฆ ์ƒํƒœ ๊ด€๋ฆฌ๊ฐ€ ์ ์  ๋ณต์žกํ•ด์ง€๋ฉฐ ์ฝ”๋“œ๊ฐ€ ์ค‘๋ณต๋˜๋Š” ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•˜์˜€์Šต๋‹ˆ๋‹ค.์ธ์ฆ ์ƒํƒœ๋ฅผ ๊ด€๋ฆฌํ•˜๋Š” ์ฝ”๋“œ๊ฐ€ ๊ฐ ์ปดํฌ๋„ŒํŠธ์— ๋ถ„์‚ฐ๋˜์–ด ์žˆ์–ด ์œ ์ง€๋ณด์ˆ˜๊ฐ€ ์–ด๋ ค์›Œ์ง€๊ณ , ์ธ์ฆ ๊ด€๋ จ ๋กœ์ง์„ ์ˆ˜์ •ํ•  ๋•Œ๋งˆ๋‹ค ์—ฌ๋Ÿฌ ๊ณณ์„ ์ˆ˜์ •ํ•ด์•ผ ํ•˜๋Š” ๋ฒˆ๊ฑฐ๋กœ์›€์ด ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค. ์ด ๋ฌธ์ œ ํ•ด๊ฒฐ์„ ์œ„ํ•ด์„œ Zustand๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ธ์ฆ ์ƒํƒœ๋ฅผ ์ „์—ญ์ ์œผ๋กœ ๊ด€๋ฆฌ, ์ธ์ฆ ๊ด€๋ จ ๋กœ์ง์„ authStore ๋ผ๋Š” ๋ณ„๋„์˜ ์ƒํƒœ ๊ด€๋ฆฌ๋กœ ๋ถ„๋ฆฌํ•˜์—ฌ ์žฌ์‚ฌ์šฉ ๊ฐ€๋Šฅํ•˜๊ณ  ํšจ์œจ์ ์ธ ๋ฐฉ์‹์œผ๋กœ ๊ฐœ์„ ํ•˜์˜€์Šต๋‹ˆ๋‹ค. ์ด๋ฒˆ ํฌ์ŠคํŒ…์—์„œ๋Š” ์ด ๊ณผ์ •์„ ๊ณต์œ ํ•˜๋ฉฐ, Zustand๋ฅผ ์ด์šฉํ•œ ์ธ์ฆ ์ƒํƒœ ๊ด€๋ฆฌ ๋ฐฉ๋ฒ•๊ณผ ์ฝ”๋“œ ์ค‘๋ณต์„ ์ค„์ผ ์ˆ˜ ์žˆ์—ˆ๋˜ ๊ฒฝํ—˜์— ๋Œ€ํ•ด์„œ ์ž‘์„ฑํ•ด๋ณด๊ฒ ์Šต..
์งœ์ž” ๐ŸŽ‰โ–ผ Lighthouse Performance ๋ถ„์„ [web] Lighthouse ์›นํŽ˜์ด์ง€ ์„ฑ๋Šฅ๋ถ„์„ (Performance)ํ—ˆ๊ฒ์ง€๊ฒ ์ฝ”๋“œ๋ฅผ ์ž‘์„ฑํ•˜๊ณ  ์ผ์ •์— ์ซ“๊ฒจ ๋””์ž์ธ์„ ๋”ฐ๋ผํ•˜๊ธฐ์— ๊ธ‰๊ธ‰ํ•ด ์„ฑ๋Šฅ๋”ฐ์œ„ ๋ฌด์‹œํ–ˆ๋˜ ์‹ ์ž… 1๋…„.. ์ตœ๊ทผ ๊ฐœ๋ฐœ์— ๋งŽ์ด ์ต์ˆ™ํ•ด์ง€๋ฉด์„œ ์„ฑ๋Šฅ ๋ฐ ์ตœ์ ํ™”์— ํฅ๋ฏธ๊ฐ€ ์ƒ๊ฒผ์Šต๋‹ˆ๋‹ค. ๊ทธ์ค‘ ์ œ์ผ ์‰ฝ๊ฒŒ ์‚ฌ์šฉํ• phrygia.github.io ๐Ÿ•Š๏ธ ๋งˆ๋ฌด๋ฆฌ : 2์ฃผ๊ฐ„์˜ ์ค‘๊ธ‰ ํ”„๋กœ์ ํŠธ ํšŒ๊ณ Taskify ํ”„๋กœ์ ํŠธ๋ฅผ ์‹œ์ž‘ํ•œ ์ง€ ์–ผ๋งˆ ์•ˆ ๋œ ๊ฒƒ ๊ฐ™์€๋ฐ, ๋ฒŒ์จ 2์ฃผ๊ฐ„์˜ ์—ฌ์ •์ด ๋งˆ๋ฌด๋ฆฌ๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๐ŸŽ‰ํ”„๋กœ์ ํŠธ ๋ฐœํ‘œ๋„ ๋ฌด์‚ฌํžˆ ๋๋ƒˆ๊ณ , ์ง€๊ธˆ์€ ํ”„๋กœ์ ํŠธ๊ฐ€ ์™„๋ฃŒ๋œ ํ›„ ์ตœ์ข… ํšŒ๊ณ  ํฌ์ŠคํŒ…์„ ํ•˜๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ๐Ÿ˜Š์ด๋ฒˆ ํ”„๋กœ์ ํŠธ๋ฅผ ํ†ตํ•ด ๋งŽ์€ ๊ฒƒ์„ ๋ฐฐ์šฐ๊ณ , ํŒ€์›๋“ค๊ณผ ํ•จ๊ป˜ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•ด๊ฐ€๋ฉฐ ์„ฑ์žฅํ•  ์ˆ˜ ์žˆ์—ˆ๋˜ ์‹œ๊ฐ„์ด์—ˆ์–ด์š”. ๊ทธ๋Ÿผ Ta..
๐Ÿ‚ 10์›” ์ค‘์ˆœ, ํŒ€ ํ”„๋กœ์ ํŠธ ์ฒซ๋‚  ๊ธฐ๋ก - ์‹œ์ž‘์˜ค๋Š˜์€ ์ค‘๊ธ‰ ํ”„๋กœ์ ํŠธ์˜ ์ฒซ๋‚ ์ด๋‹ค. ๋“œ๋””์–ด Part 3 ํŒ€์›๋“ค๊ณผ ํ•จ๊ป˜ ํ”„๋กœ์ ํŠธ๋ฅผ ์‹œ์ž‘ํ•˜๊ฒŒ ๋˜์—ˆ๋Š”๋ฐ, ์šฐ๋ฆฌํŒ€์€ ์ฒซ ํšŒ์˜๋ฅผ ํ†ตํ•ด ํ˜‘์—… ํˆด๋กœ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋Š” ์ผ์ • ๊ด€๋ฆฌ ์‹œ์Šคํ…œ “Taskify”๋ผ๋Š” ์ฃผ์ œ๋ฅผ ์„ ์ •ํ•˜๊ฒŒ ๋˜์—ˆ๋‹ค. ๐Ÿ’ก ์ฃผ์ œ ์„ ์ • ์ด์œ Taskify๋ฅผ ์ฃผ์ œ๋กœ ๊ณ ๋ฅธ ์ด์œ ๋Š” ์•„์ฃผ ๊ฐ„๋‹จํ•˜๋‹ค ใ…Žใ…Ž! ์ผ์ • ๊ด€๋ฆฌ ์‹œ์Šคํ…œ์€ ์ผ์ƒ์—์„œ ์ž์ฃผ ์‚ฌ์šฉ๋˜๋Š” ์„œ๋น„์Šค์ธ ๋งŒํผ, ์‚ฌ์šฉ์ž์˜ ํŽธ์˜๋ฅผ ๊ณ ๋ คํ•œ ์—ฌ๋Ÿฌ ๊ธฐ๋Šฅ์„ ๊ตฌํ˜„ํ•ด๋ณผ ์ˆ˜ ์žˆ์„ ๊ฒƒ ๊ฐ™์•˜๋‹ค. ๊ฒŒ๋‹ค๊ฐ€ ํ”„๋กœ์ ํŠธ์˜ ๊ทœ๋ชจ๊ฐ€ ์ปค์„œ ๋‹ค์–‘ํ•œ ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋งŒ๋“ค์–ด๋ณด๋Š” ์ข‹์€ ๊ธฐํšŒ๋ผ๊ณ  ์ƒ๊ฐํ–ˆ๋‹ค. ํŒ€์›๋“ค๋„ ๋ชจ๋‘ ๋™์˜ํ•ด์ฃผ์–ด ๊ธฐ๋ถ„ ์ข‹๊ฒŒ ํ”„๋กœ์ ํŠธ๋ฅผ ์‹œ์ž‘ํ•  ์ˆ˜ ์žˆ์—ˆ๋‹ค. ๐Ÿ˜Š ๐Ÿ› ๏ธ ํ”„๋กœ์ ํŠธ ์„ธํŒ… ๊ณผ์ •์ฒซ๊ฑธ์Œ์œผ๋กœ, ๊นƒํ—ˆ๋ธŒ์— ํ”„๋กœ์ ํŠธ ๋ ˆํฌ์ง€ํ† ๋ฆฌ๋ฅผ ๋งŒ๋“ค๊ณ  ํŒ€์›๋“ค์„ ์ดˆ๋Œ€ํ–ˆ..
yyezzzy
'๐Ÿ› ๏ธ ํ”„๋กœ์ ํŠธ/[Taskify] - ํ˜‘์—… ํˆด(์ผ์ • ๊ด€๋ฆฌ ์‹œ์Šคํ…œ)' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๊ธ€ ๋ชฉ๋ก