๊ฐ๋ฐ์ ์ ๊ณผ์ ์ ๊ฒฝํํ๊ณ
๊ฒฐ๊ณผ๋ฌผ๊น์ง ๋ง๋ค์ด์ ๐บ
์ฐ๋ฆฌ๊ฐ ์ฝ๋ฉ์ ๋ฐฐ์ฐ๋ ์ด์ ๋ ์ฐ๋ฆฌ์๊ฒ ํ์ํ ๊ฒ์ ๋ง๋ค๊ธฐ ์ํจ์ธ๋ฐ,
๋ชฉ์ ์์ด ๋ฐฐ์ฐ๋ค ๋ณด๋ฉด ์๋์ ์๋์๋ ๋ค๋ฅด๊ฒ ์ต์ ๊ธฐ์ ์คํ๋ง์ ๋ฐ๋ผ๊ฐ ์ ์์ต๋๋ค.
๊ฐ๋ฐ์ ์ ๊ณผ์ ์ ์ง์ ๊ฒฝํํด๋ณด๊ณ ๋ด๊ฐ ํฅ๋ฏธ๋ฅผ ๋๋ผ๋ ๋ถ์ผ์ ์ง์คํด๋ ๋ฆ์ง ์์์.
๋๋ฌด ๋์ด๋๊ฐ ๋์ ๊ธฐ์ ์ ๋ฐฐ์ ํ๊ณ ๊ฐ๋ฐ ํ๋ก์ธ์ค ๊ฒฝํ์ด๋ผ๋ ์ทจ์ง์ ํฌ์ปค์ค๋ฅผ ๋ง์ถฐ ๊ตฌ์ฑํ์ต๋๋ค.
๋ณธ ๊ฐ์์์๋ ๋ง์ง ์ง๋ ์๋น์ค ์ ์์ ํ์ํ ๊ณผ์ ์ A๋ถํฐ Z๊น์ง ๋ค๋ฃจ์ด๋ณด๋ฉฐ,
๋ด๊ฐ ์ข์ํ๋ ์ ํ๋ฒ์ ๋ง์ง ์ง๋๋ฅผ ์ฐจ๊ทผ์ฐจ๊ทผ ๋ง๋ค์ด๋ด
๋๋ค.
์ด๋ฐ ๋ถ๋ค๊ป ์ถ์ฒ๋๋ ค์ ๐
๊ฐ๋ฐ ๊ฒฝํ์ด
์์ง ๋ถ์กฑํ ๋ถ
์น์๋น์ค๋ฅผ
๋ง๋ค๊ณ ์ถ์ ๋ถ
ํ๋กํ ํ์
์
๋ง๋ค๊ณ ์ถ์ ๋ถ
๋
ํนํ ์ง๋์๋น์ค๋ฅผ
๋ง๋ค๊ณ ์ถ์ ๋ถ
์ด ๊ฐ์๋ง์ ํน์ง์
์๋ ค๋๋ฆด๊ฒ์ ๐ฉ
1. ๊ธฐ๋ณธ ๊ธฐ์ ์ ์ถฉ์คํ์ฌ ์ต๋ํ ํ์ฉํ๋ ๊ฐ์
๊ผญ ์ต์ ํ๋ ์์ํฌ๋ฅผ ์๊ณ ์์ด์ผ๋ง ๊ฐ๋ฐํ ์ ์๋ ๊ฒ์ ์๋๋๋ค.
์คํ๋ ค ๊ธฐ๋ณธ ๊ธฐ์ ์ ๋ชจ๋ฅด๋ ์ํ์์ ์ต์ ๊ธฐ์ ๋ถํฐ ๋ฐฐ์ด๋ค๋ฉด ๊ธ๋ฐฉ ํฅ๋ฏธ๋ฅผ ์๊ธฐ ์ฝ์ต๋๋ค.
๋ณธ ๊ณผ์ ์ ์น ํด๋ผ์ด์ธํธ๋ถํฐ ์๋ฒ, ๋ฐฐํฌ ๊ธฐ์ ๊น์ง ์ต๋ํ ํ์ฉํ๋ ๊ฒ์ ์ด์ ์ ๋ง์ท์ต๋๋ค.
2. ์ค์ ์น ์๋น์ค๋ฅผ ๋ง๋ค๋ฉฐ ์ตํ๋ ํ์คํ ๊ธฐ์
์ฒ ์ ํ๊ฒ ํต์ฌ ์์ฃผ๋ก ํ์ตํ์ฌ ์ค์ต ์์ฃผ๋ก ํ์ฉํ ์ ์๋๋ก ํ๋ ๊ฒ์ด 1์์ ๋ชฉํ์
๋๋ค.
- HTML, CSS๋ฅผ ๋ฐฐ์ฐ๊ณ , ํ์ฉํ ์ ์๋ ํผ๋ธ๋ฆฌ์ฑ ํ๋ก์ ํธ,
- AWS ์๋ฒ๋ฅผ ๊ตฌ์ถํ๊ณ REST API ์๋ฒ ๊ตฌํ, ๊ทธ๋ฆฌ๊ณ ๋ฐฐํฌ๊น์ง!
3. ๋ด ๊ฒ์ผ๋ก ๋ง๋ค๊ธฐ ์ํ ์ฐ์ต
๊ฐ์ ์ค๊ฐ๋ง๋ค ๋ฐฐ์ด ๋ด์ฉ์ ์ง์ ์ค์ตํด๋ณผ ์ ์๋๋ก ํด์ฆ๊ฐ ๋์ค๋๋ฐ,
๊ฐ์๋ฅผ ์๊ฐํ๋ฉฐ ์ง์ ํ์ด๋ณธ๋ค๋ฉด ๋ฐฐ์ด ์ง์๋ค์ ์ง์ง ๋ด ๊ฒ์ผ๋ก ๋ง๋๋๋ฐ ๋์์ด ๋ ๊ฒ๋๋ค.
4. ์ํํ ์ง์์๋ต & ๋ค์ํ ๊ฐ์์๋ฃ
์ง๋ฌธ์ ๋จ๊ฒจ์ฃผ์๋ฉด ํจ๊ณผ์ ์ธ ํ์ต์ ์ํด ๋น ๋ฅด๊ฒ ๋ต๋ณ๋๋ฆฌ๊ฒ ์ต๋๋ค.
๋, ๊ฐ ์ฑํฐ๋ณ ๊ฐ์์์ ํ์ฉํ ์ ์๋๋ก ๋ค์ํ ๊ฐ์์๋ฃ๋ฅผ ์ ์ํ์ต๋๋ค.
ํด๋ผ์ด์ธํธ & ์๋ฒ๋ฅผ ๋ฐฐ์์ ๐จโ๐ป
ํด๋ผ์ด์ธํธ
- ํต์ฌ ์ฝ์ฝ! HTML, CSS
- HTML ์ฃผ์ํ๊ทธ
- CSS Box Model, Position, Flex...
- ๋ง์ง์ง๋ ์ผ๋จ ๋ง๋ค์ด๋ด์! : HTML, CSS + ์นด์นด์ค๋งต ํผ๋ธ๋ฆฌ์ฑ
- HTML, CSS๋ก ๋ง์ง์ง๋ ๋ผ๋ ๋ง๋ค๊ธฐ
- ์นด์นด์ค๋งต API๋ก ์ง๋ ๋ฃ๊ธฐ
- ๊น๋ํ๊ฒ ์ ๋ฆฌํ๋ Javascript ๋ฌธ๋ฒ
- variable, operator..
- condition, loop
- function
- JS DOM๊ณผ ๋น๋๊ธฐ์ฒ๋ฆฌ
- DOM && Event Handling
- Asynchronous
- ์นด์นด์ค๋งต API
- ์ง๋ ์์ฑ & ์ปจํธ๋กค๋ฌ
- Marker ์์ฑ
- InfoWindow ์ปค์คํฐ๋ง์ด์ง
- ์นดํ
๊ณ ๋ฆฌ ํธ๋ค๋ง
์๋ฒ
- ์๋ฒ๋ฅผ ๊ตฌ์ถํ์! ์ฝ๊ฒ ์ดํดํ๊ณ ๋ง๋๋ AWS ์๋ฒ
- AWS EC2 + Linux Ubuntu
- Nginx, Node Express.js, MySQL
- ๋ฐ์ดํฐ๋ฅผ ์ ์ฅํ๋ ๊ณต๊ฐ, MySQL๋ก ๋ฐฐ์ฐ๋ DB ์ค๊ณ๋ฐฉ๋ฒ๊ณผ SQL
- ๋ฐ์ดํฐ๋ฅผ ๊น๋ํ๊ฒ ์ ๊ณตํ๋, Express.js ๋ฐฑ์๋์ REST API
- REST API
- Express ์ฌ์ฉ๋ฒ
- CRUD API ๊ตฌํ
- ๋ง์ง์ง๋๋ฅผ ์์ฑํด๋ณผ๊น์?
- ํ๋ก์ ํธ ์์ฑ ๊ณผ์
- ๋ฐฐํฌํ๊ธฐ: ์ ์ธ๊ณ์์ ๋ด ๋ง์ง์ง๋๋ฅผ ๋ณผ ์ ์๋๋ก
- Git, Github
- PM2 ๋ฌด์ค๋จ ๋ฐฐํฌ
- Domain ์ ์ฉ
์ฌ๋ฌ๋ถ๋ค์ ๋ฏธ๋ ๋ชจ์ต ๐
- HTML, CSS๋ฅผ ํ์ฉํด์ ์น์ฌ์ดํธ์ ๋ ์ด์์์ ๋ง๋ค ์ ์์ต๋๋ค.
- ์นด์นด์ค๋งต API๋ฅผ ํ์ํ ํํ๋ก ์ปค์คํ
ํ์ฌ ์ฌ์ฉํ ์ ์์ต๋๋ค.
- ํด๋ผ์ด์ธํธ์ ์๋ฒ์ ๊ฐ๋
์ ์ดํดํ๊ณ ์ค๋ช
ํ ์ ์์ต๋๋ค.
- AWS EC2 Linux Ubuntu ์๋ฒ๋ฅผ ๊ตฌ์ถํ ์ ์์ต๋๋ค.
- REST API์ ๊ฐ๋
์ ์ดํดํ๊ณ ์ค๋ช
ํ ์ ์์ต๋๋ค.
- ํ์ํ REST API๋ฅผ ๊ตฌํํ ์ ์์ต๋๋ค.
- ์ฌ์ดํธ๋ฅผ ๋ฐฐํฌํ ์ ์์ต๋๋ค.
์์ ์ง๋ฌธ Q&A ๐ฌ
Q. ์ ํ์คํ ๊ธฐ์ ์ ๋ฐฐ์์ผ ํ ๊น์?
ํ๋ก๊ทธ๋๋ฐ์ ์
๋ฌธํ์๋ ๋ถ๋ค์ด ๋ฌธ๋ฒ ๊ณต๋ถ๋ง ๋ฐ๋ณตํ๋ค๊ฐ ์ค์ ๊ฐ๋ฐ์ ํด๋ณด์ง ๋ชปํ๊ณ ํฌ๊ธฐํ๋ ๊ฒฝ์ฐ๋ฅผ ๋ง์ด ๋ดค์ต๋๋ค. ํ๋ก๊ทธ๋๋ฐ ์ฌ๊ณ ๋ ฅ์ ์๊ตฌํ๋ ์๊ณ ๋ฆฌ์ฆ ๋ถ์ผ์ ์ค์ ๊ฐ๋ฐ ๋ถ์ผ๋ ๋ ์ฐจ์ด์ ์ด ์์ต๋๋ค. ํ์คํ ๊ธฐ์ ์ ์ตํ๋ฉฐ ํ๋ก์ ํธ์ A-Z๋ฅผ ๋๊ปด๋ณด๋ ๊ฒฝํ์ ๋๋ฆฌ๊ณ ์ถ์ด์!
Q. ์ฝ๋ฉ์ ์ฒ์์ธ๋ฐ ์๊ฐํด๋ ๊ด์ฐฎ์๊น์?
๋น์ ๊ณต์๋ค๋ ์๊ฐํ์ค ์ ์๋๋ก ์ต๋ํ ์ ๊ฒฝ์จ์ ๊ฐ์๋ฅผ ๊ตฌ์ฑํ์ง๋ง ์ต์ํ์ ๊ธฐ์ด์ง์์ ํ์ํฉ๋๋ค. ๋ํ์์ ๊ฒฝ์ฐ ํ๊ต์์ ๊ธฐ์ด ํ๋ก๊ทธ๋๋ฐ ๊ฐ์๋ฅผ ๋ค์ด๋ณธ ์ ์ด ์๋ค๋ฉด ์ถฉ๋ถํ ์๊ฐํ์ค ์ ์๊ณ , ์ํ์ฝ๋ฉ์ ๋ณด๊ณ ์ดํดํ์ค ์ ์๋ ์ ๋๋ผ๋ฉด ์๊ฐํ์ค ์ ์๋ค๊ณ ์๊ฐํฉ๋๋ค. ๋ง์ฝ ์ด๋ ค์ด ์ ์ด ์์ผ์๋ค๋ฉด ์ธ์ ๋ ์ง๋ฌธํด์ฃผ์ธ์! ๋น ๋ฅด๊ฒ ๋ต๋ณ๋๋ฆฌ๊ฒ ์ต๋๋ค.
Q. ์๊ฐํ๊ณ ๋ ๋ค์์ ๋ฌด์์ ํด์ผ ํ ๊น์?
์ ๊ฐ ์ถ์ฒ๋๋ฆฌ๋ ๊ฒ์ ํ๋ก์ ํธ๋ฅผ ํ๋ ๊ตฌ์ํ๋ ๊ฒ์
๋๋ค. ์ด๋ค ํ๋ก์ ํธ๋ผ๋ ์ผ๋จ ๋ง๋ค์ด๋ณด๊ณ ์ถ์๋ ๊ฑธ ์ ํ๊ณ ๋ถ๋ชํ ๋ณด์๋ ๊ฒ๋๋ค. ์๊ฐํ๋ฉด์ ์ฌ๋ฏธ์์๋ ํ ๋ถ์ผ๋ฅผ ์ ํด ์ ๋ฌธ์ฑ์ ์์๋ณด์๋ฉด ํฐ ๋์์ด ๋ ๊ฒ๋๋ค.
Q. ์๊ฐ ์ ์ฃผ์ํ ์ฌํญ์ด ์์๊น์?
A. ํด๋ผ์ด์ธํธ ํํธ๋ฅผ ์งํํ ๋๋ Chrome ์น ๋ธ๋ผ์ฐ์ ๋ฅผ ๊ธฐ์ค์ผ๋ก ์งํํ๋ฉฐ, ์ ์ฒด์ ์ธ ๊ฐ์๋ Windows OS ๊ธฐ์ค์ผ๋ก ์งํ๋ฉ๋๋ค.
A. ์ฝ๋๋ฅผ ์ง์ ์์ฑํ๋ฉฐ ๊ฐ์๋ฅผ ์งํํ๋ ๋ถ๋ถ์ด ์๊ธฐ์ ํค๋ณด๋ ์๋ฆฌ๊ฐ ๋ ์ ์์ต๋๋ค.
์๋ฆฌ์ ๋งค์ฐ ๋ฏผ๊ฐํ์ ๋ถ์ ๋ฐ๋์ ๊ณต๊ฐ๋ ๊ฐ์ ์๋์ ํ์ธํด์ฃผ์๊ธธ ๋ฐ๋๋๋ค.
A. ์๋ฒ ํํธ ๊ฐ์์์๋ ์ ์ฒด์ ์ผ๋ก Top-down ํ์์ ํ์ต์ด ์งํ๋ฉ๋๋ค.
Express ํ
ํ๋ฆฟ์ ์ ๊ณตํ๊ณ , ์ด๋ฅผ ํ์ฉํด RestAPI๋ฅผ ์ค๊ณํ๋ ๋ฐฉ๋ฒ์ ๋ฐฐ์๋๋ค.
Express generator๊ฐ ์๋ ๊ฐ์ฌ ๋ณธ์ธ์ด ์ง์ ์ ์ํ MVC ํจํด ํ
ํ๋ฆฟ์
๋๋ค.
ํ
ํ๋ฆฟ ๊ตฌ์กฐ๋ฅผ ์ดํดํ๊ณ ํ์ฉํ์ฌ ๊ธฐ๋ฅ์ ๊ตฌํํ๋๋ฐ ์ด์ ์ ๋ง์ถ๊ณ ์์ต๋๋ค.
ํ์ต ์คํ์ผ๋ฉด์์, Bottom-up์ผ๋ก ํ
ํ๋ฆฟ ์ ์์ ๋ชจ๋ ์ฝ๋๋ฅผ ์ง์ ์์ฑํ๋ฉฐ ๋ฐฐ์์ผ ํ๋ค๊ณ ์๊ฐํ์๋ ๋ถ์ ์ฐธ๊ณ ํด์ฃผ์๊ธธ ๋ฐ๋๋๋ค.