์
์ฌ๊ณผ์ ๋ฅผ ๋ฐ๋ค..! ์ง์ธ ์ถ์ฒ์ ํตํด ์์ ์คํํธ์
์์ Next.js์ ts๋ก ๊ฐ๋ฐํ๋ ์ง๋ฌด์ ์ฑ์ฉ๋ ๊ธฐํ๋ฅผ ์ป์์๋ค. ์ฐ๋ฝํ์ง ์ผ๋ง ๋์ง ์์ ์
์ฌ๊ณผ์ ๋ฅผ ๋ฐ๊ฒ ๋์๋ค ์ผ์ ํค์ฐ๋ค ์
์ฌ๊ณผ์ ๋ ํฌํธํด๋ฆฌ์ค๋ฅผ ๋ง๋๋ ๊ฒ์ด์๋๋ฐ ๊ฐ๋จํ ๊ณผ์ ์ด์ง๋ง ๋์์ธ ์์์ด ์ฃผ์ด์ง์ง ์๊ณ ํ๊ฐํญ๋ชฉ์๋ ์ฐฝ์์ฑ์ ๊ฐ์กฐํ๊ธฐ ๋๋ฌธ์ ๋์ถฉ ๋ง๋ค๋ค๊ฐ๋ ๋์ ๋์ง ์์ ๊ฒ ๊ฐ์๋ค. ๊ทธ๋์ ๋ด ๋๋ฆ๋๋ก ๊ณผ์ ์ ์ค์ผ์ผ์ ํค์์ ์งํํ๋ค. ๊ณผ์ ๋ฅผ ์งํํ๋ฉฐ ์ฒ์ ์จ๋ณด๋ ๊ธฐ์ ๋ค์ (graphql, supabase)๋ฅผ ์ ์ฉํ๋ฉฐ ๊ณผ์ ๋ฅผ ๋ง๋๋ ์ค์ ์ผ์ฃผ์ผ๋ก๋ ๋ฌด๋ฆฌ์ผ ๊ฒ์ด๋ผ๋ ์๊ฐ์ด ๋ค์๋ค. ๋ ํ์ฌ ์คํ๋ฆฐํธ๋ผ๋ ๋ถํธ์บ ํ์ ์ฐธ์ฌํ๊ณ ์๊ณ ํ์ฌ์ ๋ถํธ์บ ํ์ ๋ณํ์ ํ๋ค๊ธฐ ๋๋ฌธ์ ๊ณผ์ ๋ฅผ ์ํํ๋ ์ฃผ๋ง๋์ ์ ๋ง ๋ง์ ๊ณ ๋ฏผ์ ํ๋ค. ์์ง ์ค๊ธ ํ๋ก์ ํธ์ ์ฌ..
ํ๊ณ
์ง๊ธ๊น์ง์ ๋๋ ์๋ฌด ์๊ฐ์์ด ์ฝ๋ฉ์ ํด์๋ค. ์ด์ ๊ป ๋๋ ์๋ฌด ์๊ฐ์์ด ์ฝ๋ฉ์ ํด์๋ค. ๋ณต์กํ๊ฒ ์ฝ๋ฉํ๋ ๊ฑธ ์ซ์ดํด์ ์ต๋ํ ๋ด๊ฐ ๋ณด๊ธฐ์ ์ง๊ด์ ์ผ๋ก ์ฝ๋ฉ์ ํ ๋ค์์ ๋ฆฌํฉํ ๋ง์ ์ ๋ง ๊ฐ๋ ์ค๋ฒ๋ ธ๋ค. ํ์ง๋ง ์ด๋ฌํ ์ต๊ด ํ์ ์์ฆ์ ์ฑ์ฅํ๋ ๋๋์ด ๋ค์ง ์์๋ ๊ฒ ๊ฐ๋ค. ์ค๋ ์ฝ๋์ ํํธ3 ๋ฉํ ๋ง ์๊ฐ์ ๋ค๋ฅธ ๋ถ๋ค์ ์์ ๋ค์ด ์ฝ๋๋ฅผ ์งค ๋ ๊ฒช์๋ ๊ฒฝํ์ ๋งํ์ง๋ง ๋๋ "์ต๋ํ ๋จ์ํ๊ฒ ์ฝ๋๋ฅผ ์ง๊ณ ๋ฆฌํฉํ ๋ง๋ ํ์ง ์์ ์ด๋ฅผ ๊ณ ์ณ์ผ ํ๋ค" ๋ผ๋ ๋ง ๋ฟ์ด์๋ค. ์ฌ์ค ์ด์ ๊น์ง๋ ๊ฐ์ ๋ฃ๊ธฐ์๋ง ์ง์คํ์ฌ ๋ญ๊ฐ๋ฅผ ๋ง๋ค์ด ๋ณธ ๊ฒฝํ์ด ์ ๋ง ์ ๋ฌดํ๋ค ๊ทธ๋์ ์ฝ๋๋ฅผ ๋ง์ด ์ง๋ณด์ง ์์๋ค.. ์์งํ! (๊ทธ๋์ ์ด๋ฐ ๊ณ ๋ฏผ์ ํ๋๊ฒ ๋น์ฐํ๋ค๊ณ ์๊ฐํ๋ค) ์์ผ๋ก๋ *๋ง์ด* ๋ง๋ค๊ณ ๋ค๋ฅธ ์ข์ ์ฝ๋๋ฅผ *๋ง์ด* ์ฐธ๊ณ ํ์ ์ด์ ๋ ๋จ์ ๊ตฌ..
๊ทธ๋์ ์ก์๊ฐ์ด ๋๋ฌด ๋ง์๋ค. ํ ๋ฒ ์ ํ์ผ๋ฉด ์ฐ์งํ๊ฒ ๋์๊ฐ์ผ ํ๋๋ฐ ๋๋ ๋ญ ์ด๋ฆฌ ์ฌ๋๊ฒ ๋ง์๊น.. ์ฐ์ ๋ถ๋จํ ์ฑ๊ฒฉ์ ๊ณ ์น๊ณ ์ถ์ง๋ง ๊ทธ๋ ๊ฒ ์ฝ์ง ์๋ค. ๋ด ์์ ๋ถ์์ ๋ค์ค๋ฆฌ๋ ๋ฐฉ๋ฒ์ ๋ฐฐ์์ผ ๊ฒ ๋ค. ๋ง๋กํ๋ฉด ๋ญ ๋ชปํ ๊น.. ๋น์ฅ ์คํ์ ์ฎ๊ฒจ์ผ ๊ฒ ๋ค. ๋งค์ผ ์์นจ๋ง๋ค ์ผ์ด๋์ ๊ณํ์ ์ธ์ฐ๋ฉด์ ๋ด๊ฐ ๊ฐ๋ฐ์์ ๊ธธ์ ์ ํํ๋์ง ๋ค์ํ๋ฒ ์๊ธฐํ๊ณ ๋ง์์ ๋ค ์ก์์ผ ๊ฒ ๋ค. ํ์คํ ๊ฑด ๋๋ ๋ฌด์๋ณด๋ค ์ฝ๋ฉ์ ์ข์ํ๋ค. ์ฑ์ฅ์ ์ ํดํ๋ ์์๋ ๊ณผ๊ฐํ ๋ฒ๋ฆฌ๊ณ ์ฑ์ฅ์ ๊ธธ์ ๋๋ชจํ๋ ๊ฒ์ด ํ๋ช
ํ๋ค๊ณ ์๊ฐํ๋ค. ์์๋ 3ํ๋
2ํ๊ธฐ ๊ณผ๋ชฉ ์์ฒด๊ฐ ๊ทธ๋ ๊ฒ ์ด๋ ค์ด ๊ฑด ์์ง๋ง ๋ ์ฌ์ด ๊ฑด ์๋ค. ๋ณดํต ํ ๋ฒ ๋ค์ด์๋ ์ดํด๋ ๋ชปํ๊ณ ๋ ์ธ๋ฒ์ ๋ค์ด์ผ ์ดํดํ๋ ๊ฒ ๊ฐ๋ค ใ
ใ
ใ
ใ
์ด๊ฑด ๋ญ ๋๋ง ๊ทธ๋ฐ๊ฑด ์๋๋๊น ๋๊ธฐ๊ณ .. Next.js ,..
1. ๋ฆฌ์กํธ์ ์ฌ์ฉ์ด์ ์ ๋ํด์๋ ๋ชจ๋ฅธ๋ค๊ณ ํ์
จ๋ค. 2. ๋ฆฌ์กํธ๋ฅผ ์ฌ์ฉํ๋ ์ด์ ๊ฐ ๋จ์ง ์ทจ์
์์ฅ์ ํ์ด๊ฐ ์ปค์๋ผ๊ณ ํ์
จ๋ค. 3. recoil ์ฌ์ฉํ๋ค๊ฐ redux ์ฌ์ฉํ๋ฉด ์ข์ ๊ฑฐ๋ผ๊ณ ํ์
จ๋ค. 4. Top down ๋ฐฉ์์ผ๋ก ๊ณต๋ถ๋ฅผ ์ฃผ๋ก ํ์
จ๋ค๊ณ ํ๋ค. -> ๋์๊ฒ ์ ์ผ ๋์์ด ๋ ์กฐ์ธ ๋ด๊ฐ ์ดํ์ ํ๋ก์ ํธ๋ฅผ ๋ง๋ค๋ฉด ์ด๋ ต๊ณ ์ด๋ฐ ์์ผ๋ก ํด๋ ๋๋๊ฑด์ง ์๋ฌธ์ด ์๊ธด๋ค๊ณ ๋งํ์ ๋
ธ๋ง๋์ฝ๋๋ฅผ ์ถ์ฒํด์ฃผ์
จ๊ณ ๋
ธ๋ง๋ ์ฝ๋์ ๊ฐ์๋ฅผ ์๊ฐ ํ ๋ฐ๋ผ ๋ง๋ค๋ค๋ณด๋ฉด ์ฌ๋ฌ ์๋ฌ๋ ๋ง๋ ๊ฒ์ด๊ณ ๊ทธ๋ฌ๋ค๋ณด๋ฉด ์์ฐ์ค๋ ์ค๋ ฅ์ด ๋ ๊ฒ์ด๋ผ๊ณ ํ์
จ๋ค. ๋งค์ฐ ๊ณ ๋ง์ ๋ค. ์์ผ๋ก๋ ๋ธ๋ก๊ทธ ํฌ์คํ
์ ๋ง์ด ํ ๊ฒ์ธ๋ฐ ์๋ฅผ๋ค์ด ๋ด์ผ axios๋ฅผ ๋ฐฐ์ ๋ค๊ณ ํ๋ฉด axios ์ฌ์ฉ๋ฒ์ ๋ํด ๊ฐ๋ตํ๊ฒ ํฌ์คํ
์ ํ ๊ฒ์ด๋ค. ํ๋ก์ ํธ๋ฅผ ๋ง๋ค๋ฉด์ ์๊ธด ๊ฟํ์ด๋ ์๋ฌ๋ค..
[๋ฌธ์ ์ - ๊ฐ์ ์ ] JS๊ฒ์ ๋ง๋๋ ๊ฒ์ ์ฐฉ์คํ ํ์์ง๋ง ๋ฆฌ์กํธ์ ๋ํ ๊ณต๋ถ๊ฐ ๋ง์ด ๋ถ์กฑํ๋ ํ ์ฃผ์๋ค. ๋ JS๋ฌธ๋ฒ๋ ๊ธฐ๋๋งํผ ๊ฒฐ๊ณผ๋ฅผ ๋ด์ง ๋ชปํ๋ค. [์ด๋ป๊ฒ ํ ๊น?] ๊ทธ๋์ ์์ผ๋ก๋ ๋ฆฌ์กํธ ๊ณต๋ถ์ ๋น์ค์ ๋ง์ด ๋๋ ค๋ ๋ฌด๋ฆฌ๊ฐ ์๊ฒ ๋ค ์ถ์ด ๊ทธ๋ ๊ฒ ํ ์์ ์ด๋ค. ๋ ๋ฆฌ์กํธ๋ JS ๋ฐฐ์ด๊ฒ์ ํ์ ํ๋ค๊ณ ํ ์ง๋ผ๋ ๋ธ๋ก๊ทธ์ ํฌ์คํ
ํ์. 1์ฃผ์ผ์ 1๋ฆฌ์กํธ 1JS ํฌ์คํ
์ ๋ชฉํ๋ก ํ์.