ํ์คํ์ผ๋ก ๋๋ง์ ๋ธ๋ก๊ทธ๋ฅผ ๋ง๋ค์ด ๋ณด์์~~!
Mongo DB
Express
React
NodeJS
Redux, Redux-Saga
JWT Web Token
Infinite Scroll(Intersection Observer)
CKEditor5
CSS(BootStrap4)
Https(GreenLock Express)
์ ๊ฐ์ ๋ฐ ๋ก๋๋งต ์คํํ์ต๋๋ค! ์ ๊ฐ์๋ >๋งํฌ< ์ฐธ๊ณ ํ์ธ์
Docker๋ก ๊ฐ๋ฐ๋ถํฐ ๋ฐฐํฌ๊น์ง,Terraform์ผ๋ก ์ฟ ๋ฒ๋คํฐ์ค ์ด์์ ์๊ณ ์ถ๋ค๋ฉด ๊ณ ๊ณ ~!!!
์๋ก ์ถ์ํ Node FullStack ๊ฐ๋ฐ ๋ก๋๋งต, A~Z ๊น์ง ๋ก๋๋งต ์ฐธ์ฌ์ ๊ด๋ จ ๊ฐ์ 20% ํ ์ธ ์ฟ ํฐ์ ๋๋ฆฝ๋๋ค
ํ ์ธ ์ฟ ํฐ ๋ฐ์ผ๋ฌ >Go! <
๋ฐฑ์๋(์๋ฒ)์ ํ๋ก ํธ(์น ํ๋ฉด)์ ํ ์ฌ๋์ด ๋ชจ๋ ๋ง๋ค ์ ์๋ ๊ธฐ์ ์ ํ์คํ(Full Stack)์ด๋ผ ํฉ๋๋ค. ํ์คํ ๊ธฐ์ ์ ๋ค์ํ๊ฒ ๊ตฌํํ ์ ์์ง๋ง, ์ฐ๋ฆฌ๋ ์๋ฐ์คํฌ๋ฆฝํธ๋ฅผ ์ด์ฉํ์ฌ ๋ฐฑ์๋(NodeJS, Express, MongoDB)์ ํ๋ก ํธ(React, Redux, Redux-Saga, Bootstrap, Ckeditor5 ๋ฑ)์ ๋ง๋ค์ด ๋ณผ ๊ฒ์ ๋๋ค.
์ฌ๋ฌ๋ถ, ์๋ฐ์คํฌ๋ฆฝํธ๋ก ํ๋๋ก ๋ชจ๋ ๊ฑธ ๋ง๋ค ์ ์๋ค๋ฉด ๋ฏฟ์ด์ง์ธ์? @.@
์๋ฐ์คํฌ๋ฆฝํธ ํ์คํ ๊ฐ๋ฐ์๊ฐ ๋๋ฉด ์ฌ๋ฌ๋ถ์ ๋ชจ๋ ์์ด๋์ด๋ ๋ฐ๋ก ํ์ค์ด ๋๋ฉฐ, ์์ต์ฐฝ์ถ๋ก ์ด์ด์ง๋๋ค.
๋ค์ผ๋ก!!!
ํ๋ก ํธ์๋ ๊ฐ๋ฐ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ธ React๋ฅผ ๋ฐฐ์ฐ๋ฉด React๋ก ๋ชจ๋ฐ์ผ ์ฑ(์๋๋ก์ด๋, ์์ดํฐ)์ ๋ง๋๋ React Native๊น์ง ์ฝ๊ฒ ์ ๊ทผํ ์ ์๋ค๋ ์ฌ์ค!!!
์ฌ๋ฌ๋ถ์ ๋จธ๋ฆฌ์ ์์ด๋์ด๋ ๋ ์ด์ ๋จ์ํ ์์์ด ์๋๋๋ค.
์ง๊ธ ๋น์ฅ!!! ํ์ค์ธ๊ณ์ ์ฌ๋ฌ๋ถ๋ค์ ์๊ฐ์ ๋๋๋ฅผ ํผ์น์ธ์.
์ฝ๋ฉ์ ๋์ ์์์ ํ์คํ ์์ผ์ฃผ๋ ๋๊ตฌ ์ ๋๋ค~~~ *^^*
์ด๋ฐ์ MongoDB, Express, React, Node JS(์ด์ MERN Stack), Redux, Redux-Saga, JWT Web Token, Bootstrap4๋ฅผ ๋ฐฐ์ฐ๊ฒ ๋ฉ๋๋ค.
์น ๊ฐ๋ฐ์๋ ๊ธฐ๋ณธ์ ์ผ๋ก ์์ ์ ์ง์๊ณผ ๊ธฐ์ ์ ์ ์ฅํด ๋์ ๋ธ๋ก๊ทธ๊ฐ ํ์ํฉ๋๋ค.
ํ์ง๋ง... ์น๊ฐ๋ฐํ์ ๋ค๋ฉด์... ์์ง ๋์ ๊ธฐ์ ๋ก ๋ง๋ ๋ธ๋ก๊ทธ๊ฐ ์๋ค๊ณ ์? ๊ทธ๋ฌ๋ฉด ํ๋ฒ ๋ฐ๋ผ์ ๋ง๋ค์ด๋ณด์ธ์.
์ด ๊ฐ์๋ HTML, CSS ๋ฑ ๋ง ์ ๋ฌธํ์ ๋ถ๋ค์ ๋์์ผ๋ก ๋ง๋ค์ด์ ธ, ๋น๊ต์ ์์ธํ ๊ฐ๋ ๋ค์ ์ค๋ช ํ๊ณ ์์ต๋๋ค.
์ฌ๋ฌ๋ถ๋ง์ ๋ธ๋ก๊ทธ๋ฅผ ๋ง๋ค๊ณ ์ง๊ธ๋ถํฐ ํค์๋๊ฐ ๋ณด์ธ์~~~
(๊นํ๋ธ : https://github.com/sideproject0214/blog)
์ธํ์ ์ต์ ๊ฐ์ ์ ๋ณด๋ blog.ssaple.com ์์ ํ์ธํ์ธ์~
< ์ด 63๊ฐ ๊ฐ์, 815๋ถ >
Section 1 (๊ฐ์ 1๊ฐ, 4๋ถ)
*์ธํธ๋ก: ๊ธฐ๋ณธ MERN ์คํ์ ๊ดํ ๊ฐ์์ ์์ผ๋ก ๋ฐฐ์ธ ๊ธฐ์ ์๊ฐ
Section 2 (๊ฐ์ 12๊ฐ, 126๋ถ)
*Express(๋ฐฑ์๋), Router, MongoDB ๋ฑ ๊ธฐ๋ณธ ์๋ฒ์์
Section 3 (๊ฐ์ 47๊ฐ, 653๋ถ)
*React, Redux ๋ฑ์ ํ์ํ ํ๋ก ํธ์๋ ์์
๊ณผ ์ด์ ๋ง์ถ ๋ฐฑ์๋ ์์
Section 4 (๊ฐ์ 3๊ฐ, 32๋ถ)
*AWS Deploy ์์
Bonus (๊ฐ์ 1๊ฐ, 15๋ถ)
*Https(GreenLock Express)
MongoDB, Express, React, NodeJS, Redux, Redux-Saga, JWT Web Token, Infinite Scroll(Intersection Observer), CKEditor5, BootStrap4
*์ปดํจํฐ ์ฌ์: ๋ฆฌ๋ ์ค, ๋งฅ, ์๋์ฐ
Q. ๋น์ ๊ณต์๋ ๋ค์ ์ ์๋์?
A. ๋ค ๋น์ฐํฉ๋๋ค. ์๋ํ๋ฉด ์ ๊ฐ ๋น์ ๊ณต์๋ก ์ฌ๋ฌ๋ถ๋ค์ฒ๋ผ ์ธํฐ๋ท์ผ๋ก ๋
ํํ์์ต๋๋ค. ๋ค๋ง ์ฒ์ ์
๋ฌธํ์๋ ๋ถ์ด๋ผ๋ฉด, ๋ฆฌ์กํธ ์์ต์(https://ko.reactjs.org/tutorial/tutorial.html#completing-the-game)๋ฅผ ๋ณด์๊ณ ์ค์๋ ๊ฒ์ ์ถ์ฒ๋๋ฆฝ๋๋ค.
Q. ๋ฆฌ์กํธ๋ ์ด๋ ต๋์?
A. ๋ฆฌ์กํธ ์์ฒด๋ ์ด๋ ต์ง ์์ต๋๋ค. ๋ค๋ง, ๋ฌธ์ ๋ ๋ฆฌ๋์ค์ธ๋ฐ, ๋ฆฌ๋์ค๋ถํฐ ๋์ด๋๊ฐ ๊ธ์์นํ๊ธฐ์ ๋ฆฌ์กํธ๊ฐ ์ด๋ ต๋ค๋ ํธ๊ฒฌ๋ ์กด์ฌํ๋ ๊ฒ์ ์ฌ์ค์ ๋๋ค. ๋ฆฌ๋์ค ์์ด ๋ง๋ค์๋ ์์ผ๋ ์ฌ์ดํธ ๊ท๋ชจ๊ฐ ์ปค์ง์๋ก ์ํ๊ด๋ฆฌ์ ์ด๋ ค์์ด ๋ฐ์ํ๋ฏ๋ก ๊ฑฐ์ ํ์(?)์ ์ผ๋ก Redux, Mobx๋ฑ์ ์ฌ์ฉํ๊ฒ ๋ฉ๋๋ค.
์ด ๋จ๊ณ๋ง ๋๊ธฐ๋ฉด ์์ ์์ฌ๋ก ์ฌ์ดํธ๋ฅผ ๋ง๋ค์ ์์ผ๋ ํฌ๊ธฐํ์ง ์์ผ์๋ฉด ์ข๊ฒ ์ต๋๋ค. *^^*
Q. MERN Stack์ ๋ฌด์์ธ๊ฐ์?
A. ์๋ฐ์คํฌ๋ฆฝํธ ์ธ์ด ํ๊ฐ๋ก MongoDB, Express, React, NodeJS(MERN) ์ ์ฌ์ฉํ์ฌ ์๋ฒ(๋ฐฑ์๋), ์น(ํ๋ก ํธ)๋ฅผ ๋ชจ๋ ๋ง๋๋ ๊ธฐ์ ์ ์๋ฏธํฉ๋๋ค.
Q. ์ด ๊ฐ์๋ง์ ํน๋ณํ ์ฅ์ ์ด ์์๊น์?
A. ์ ๋ ์ฌ๋ฌ๋ถ์ฒ๋ผ ์ธํ๋ฐ ๋ฑ ์ธํฐ๋ท์ผ๋ก ๋
ํ์ ํ์๊ธฐ์, ๊ธฐ์กด ๊ฐ์์์ ๋๋ ์์ฌ์ด ์ ์ ๋ณด์ํ์ฌ ์
๋ฌธํ์๋ ์ฌ๋ฌ๋ถ์ ์
์ฅ์์ ๊ฐ์๋ฅผ ์งํํ์์ต๋๋ค.
ํ์ต ๋์์
๋๊ตฌ์ผ๊น์?
์น๊ธฐ์ด์ง์(HTML, CSS)๋ฅผ ์์๋ ๋ถ
์๋ฐ์คํฌ๋ฆฝํธ ๊ธฐ์ด("console.log"๋ฅผ ์์๋ ๋ถ)
๋ฆฌ์กํธ, Express๊ธฐ์ด๋ฅผ ์์๋๋ถ
๋ฆฌ์กํธ To-do list 1๋ฒ์ด๋ผ๋ ๋ง๋ค์ด๋ณด์ ๋ถ
์น ์ฝ๋ฉ์ ๋น ๋ฅด๊ฒ ๋ฐฐ์ฐ๊ณ ์ถ์ผ์ ๋ถ
572
๋ช
์๊ฐ์
30
๊ฐ
์๊ฐํ
271
๊ฐ
๋ต๋ณ
4.0
์
๊ฐ์ ํ์
4
๊ฐ
๊ฐ์
๋ฎ์๋ ํ๋ฒํ ํ์ฌ์์ด์ง๋ง, ๋ฐค์๋ ์ด์ ์ ๊ฐ์ง ๊ฐ๋ฐ์ ์ ๋๋ค
์ ์ฒด
66๊ฐ โ (13์๊ฐ 52๋ถ)
(01) Intro
04:09
(02) NodeJS Install
03:09
(05) Express Start
08:32
(09) Router(1)
18:25
(10) Router(2)
06:02
(11) UserRoutes
18:52
(12) Auth Middleware
09:36
(13) Auth Routes
13:58
(14) CRA & Redux(1)
04:06
(15) CRA & Redux(2)
07:16
(16) CRA & Redux(3)
19:48
(18) Footer
11:55
(19) Header(1)
09:18
(20) Header(2)
13:47
(27) UserLoading
14:54
(29) Router
15:37
(30) PostCardList(1)
14:47
(31) PostCardList(2)
31:35
(35) AWS Setting
05:58
(40) Post Route
14:36
(42) Post Detail(1)
19:08
(43) Post Detail(2)
11:05
(44) Post Detail(3)
10:54
(45) Post Detail(4)
08:36
(46) Comment Reducer
08:42
(47) Comment Saga
21:54
(48) Comment Front
26:43
(49) Post Delete
11:08
(50) Post Edit(1)
07:27
(51) Post Edit(2)
14:49
(52) Post Edit(3)
13:21
(53) Category(1)
14:15
(54) Category(2)
10:00
(55) Category(3)
05:14
(56) Search
21:36
(57) Profile(1)
14:16
(58) Profile(2)
21:40
(59) Infinite Scroll
25:06
(60) Final Clear Up
02:33