๋ฉด์ ๊ธฐ๋ก
1. ํ์ฅ์ค์ต์ ์งํํ๊ณ ์๋ค๊ณ ํ์ จ๋๋ฐ ์ง๊ธ ํ์ฌ ์ด๋ค ๊ฑธ ๊ฐ๋ฐํ๊ณ ๊ณ์๋์?
-
2. ๊ธฐ์ ์คํ์ ์ด๋ค ๊ฒ์ผ๋ก ๊ฐ๋ฐํ๊ณ ๊ณ์๋์ง? ๋ฆฌ์กํธ๋ฅผ ์ฐ์๋์?
- next.js์ typescript๋ฅผ ์ฌ์ฉํ๋ค. ํ์ง๋ง ์๋ ๋ฆฌ์กํธ ํ๋ก์ ํธ์๋ ๊ฒ ๊ฐ๋ค. ๋๋ ํ ๋ฆฌ ๊ตฌ์กฐ ๊ฐ์ ๊ฒ๋ค์ด next.js๋ณด๋จ ๋ฆฌ์กํธ์ ๊ฐ๊น์ด ๋๋. ๋ฐ๋ก๋ฐ๋ก ๋ฐ์๋๋ค๊ฑฐ๋, ์๋ฒ์ฌ์ด๋๋ ๋๋ง ์ ๋๋ง next.js์ธ ๋๋์ด๋ค.
3. CSR๊ณผ SSR์ ์ฐจ์ด๋ฅผ ์ค๋ช ํด์ฃผ์ธ์!
- ํด๋ผ์ด์ธํธ ์ฌ์ด๋ ๋ ๋๋ง, ์๋ฒ ์ฌ์ด๋ ๋ ๋๋ง์ผ๋ก ๋ ๋๋ง ๋ฐฉ์์ ์ฐจ์ด์ด๋ค. ๋ฆฌ์กํธ๋ ๋ํ์ ์ธ CSR ์ ์ด์ฉํ๋ ์๋ฐ์คํฌ๋ฆฝํธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ. ํ์ง๋ง ํด๋ผ์ด์ธํธ ์ฌ์ด๋ ๋ ๋๋ง์ SEO (๊ฒ์ ์์ง ์ต์ ํ) ์ ๋ฌธ์ ๊ฐ ์๊ณ , ๋ฆฌ์กํธ์ ์ด๋ฌํ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํด์ฃผ๋ ๊ฒ์ด ๋ฆฌ์กํธ ํ๋ ์์ํฌ์ธ Next.js์ด๋ค.
4. ํ๋ก ํธ์๋๋ฅผ ์ธ์ ๋ถํฐ ํ์ จ๋์ง?
- ์ค๋ ๋์ง ์์๋ค. 1ํ๋ ๋ ์ํด์์๋ ์๊ฒฝ๊ณ์ด์ ์ฌ๋๋ค๊ณผ ์ฐฝ์ ๋์๋ฆฌ๋ฅผ ํ๋ค๊ฐ ๊ฐ๋ฐ์๊ฐ ์์ด ์ด๋ฃจ์ด์ง๋ ๋ ผ์๊ฐ ๋ฌ๊ตฌ๋ฆ๋ง ์ก๋ ๊ฒ ๊ฐ์ ๋ต๋ตํด์, '๋ด๊ฐ ์ง์ ๊ฐ๋ฐ์ ํด๋ฒ๋ ค์ผ๊ฒ ๋ค' ํ๊ณ ๊ฐ๋ฐ์ ๊ด์ฌ์ ๊ฐ์ง๊ฒ ๋์๋ค. 2-1 ๋๋ ์ ๊ณผ ์ค๋น๋ฅผ ํ๊ณ , 2-2์ ์ ๊ณผ๋ฅผ ํ๊ณ ๋์์ผ ์ฌ์ฉ์ ๊ฒฝํ์ ๊ฒฐ์ ์ง๋ UI๋ฅผ ๊ฐ๋ฐํ๋ ํ๋ก ํธ์๋ ๋ถ์ผ์ ๊ด์ฌ์ด ์๊ฒจ ๊ทธ๋ HTML, CSS๋ฅผ ๊ณต๋ถ๋ฅผ ํ๋ค. ๊ทธ๋ฆฌ๊ณ 3-1 ๋๋ ์๋ฐ์คํฌ๋ฆฝํธ์ ๊ธฐ๋ณธ์ ์ธ ๋ด์ฉ์ ํ์ตํ๊ณ , ํด๋ก ์ฝ๋ฉ ์ ๋ ํด๋ณด๊ณ , ์ด๋ ๊ฒ ๋ง์ด ๊ณต๋ถํ์ง ์์ ์ฑ๋ก ํ์ฌ์ ๋ค์ด๊ฐ๋ค.
ํ์ฌ์์ ์ฒ์ 2์ฃผ๋์ ๊ณต๋ถํ ์๊ฐ์ ์ฃผ์ ์, ๊ทธ๋ ์งง์ ์๊ฐ๋์ ๋ฆฌ์กํธ์ Next.js๋ฅผ ๊ณต๋ถ๋ฅผ ํ๊ณ ๋ฐ๋ก ์ค์ ์ ํฌ์ ๋์๋ค. ๊ทผ๋ฐ ์ ๋ง, ๋ด๊ฐ ์๋ 9์๋ถํฐ ์ฌํด 6์๊น์ง ํ๋ ๋ด์ฉ๋ณด๋ค, ์ด๋ ํ๋ฌ๋ ์๋๋ ๊ธฐ๊ฐ๋์ ๊ณต๋ถ๋ฅผ ํ ๊ฒ ๋ ๋ง์ด ์ฑ์ฅ์ ํ ๊ฒ ๊ฐ๋ค.
-> ์งง์ ์๊ฐ๋์ ์ด๋ป๊ฒ ์ ํด๋ด์ จ๋์ง ์ ๊ฒ ๊ฐ๋ค. (์์)
5. ๊ณต๋ถํ ๋ ์ด๋ค ๋ฐฉ์์ ์ฌ์ฉํ์๋์ง?
- ๊ณต๋ถ ๋ด์ฉ ๋ณ๋ก ๋ค๋ฅธ ๊ฒ ๊ฐ์๋ฐ, ์ธ์ด ๊ฐ์ ๊ฒฝ์ฐ๋ ์ฑ ์ผ๋ก ๋ณด๋ ๊ฒ ๋ ์ข์ ๊ฒ ๊ฐ๊ณ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ ํ๋ ์์ํฌ๋ ๊ณต์ ๋ฌธ์๋ฅผ ํ์ฉํ๊ณ ๋ง์ ์์๋ฅผ ์ ํ๋ ๊ฒ๋ค์ด ์ข์ ๊ฒ ๊ฐ๋ค. ํ์ฌ์์ 2์ฃผ ๋์ ๊ณต๋ถ๋ฅผ ํ์ ๋๋ ๋ฆฌ์กํธ์ next.js๋ ๊ณต์ ๋ฌธ์๋ฅผ ํ์ฉํ๋๋ฐ ์ ๋ง ์ ๋์ด์๋๋ผ. ๋ฒ์ญ์ด ์ ๋ ๊ฒ๋ ์๊ธด ํ์ง๋ง, ๋ค์ํ ์ฌ์ฉ ์์๋ฅผ ์๋ ค์ฃผ๊ณ , ๊ฐ๋จํ๊ฒ ํฌ๋์ฑ์ด๋ ๋ธ๋ก๊ทธ๋ฅผ ๋ง๋ค์ด๋ณผ ์ ์๋๋ก ์์๋ ๋์์๋ค. ๋ฐฐ์ด ๋ด์ฉ๋ค์ ๋ฐ๋ก๋ฐ๋ก ํ์ฉํ์ฌ ๋ฌด์ธ๊ฐ๋ฅผ ๋ง๋ค์ด๋ณด๋ ๊ฒ์ด ์ข์ ๊ฒ ๊ฐ๋ค. ์ด๋ ๊ฒ ์ฐจ๊ทผ์ฐจ๊ทผ ๊ณต๋ถํ๋ ๊ฒ๊ณผ, ๋ถ๋ชํ๋ฉด์ ๊ณต๋ถํ๋ (๊ท๋ฉ์ , ์ฐ์ญ์ ๊ณต๋ถ๋ฐฉ๋ฒ) ์ ๋ณํํ๋ ๊ฒ์ด ๊ฐ์ฅ ํจ์จ์ ์ธ ๊ฒ ๊ฐ๋ค.
6. GDSC์์ ์ด๋ค ํ๋์ ๊ธฐ๋ํ์๋์ง?
- ์ ๊ฐ ๊ณต๋ถํ ์๊ฐ์ด ์งง๋ค๋ณด๋, ์ด๊ฒ ์ ๋์ง ..? ํ ๋ ์ฐพ์๋ณผ ์ ์์ ๋๋ ์์ง๋ง, ๊ทธ๋ด ์๊ฐ์ด ์์ ๋๋ ์๋ค. (์์) ๋งค์ฃผ ๊ฐ๋ฐ ์ผ์ ์ด ์๊ณ ์ฝ๋ ๋ฆฌ๋ทฐ๋ฅผ ์งํํ๋ค๋ณด๋ ์๊ฐ์ด ์ด๋ฐํ ๋๋ ์๋ค. ์ ๋๊ณ ์ ์ ๋๋์ง๋ฅผ ์ ์ ์๋๋ก ์ด๋ก ์ ์ธ ๋ถ๋ถ์ ๋ํ ํ์ต์ ์งํํ๊ณ ์ถ์ด์, ์๋๋ ๊ฐ์ธ์ ์ผ๋ก ์คํฐ๋๋ฅผ ๋ชจ์งํ๋ ค๊ณ ํ์๋ค. ๊ทผ๋ฐ GDSC ๊ณต๊ณ ๋ฅผ ๋ณด๊ณ , ์ ! ์ฌ๊ธฐ์ ๊ตฌํ๋ฉด ๋๊ฒ ๋ค ! ใ ๋ผ๋ ์๊ฐ์ด ๋ค์๋ค. ๊ฐ์ธ์ ์ผ๋ก ์๋ ํ๋ก ํธ์๋ ํ์๋ ๋ถ๋ค์ด ๋ณ๋ก ์๊ธฐ๋ ํ๊ณ .
- > ํ๋ก ํธ์๋๊ฐ .. ๊ฐ๋ญ์ด๋ค .. ใ ใ ใ ํ๋ก ํธ์๋ ๊ณ ์ ๋ถ๋ค์ด ๋๊ฑฐ ์กธ์ ์ ํ์ ์ ํ๋ก ํธ์๋ ๊ณ ์๋ฅผ ๋ฌผ์ํ๋ ์ฐฐ๋์ ๋ด๊ฐ ๋ ์ด๋๋ง์ ๊ฑธ๋ ธ๋ค ใ ใ ์คํฐ๋ ๊ฐ์ ๊ฑฐ ๋ด๊ฐ ๋ค์ด์์ ์ ์ฃผ๋ํด์คฌ์ผ๋ฉด ์ข๊ฒ ๋ค ใ ใ
7. ์ปจํผ๋ฐ์ค๊ฐ ์๋ค๋ฉด ์ด๋ค ๋ด์ฉ์ผ๋ก ๋ฐํ๋ฅผ ์งํํ๊ณ ์ถ์ผ์ ์ง?
- ํ๋ก ํธ์๋ ํ๋ ์์ํฌ๋ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ๊ฐ์ด, ์๋ฅผ ๋ค๋ฉด ์๋ ์ ๋ ฅ ๊ฐ์ ๋ฐ์ ๋ useState๋ก ๋ก์น ์ ํ์๋๋ฐ react hook form์ ์๊ฒ ๋์๊ณ , yup ๋ ์๊ณ . ์ง๊ธ๊น์ง ํ๋ ๋ด์ฉ์ด๋ฉด ์ด๋ฐ ๊ฒ๋ค์ ์๊ฐํ๊ณ ์ค๋ช ํ๋ ๊ฒ์ ํ ์ ์์ ๊ฒ ๊ฐ๋ค.
์๋ก์ด ์ฃผ์ ๋ก ํ๋ค๋ฉด ์ต๊ทผ์ WebRTC์๋ ๊ด์ฌ์ด ์๊ฒจ์, ๋ชฉํ๋ฅผ ์ก๊ณ ์ ๊ฐ ๋จ๊ธฐ๊ฐ์ ๋ง๋ค์ด์ ๋ฐํ๋ฅผ ํ๋ ์์ผ๋ก ํด๋ ์ฌ๋ฏธ์์ ๊ฒ ๊ฐ๋ค.
8. ํ ํ๋์ ํ์ค ๋ ํ๋ก์์ ๋ฆฌ๋ ์ค ์ด๋ค ์ญํ ์ ํ์๋ ํธ์ด์ ์ง?
- ์ผ์ ํญ์ ๋ฒ์ด๋ ๊ฑด ์๋๋ฐ, ์ข์ํ๋ ๋ถ์ผ์์๋ ์ผ์ ์ข ๋ฒ์ธ๋ค. ๊ทธ๋ ๊ฒ ์ข์ํ๋ ์ผ๋ค์ ๊ต์ฅํ ๋ชฐ์ ํด์ ์ ๊ทน์ ์ผ๋ก ํ๋ ํธ์ด๊ณ , ๊ทธ๋ฌ๋ค๋ณด๋ฉด ๋ฆฌ๋์ ์ญํ ์ ํ๊ณ ์๋๋ผ. ํ์ง๋ง .. ๋๋ฌด ์ผ์ด ๋ง๋ค ์ถ์ผ๋ฉด ํ๋ก์๋ฅผ ํ ๋๋ ์๊ณ , ์ํฉ์ ๋ฐ๋ผ ์กฐ์ ์ ํ๋ ๊ฒ ๊ฐ๋ค.
9. ๋ง์ง๋ง์ผ๋ก ํ๋ ๊ด๋ จํด์ ์ง๋ฌธํ์ค ๊ฒ ์๋์ง?
- ์ธ๋ถ ์ปจํผ๋ฐ์ค ๊ฐ์ ๊ฒ๋ ๊ฐ์ด ์ฐธ์ฌํ๋ ํ๋์ด ์๋์? (๊ธฐ์ ์ธก์์ ์ฃผ๊ดํ๋ ํฐ ์ปจํผ๋ฐ์ค๋ค)
-> ํ์ฌ ๋ด๋ถ์์ ๋ฐํํ๊ณ ๊ณต์ ํ๋ ์ปจํผ๋ฐ์ค๋ ๊ณํ๋์ด์๋๋ฐ, ์ธ๋ถ์์ ์ด๋ฆฌ๋ ์ปจํผ๋ฐ์ค ์ฐธ์ฌ๋ ๊ฐ์ด ์ถ์งํด๋ณด๋ฉด ์ข์ ๊ฒ ๊ฐ๋ค.
๋ ์ฌ๋ฐ์๋น