react ์ํ๊ด๋ฆฌ (2) ์ธ๋ค์ผํ ๋ฆฌ์คํธํ [ React / Redux ] Redux ์ํ ๊ด๋ฆฌ ๊ฐ๋ ์ ๋ฆฌ. ๊ธฐ์กด์ ๋ด๊ฐ React ํ๋ก์ ํธ์ ์ฆ๊ฒจ ์ฌ์ฉํ๋ ์ํ ๊ด๋ฆฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ recoil ์ด์๋ค. ํ์ง๋ง ์๋ก์ด ํ์ฌ์์๋ Mobx์ Redux๋ฅผ ์ฌ์ฉํ๊ณ ์์๋ค. ๊ทธ๋์ Redux ๊ณต๋ถ๋ฅผ ์ํด ๊ณต์ ํํ์ด์ง๋ฅผ ๋ณด๋ฉฐ ๊ฐ๋ ์ ๋ฆฌ๋ฅผ ํด๋ณด๋ ค๊ณ ํ๋ค. Redux ๊ธฐ๋ณธ ๊ฐ๋ Redux๋ ์๋ฐ์คํฌ๋ฆฝํธ ์ฑ์ ์ํ ์์ธก ๊ฐ๋ฅํ ์ํ ์ปจํ ์ด๋๋ผ๊ณ ํ๋ค. ์ผ๊ด์ ์ผ๋ก ๋์ํ๊ณ ์๋ก ๋ค๋ฅธ ํ๊ฒฝ (์๋ฒ, ํด๋ผ์ด์ธํธ, ๋ค์ดํฐ๋ธ)์์ ์๋ํ๊ณ , ํ ์คํธ ํ๊ธฐ ์ฌ์ด ์ฑ์ ๋ง๋ค๋๋ก ๋์์ฃผ๋ฉฐ Redux๋ React๋ฟ๋ง์๋๋ผ ๋ค๋ฅธ UI ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ํจ๊ป ์ฌ์ฉํ ์ ์์ผ๋ฉฐ, ๋งค์ฐ ์์ ์ฉ๋(์์กด ๋ผ์ด๋ธ๋ฌ๋ฆฌ ํฌํจ 2KB)์ผ๋ก ์ฌ๋ฌ ๊ธฐ๋ฅ๋ค์ ํธ๋ฆฌํ๊ฒ ์ฌ์ฉํ ์ ์๋ค. Redux๋ ์๋ฐ์คํฌ๋ฆฝํธ SPA์์ ๊ฐ์ถ์ด์ผ ํ ์๊ฑด๋ค์ด ์ ์ ๋ณต์กํด์ง์ ๋ฐ๋ผ ๋ง์.. [ React / Recoil ] React์ ์ํ๊ด๋ฆฌ ๋ผ์ด๋ธ๋ฌ๋ฆฌ Recoil์ effects ์ฌ์ฉํ๊ธฐ. ๋๋ ๋ณดํต react ํ๋ก์ ํธ๋ฅผ ํ๊ฒ ๋๋ฉด ๊ฐ๋จํ ์ํ ๊ด๋ฆฌ๋ค์ ๋๋ถ๋ถ recoil์ ํตํด ํ๋๋ฐ ์ด๋ฒ์ recoil์ ๋ถ๊ฐ์ ์ธ ๊ธฐ๋ฅ๋ค์ ๋ํด ๋ ์์น๋ฅผ ํ๋ค๊ฐ Atom Effects์ ๋ํด ์์๋ณด๊ฒ ๋์๋ค. Recoil ๊ณต์ ํ์ด์ง์ Atom Effects ์ค๋ช ์ ์๋ ๋งํฌ๋ฅผ ํตํด ์ฐธ๊ณ ํ๋ฉด ๋๋ค. atom effects - recoil recoil ๊ณต์ ํ์ด์ง์์ ์๊ฐํ๋ atom effects๋ ๋ถ์ํจ๊ณผ๋ค์ ๊ด๋ฆฌํ๊ณ Recoil์ atom์ ์ด๊ธฐํํ๊ฑฐ๋ ๋๊ธฐํํ๊ธฐ ์ํด ์ฌ์ฉํ๋ API๋ผ๊ณ ์ค๋ช ํ๋ค. Atom Effects - ์ํ ์ง์์ฑ - ์ํ ๋๊ธฐํ - ํ์คํ ๋ฆฌ ๊ด๋ฆฌ - ๋ก๊น ๋ฑ์ ์ ์ฉํ๊ณ React Effects์๋ ์ ์ฌํ์ง๋ง Atom Effects๋ atom์ ์ ์ํ ๋ atom ์ ์์ ์ผ๋ถ๋ก.. ์ด์ 1 ๋ค์