NEWใปLEใปKA(๋ด๋ ์นด) โก๏ธ https://newleka.vercel.app
๐ฌ ์์ ๋ฐ ๊ณ๊ธฐ
์์์ ์ง์งํ๊ฒ ๊ถ์์ฒด๋ก ์์ฑํด๋ณด๊ฒ ๋ค.
์ฝ ๋ฐ๋
์ ์ฏค ์์ํ ์ฌ์ด๋ ํ๋ก์ ํธ๊ฐ ์๋ค. (ํน๋ณํ ์ผ์ด ์์ผ๋ฏ๋ก ๊ฑฐ์ ๋ฉ์ธ์ธ)
๋ญ๊ฐ๋ฅผ ๋ง๋ค์ด ๋ณด๊ณ ์ถ์๋ฐ ํด๋ก ์ฝ๋ฉํ๋ ๊ฑด ์ง๊ฒน๊ณ ... ๋ด๊ฐ ์ง์ ์๋น์ค๋ฅผ ์ด์ํด๋ณด๊ณ ์ถ์ ๊ฒ๋ ์๊ณ , ์ง์ ๋ง๋ค๋ฉด ๋ญ๊ฐ๋ฅผ ๋ ๋ง์ด ๋ฐฐ์ฐ์ง ์์๊น ํ๋ ์๊ฐ์ผ๋ก ์ด๋ฐ์ ๋ฐ ์๊ฐ์ ํ๋ค๊ฐ ๋ ์ค๋ฅธ ์์ด๋์ด์๋ ๊ฒ ๊ฐ๋ค. ํ์์ ๋ด์ค๋ ํฐ ๋ณด๋ ๊ฑธ ๊ฝค ์ข์ํ๋ค. ๋ง์ ๋ด์ค๋ ํฐ๋ฅผ ๊ตฌ๋
ํ๋ ๊ฑด ์๋์ง๋ง ํฌํธ ์ฌ์ดํธ์ ๋์๋ค๋๋ฉด์ ๋ณด๊ฒ ๋๋ ์ ๋ณด๋ค๊ณผ ๋ค๋ฅด๊ฒ ๋๊ตฐ๊ฐ ์ ์ฑ์ ๋ค์ฌ ๋ชจ์๋์๊ฑฐ๋ ์ ๋ฆฌํ ๋๋ ๋ง๋ ๋ฐ์ดํฐ๋ผ ๊ทธ๋ฐ์ง ์งง์ ์๊ฐ์๋ ๋ง์ ์ ๋ณด๋ฅผ ์ป์ ์ ์๊ณ ์์ง์ ์ ๋ณด๋ค์ด ๋ง์๋ค. ์ฌ๋ฌ ๋ถ์ผ์ ์์๋ค๋ ๋ค์ ์ ์๊ณ ๋ง์ด๋ค. ๊ทธ๋์ ์ฐพ์๋ณด๋ ๋ด์ค๋ ํฐ๊ฐ ์ง์ง ์์ฒญ๋๊ฒ ๋ง์๋ค. ๋ด๊ฐ ๊ตฌ๋
ํ๊ณ ์๋ ๊ฑด ์กฐ์กฑ์งํ์ด์๋ค. ์ด๊ฑธ ํ๋ฒ ๋ชจ์๋ณด์๋ผ๋ ์๊ฐ์ด ๋ค์๊ณ ์ง์ ์๋ ๋์์ด๋(๋์)์๊ฒ ๋์์ธ์ ๋ถํํ๋ค. ๋์์ธ์ ๋๋ฌด ์ ์ฑ ๋ค์ฌ์ ํด์ฃผ๋ ์ฃฝ์ด ๋๋ ๋ฐฅ์ด ๋๋ ๋ญ๋ ๋ง๋ค์ด์ผ ํ ๊ฒ ๊ฐ์๋ค. ๊ทธ๋์ ๋ง๋ค๊ธฐ ์์ํ๋ค.
๐ป ์งํ
Next.js + Strapi ์กฐํฉ์ผ๋ก ์งํํ๋ค. ์ฒ์๋ถํฐ ์ด๋ ๊ฒ ์์ํ ๊ฑด ์๋๊ณ Next.js๋ ๋ญ๊ฐ ๋นจ๋ผ ๋ณด์ฌ์ ๋ React๋ ์จ๋ณด๊ณ ์ถ์ ๋ง์์ ์ ํํ๊ณ , Strapi๋ ์ฒ์๋ถํฐ ์ฌ์ฉํ์ง๋ ์์๋ค. ์ฒ์์๋ Github์ json ํ์ผ ์ฌ๋ ค์ gh-pages๋ก ํธ์คํ
ํ๊ณ ๋ฐ์ดํฐ๋ฅผ ๊ฐ์ ธ์๋๋ฐ ์ ์ ์งํํ ์๋ก ๋๋ฌด ์ฐ์ฐํด์ Strapi๋ก ๊ฐ์ํ๋ค. ์ฝ์ง๋ ๋ง์ด ํ๋ค. ๊ทธ๋์ ์ฌ์ด๋ ํ๋ก์ ํธ์ Next.js + Strapi๋ก ๊ธ์ ๋ช ๊ฐ ์ฌ๋ ธ์๋๋ฐ ์ ์กฐํฉ์ผ๋ก ๊ฒ์ํด๋ณด๋ ํํ ๋ฆฌ์ผ์ด ๋์ค๊ธด ํ๋๋ฐ Strapi ์ฐ๊ฒฐํ ๋ ์ฝ์ง์ ๋ง์ด ํด์ ๋๊ตฐ๊ฐ์๊ฒ ๋์์ด ๋์์ผ๋ฉด ํ๋ ๋ง์์ผ๋ก ์ฌ๋ ค๋ณด์๋ค.
์ฝ์ง๋ก๊ทธ๋ฅผ ํ๋ ๋ ์ฌ๋ฆฌ๋ ค๊ณ ํ๋๋ฐ ๊ทธ๋ฅ ์ฌ๊ธฐ์ ํ์ด์ผ๊ฒ ๋ค.
[์ฝ์ง ์์] Strapi๋ก ๊ฐ์ํ๋ ์์ ์ ์ด๋ฏธ ๋ด์ค๋ ํฐ ๋ฐ์ดํฐ๊ฐ 100๊ฐ๊ฐ ๋์ ์ํ์ฌ์ ํ๋ํ๋ DB์ ๋ฐ์ดํฐ๋ฅผ ๋ฃ์ ์์ ์์ฒด๊ฐ ์๊ธฐ์ง ์์๋ค. ๊ธฐ์กด์ ์์
ํ์ผ๋ก ๊ด๋ฆฌํ๋ ๋ฐ์ดํฐ๋ฅผ =CONCATENATE(,,,,,....) ํจ์๋ก (์์ ์ ์ผํ ๋ ๋ฐ์ดํฐ๋ฅผ ๋ฐ์ด ๋ฃ์ ์ผ์ด ๋ง์์ ์ฐ๋ ๊ผผ์?์ธ๋ฐ ์ค์ ๋ก๋ ์ ๋ ๊ฒ ์ฐ๋?ใ
ใ
) SQL ์ฟผ๋ฆฌ๋ฅผ ๋ง๋ค์๋ค. ๊ทธ๋ฆฌ๊ณ PgAdmin์ ๋ค์ด๋ฐ์์ ๋ด DB๊ฐ ๋ถ์ด์๋ ๊ณณ์ผ๋ก ์ ๊ทผํด์ ์ฟผ๋ฆฌ๋ก ๋ค ๋ฐ์ด ๋ฃ์๋ค. ์ณ์ ๋ฐฉ๋ฒ์ ์๋ ๊ฑฐ๋ผ๋ ์๊ฐ์ด ๋ค์ง๋ง... ๋๋ฆ ๋น ๋ฅด๊ฒ Strapi๋ก ๊ฐ์ํ ์ ์์๋ค. [์ฝ์ง ๋]
์ฌ์ค Next.js๋ ์ฒ์ ์ฌ์ฉํด๋ณด๋ ํ๋ ์์ํฌ๋ผ์ ์คํ์ค๋ฒํ๋ก์ฐ, ๊ฐ์ข
๋ธ๋ก๊ทธ, ๊ณต์ ๋ฌธ์๋ฅผ ์ง์ง ๋ง์ด ์ฐพ์๋ณด๊ณ ์ฐธ๊ณ ํ๋ค. ๊ทธ๋์ Next.js ์นดํ
๊ณ ๋ฆฌ์ ๋ด๋ณด๋ด๋ฒ(๋ด๊ฐ ๋ณด๋ ค๊ณ ๋ด๊ฐ ๋ฒ์ญํ) Next.js ๊ณต์๋ฌธ์๋ฅผ ์์ฑํ๊ฒ ๋ ๊ฒ๋ ์ง์ง ๋ด๊ฐ ๋ณด๋ ค๊ณ ์์ฑํ๋ค. ์๊พธ ๊ฐ์ ๋ฌธ์๋ฅผ ์๋กญ๊ฒ ์ฝ๊ณ ์๋ ๋ด ์์ ์ ๋ฐ๊ฒฌํ๊ธฐ ๋๋ฌธ์ด๋ค.
๐ ๋ง๋ฌด๋ฆฌ
๋๋ฌด ๋์์์ด ์ ๊ธด ํ๋๋ฐ ๋ง์ ์ ์ผ๋ ค๋ ์๊ฐ์ด ์ ์ ๋๋ค๐ฅฒ ํ์ฌ๋ 200๊ฐ๊ฐ ์ข ์ ๋๋ ๋ด์ค๋ ํฐ๋ค์ ๋ด๋ ์นด ์ฌ์ดํธ์์ ํ์ธํด๋ณผ ์ ์๋ค. ๋ง์ ๊ธฐ๋ฅ์ด ์ ๊ณต๋๋ ๊ฒ๋ ์๋๊ณ ์ด๋ป๊ฒ ๋ณด๋ฉด ๊ทธ๋ฅ ๋ด์ค๋ ํฐ๋ฅผ ๋ชจ์ ๋์ ์ฌ์ดํธ์ด์ง๋ง ์ด! ์ด๋ฐ ๋ด์ค๋ ํฐ๋ ์๋ค? ํ๋ฉฐ ๊ตฌ๊ฒฝ๋ง ํด์ฃผ์
๋ ์ข์ ๊ฒ ๊ฐ๋ค. ์ฌ์ค ์ด๋ป๊ฒ ๋ค์ด์ค์๋ ๊ฑด์ง ์ ๊ธฐํ ๋๋ ์๋ค. "๋๋ฉ์ธ๊น์ง ๋ถ์ฌ์ ์ฌ์ด๋ ํ๋ก์ ํธ๋ฅผ ํด๋ดค๋ค(๋ง๋ฃ๊ฐ ๋์๋ค...)"์ ์๋ฏธ๋ฅผ ๋์ง๋ง ์์ผ๋ก๋ ๋ ๋ง์ ์ฌ๋๋ค์ ์ํด ์ ์ฉํ๊ณ ์๋ฏธ ์๋ ์๋น์ค๋ฅผ ๋ง๋ค ๋ ์ ๊ธฐ๋ํด๋ณด๋ฉฐ ๊ณ์ ๊ณต๋ถํ๊ณ ๊ธฐ๋ก์ ๋จ๊ฒจ์ผ๊ฒ ๋ค.