์ ์ธ๊ณ ๋ฐ์ค ์คํผ์ค 1์์ธ ์ด๋ฒค์ ธ์ค์ ์๋๊ฒ์์ฒ๋ผ,
Vue.js FE ๊ฐ๋ฐ๊ต์ก์ ์๋๊ฒ์์ ๋ชฉํ๋ก ํฉ๋๋ค ๐ฉ
Vue.js ํ์ต์
๋ง์ง๋ง ๊ฐ์ข ๐
์์ฐ์ฑ์ ๋์ฌ์ฃผ๋ Vue.js ํ๋ก์ ํธ ํ๊ฒฝ ๊ตฌ์ฑ๋ถํฐ
์ค์ API๋ฅผ ์ด์ฉํ์ฌ ๋ฐฑ์๋ ๊ฐ๋ฐ์์ ํ์
ํ๋ ๋ฐฉ๋ฒ์ ๋ํด์ ๋ชจ๋ ๋ด์์ต๋๋ค.
ํ์ต ๋
ธํธ ์น ์ ํ๋ฆฌ์ผ์ด์
์ ๊ตฌํํ๋ฉด์ ํ๋ก์ ํธ๋ฅผ ์งํํ ๋
์๊ณ ์์ผ๋ฉด ์ข์ ํ๋ค์ ๋ชจ๋ ํ์ธํด๋ณด์ธ์ ๐
๋ด์ฉ ๋ฏธ๋ฆฌ ๋ณด๊ธฐ ๐
1๋ฒ
- ์ค๋ฌด ํ๊ฒฝ์์ ๊ฐ๋ฐ ์์ฐ์ฑ์ ๊ทน๋ํํ๋ ํ๋ก์ ํธ ํ๊ฒฝ ๊ตฌ์ฑ
2๋ฒ
- ๋ฐฑ์๋ ๊ฐ๋ฐ์์ ์ํตํ๋ ๋ฐฉ๋ฒ๊ณผ REST API ๋ฌธ์ ๋ณด๋ ๋ฐฉ๋ฒ
3๋ฒ
- REST API์ ๋ฐ์ดํฐ๋ฒ ์ด์ค๋ฅผ ์ด์ฉํ CRUD ์ ํ๋ฆฌ์ผ์ด์
๊ฐ๋ฐ
4๋ฒ
- axios๋ฅผ ์ด์ฉํ JSON ์น ํ ํฐ ์ธ์ฆ ์ฒ๋ฆฌ์ ๊ณ ๊ธ API ํจ์ ํจํด
5๋ฒ
- ๋ผ์ฐํฐ๋ฅผ ์ด์ฉํ ํ์ด์ง ๊ถํ ์ฒ๋ฆฌ ๋ฐ ์ธ์ฆ ์ฒ๋ฆฌ
6๋ฒ
- ํ๋ก ํธ์๋ ํ
์คํ
๋ฐฉ๋ฒ
๋ฏธ๋ฆฌํ๋ Q&A ๐๐ปโโ๏ธ
Q. ์ด์ Vue.js ๊ฐ์ข๋ค์ ๋ฃ์ง ์๊ณ ๋ ์๊ฐ ๊ฐ๋ฅํ๊ฐ์?
Vue.js ์ด์ ๊ฐ์ข๋ฅผ ์๊ฐํ์ง ์์ ๋ถ๋ค๊ป๋ ์ ํฉํ์ง ์์ ๊ฐ์ข์
๋๋ค. ์ด๋ก ์ค๋ช
๋ณด๋ค๋ ๊ตฌํ ์ค์ฌ์ ๊ฐ์๊ฐ ์งํ๋๋ ๊ผญ ์ด์ ๊ฐ์ข๋ค์ ์๊ฐํ์ ํ์ ์ด ๊ฐ์๋ฅผ ๋ฃ๋ ๊ฑธ ์ถ์ฒ๋๋ฆฝ๋๋ค.
Q. ๊ฐ์ ์๊ฐ ํ ์ ๋ง ์ค๋ฌด์์ ํ๋ก ํธ์๋ ๊ฐ๋ฐ์๋ก ์ผํ ์ ์์๊น์?
์ด๋ฒ ๊ฐ์๋ ์ค๋ฌด๋ฅผ ์์ํ ๋ ๋ฐฑ์๋ ๊ฐ๋ฐ์์ ์ด๋ค ์์ผ๋ก ํ์
ํ๊ณ ์ด๋ป๊ฒ API ๋ฌธ์๋ฅผ ์ฝ์ด์ผํ๋์ง์ ๋ํด์๋ ์ค์ ์ ์ผ๋ก ๋ค๋ฃจ๊ณ ์์ต๋๋ค. ํ๋ ์น ์๋น์ค ๊ฐ๋ฐ ์ ์ฐจ์ ํจ๊ป ํ๋ก ํธ์๋ ๊ฐ๋ฐ์๊ฐ ํด์ผํ๋ ์ญํ ๋ค๋ ์๊ฐํ๋ ์ค๋ฌด๋ฅผ ์์ํ์ค ๋ ํฐ ๋์์ด ๋์ค ๊ฑฐ์์.
Q. Vue.js ์ ๋ฉ์ด์ ๋ฒ์ ์ด ๊ณง ๋์จ๋ค๋๋ฐ, ์ง๊ธ ๋ฐฐ์ฐ๋ ๊ฒ๋ณด๋ค ๊ธฐ๋ค๋ ธ๋ค๊ฐ ๋ฐฐ์ฐ๋๊ฒ ๋ซ์ง ์์๊น์?
Vue.js ์ ๋ฒ์ ์ ๊ธฐ์กด์ ๊ตฌ์กฐ์์ ์ฝ๋๋ฅผ ๋ ํธํ๊ฒ ์ฌ์ฌ์ฉํ ์ ์๋ ๋ฐฉํฅ์ผ๋ก ์งํ๋ ์์ ์
๋๋ค. ์ ๋ฒ์ ์ด ๋์จ๋ค๊ณ ํด์ ์ง๊ธ ๋ฐฐ์ด ๋ด์ฉ์ ์ธ ์ ์๋ ๊ฒ ์๋๋ผ, ์ง๊ธ ๋ฐฐ์ด ๋ด์ฉ์ ๋ ์๋ก์ด ๋ฐฉ๋ฒ๋ค์ ์ถ๊ฐํ์ฌ ์ฝ๋๋ฅผ ๊ฐ์ ํ ์ ์๊ฒ ๋ฉ๋๋ค. ๋ฟ๋ง ์๋๋ผ ๊ฐ์์์ ๋ฐฐ์ฐ๋ ํ๋ก์ ํธ ํ๊ฒฝ ๊ตฌ์ฑ, API ํจ์ ๊ตฌ์กฐํ, ํ๋ก ํธ์๋ ํ
์คํ
๋ฑ์ ์ฌ์ง์ด ๋ค๋ฅธ ํ๋ ์์ํฌ๋ฅผ ์ธ ๋์๋ ์ ์ฉํ์ค ์ ์์ด์.
์ฐ๊ด ๋ก๋๋งต ๐
์ง์๊ณต์ ์ ์๊ฐ ๐จโ๐ซ
์บกํดํ๊ต
"์ธํ๋ฐ์ด ๋ง๋ ์ฌ๋" ์ธํฐ๋ทฐ
โ๊ฐ์ ์์ต์ผ๋ก Vue.js ์คํ์์ค +
์ํ์ฝ๋ฉ์ ํ์ํฉ๋๋ค ๐โ
๊ฐ์ ํ ์ธ์ ์ ๊ณตํฉ๋๋ค!
์๋ฆฌ์ฆ "Vue.js๋ก ์์ฑํ๋ ํ๋ก ํธ์๋
๊ฐ๋ฐ์ ๋ก๋๋งต" 25% ํ ์ธ (ํด๋ฆญ)
์์
์ด ์๋ ์คยท๊ณ ๋ฑํ์,
๋ํ์์ ์ํ ํ์ 50% ํ ์ธ (ํด๋ฆญ)