header-img
Info :
๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ 2
์ปค์Šคํ…€ํ•œ ๋‹ค๊ตญ์–ด ์ฒ˜๋ฆฌ๋ฅผ ์œ„ํ•œ 'i18next' (React-i18next)
2023.11.01
ํšŒ์‚ฌ์˜ ๊ฒฝ์šฐ ์—ฌ๋Ÿฌ ํ•ด์™ธ ๋ฒ•์ธ์ด ์กด์žฌํ•˜๊ณ  ์žˆ์–ด, ๋‹ค๊ตญ์–ด ์ง€์›์ด ํ•„์š”ํ•˜๋‹ค. ์›นํŽ˜์ด์ง€์˜ ๊ฒฝ์šฐ chrome ๋“ฑ ์ธํ„ฐ๋„ท ๋ธŒ๋ผ์šฐ์ € ๋‚ด ๋ฒˆ์—ญ์œผ๋กœ๋„ ์ง€์›์ด ๊ฐ€๋Šฅํ•˜์ง€๋งŒ, ํšŒ์‚ฌ์—์„œ๋Š” ์‚ฌ์ „์ ์œผ๋กœ ๋ฒˆ์—ญํ•˜๊ธฐ ๋ณด๋‹ค๋Š”, ๊ฐ ๋‚˜๋ผ์—์„œ ์ดํ•ดํ•˜๊ธฐ ์‰ฌ์šด ๋‹จ์–ด๋กœ ๋ฒˆ์—ญํ•˜๋Š” ์ผ€์ด์Šค๊ฐ€ ํ•„์š”ํ•˜๊ฒŒ ๋œ๋‹ค. โ€‹ ์ด๋•Œ ์‚ฌ์šฉ๋˜๋Š” ๊ฒƒ์ด i18next. i18next๋ž€? Javascript๋กœ ์ž‘์„ฑ๋œ ๊ตญ์ œํ™” ํ”„๋ ˆ์ž„์›Œํฌ๋กœ ์—ฌ๋Ÿฌ ๊ตญ๊ฐ€์˜ ์–ธ์–ด๋ฅผ ์ฒ˜๋ฆฌํ•  ์ˆ˜ ์žˆ๋„๋ก ๋„์™€์ค€๋‹ค. ๋งŽ์ด ์‚ฌ์šฉํ•˜๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋กœ๋Š” react-i18next, next-i18next, next-translation ์ด๋ ‡๊ฒŒ 3๊ฐ€์ง€. ๊ฐ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์— ์žฅ๋‹จ์ ๊ณผ ํŠน์„ฑ์ด ์กด์žฌํ•˜๋ฏ€๋กœ ์•Œ์•„๋ณด๊ณ  ์ฑ„ํƒํ•˜๋Š” ๊ฒƒ์„ ์ถ”์ฒœํ•œ๋‹ค. โ€‹ ์šฐ๋ฆฌ์˜ ๊ฒฝ์šฐ react-i18next ๋ฅผ ์ฑ„ํƒํ•˜๊ฒŒ ๋˜์—ˆ๋Š”๋ฐ.. ์ •ํ™•ํžˆ๋Š” ์ฑ„ํƒ ๋‹นํ–ˆ๋‹ค. ๊ณ ๋กœ..
list_img
์‰ฌ์šด ์ „์—ญ ์ƒํƒœ ๊ด€๋ฆฌ๋ฅผ ์œ„ํ•œ "Recoil" 2
2023.11.01
ํ˜„์žฌ ํ”„๋กœ์ ํŠธ์˜ ๊ฒฝ์šฐ ๊ถŒํ•œ ๊ด€๋ฆฌ๋ฅผ recoil ๋กœ ๋‹ค๋ฃจ๊ณ  ์žˆ๋‹ค. โ€‹ Rocoil ์ด๋ž€? ํŽ˜์ด์Šค๋ถ์—์„œ ๋ฐœํ‘œํ•œ React ์ „์—ญ ์ƒํƒœ ๊ด€๋ฆฌ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์ด๋‹ค. usestate ๋งŒ์„ ์‚ฌ์šฉํ•˜์—ฌ ์ƒํƒœ ๊ด€๋ฆฌ๋ฅผ ํ•˜๊ฒŒ ๋˜๋ฉด ํ”„๋กœ๊ทธ๋žจ์ด ๋ณต์žกํ•˜๊ฒŒ ๋  ์‹œ, props drilling์ด ์ผ์–ด๋‚˜๊ฒŒ ๋˜๋Š”๋ฐ, Recoil์€ ์ด๋Ÿฌํ•œ ํ–‰์œ„๋ฅผ ๋ฐฉ์ง€ํ•˜๊ฒŒ ํ•ด์ค€๋‹ค. โ€‹ Recoil์˜ ๊ฒฝ์šฐ. React ์—์„œ ์‚ฌ์šฉํ•˜๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๊ฐ€ ์•„๋‹Œ, ์™ธ๋ถ€ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋กœ ์•„๋ž˜์˜ ๋งํฌ์—์„œ ๋‚ด์šฉ์„ ํ™•์ธํ•˜๋ฉด ๋œ๋‹ค. Recoil A state management library for React. recoiljs.org Recoil ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์— ์ฃผ์š”ํ•œ ๊ฐœ๋…์œผ๋กœ๋Š” Atom ๊ณผ selector๊ฐ€ ์žˆ๋‹ค. โ€‹ Recoil ์—์„œ ํ•˜๋‚˜์˜ ์ „์—ญ ์ƒํƒœ๋ฅผ Atom ์ด๋ผ๊ณ  ํ•˜๋Š”๋ฐ, Atom ..