Thumbnail
BEST 개발 ・ 프로그래밍 웹 개발
리액트로 나만의 블로그 만들기(MERN Stack)
(4.6)
14개의 수강평 ∙ 211명의 수강생

29,700원

지식공유자 : 싸플
총 66개 수업˙총 13시간 52분
평생 무제한 수강
수료증 발급 강의
중급이상 대상
이 강의는 멘토링 신청이 가능합니다.
멘토링은 수강 신청과 별개로 운영되며, 수강생이 아니어도 신청할 수 있습니다.
내 목록 추가 176 공유
중급자를 위해 준비한
[개발 ・ 프로그래밍] 강의입니다.

풀스택으로 나만의 블로그를 만들어 보아요~~!

✍️
이런 걸
배워요!
Mongo DB
Express
React
NodeJS
Redux, Redux-Saga
JWT Web Token
Infinite Scroll(Intersection Observer)
CKEditor5
CSS(BootStrap4)
Https(GreenLock Express)

자바스크립트 하나로 풀스택 개발 OK!
나만의 블로그를 직접 만들어보세요.

주제 소개 📝

백엔드(서버)와 프론트(웹 화면)을 한 사람이 모두 만들 수 있는 기술을 풀스택(Full Stack)이라 합니다. 풀스택 기술은 다양하게 구현할 수 있지만, 우리는 자바스크립트를 이용하여 백엔드(NodeJS, Express, MongoDB)와 프론트(React, Redux, Redux-Saga, Bootstrap, Ckeditor5 등)을 만들어 볼 것입니다. 

왜 배워야 하는지 ✒️

여러분, 자바스크립트로 하나로 모든 걸 만들 수 있다면 믿어지세요? @.@
자바스크립트 풀스택 개발자가 되면 여러분의 모든 아이디어는 바로 현실이 되며, 수익창출로 이어집니다. 

덤으로!!!
프론트엔드 개발 라이브러리인 React를 배우면 React로 모바일 앱(안드로이드, 아이폰)을 만드는 React Native까지 쉽게 접근할 수 있다는 사실!!!

여러분의 머리속 아이디어는 더 이상 단순한 상상이 아닙니다.
지금 당장!!! 현실세계에 여러분들의 생각의 나래를 펼치세요. 

코딩은 나의 상상을 현실화 시켜주는 도구 입니다~~~ *^^*

이 강의에서 배우는 것들 ✏️

Infinite Scroll

Category Search

CKEditor5

Comment

이밖에 MongoDB, Express, React, Node JS(이상 MERN Stack), Redux, Redux-Saga, JWT Web Token, Bootstrap4를 배우게 됩니다.

강의 특징 💡 

웹 개발자는 기본적으로 자신의 지식과 기술을 저장해 놓을 블로그가 필요합니다.
하지만... 웹개발하신다면서... 아직 나의 기술로 만든 블로그가 없다고요? 그러면 한번 따라서 만들어보세요. 

이 강의는 HTML, CSS 등 막 입문하신 분들을 대상으로 만들어져, 비교적 상세히 개념들을 설명하고 있습니다. 

이 강의는 교육을 위한 사이트를 만드는 것이 아니라, 현재 제가 실제 운영하고 있는

블로그(https://www.ssaple.net/)를 그대로 만들어 보는 것이기에 실제 활용가치가 높습니다. 

여러분만의 블로그를 만들고 지금부터 키워나가 보세요~~~
(깃허브 : https://github.com/sideproject0214/blog)

섹션마다 간단한 소개 📖

< 총 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 🙋🏻‍♂️ 

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번이라도 만들어보신분
웹 코딩을 빠르게 배우고 싶으신분

안녕하세요
싸플 입니다.
싸플의 썸네일

낮에는 평범한 회사원이지만, 밤에는 열정을 가진 개발자 입니다

커리큘럼 총 66개 ˙ 13시간 52분의 수업
이 강의는 영상, 수업 노트, 미션이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. Intro
섹션 1. Backend
(02) NodeJS Install 미리보기 03:09 (03) Git, VScode Install, Npm Init 미리보기 04:53 (04) Express, Babel, Mongoose Install 미리보기 10:17
(05) Express Start 08:32
(06) MongoDB Modeling(1) 10:27
(07) MongoDB Modeling(2) 09:26
(08) MongoDB Cluster Connect 12:28
(09) Router(1) 18:25
(10) Router(2) 06:02
(11) UserRoutes 18:52
(12) Auth Middleware 09:36
(13) Auth Routes 13:58
섹션 2. Front
(14) CRA & Redux(1) 미리보기 04:06 (15) CRA & Redux(2) 미리보기 07:16
(16) CRA & Redux(3) 19:48
(17) Router Basic Setting 17:36
(18) Footer 11:55
(19) Header(1) 09:18
(20) Header(2) 13:47
(21) Header(3) - Reducer Setting 15:46
(22) Header(4) - LoginModal(1) 10:54
(23) Header(4) - LoginModal(2) 23:17
(24) Header(5) - AppNavBar Auth 14:06
(25) Header(6) - Register Modal(1) 22:16
(26) Header(6) - Register Modal(2) 13:44
(27) UserLoading 14:54
(28) Header(7) / history@^4.7.2 09:49
(29) Router 15:37
(30) PostCardList(1) 14:47
(31) PostCardList(2) 31:35
(32) CKEditor5 Webpack Setting(1) 06:23
(33) CKEditor5 Webpack Setting(2) 08:36
(34) CKEditor5 EditorConfig 08:05
(35) AWS Setting 05:58
(36) Server Image Router 11:31
(37) CKEditor Final Setting 04:01
(38) CKEditor5 For React 17:00
(39) CKEditor GetDataFromCKEditor5 21:23
(40) Post Route 14:36
(41) Post Upload Saga 11:07
(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
(Code Challenge) Login 후 바로 Profile 수정하려면?
(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
(59-1) Infinite Scroll Bug Fixed 06:58
(60) Final Clear Up 02:33
섹션 3. Deploy
(61) Deploy(1) 12:23
(62) Deploy(2) 17:19
(63) FINAL 01:41
섹션 4. Bonus
(64) Https(GreenLock Express) 15:52
강의 게시일 : 2020년 08월 19일 (마지막 업데이트일 : 2020년 09월 06일)
수강평 총 14개
수강생분들이 직접 작성하신 수강평입니다. 수강평을 작성 시 300잎이 적립됩니다.
4.6
14개의 수강평
5점
4점
3점
2점
1점
VIEW 좋아요 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
gzero thumbnail
👍👍👍👍👍👍
2021-01-08
손동찬 thumbnail
좋습니다 !
2021-01-03
sutt2000 thumbnail
댓글보고 구입했어요~ 강의은 아직 제대로 보진 않음``
2021-01-02
이선희 thumbnail
설명을 따라하기 쉽게 해줘서 수업을 진행하는데 매우 만족합니다.
2020-12-26
둘리스 thumbnail
정말 좋은 강의 감사합니다. 그런데 너무 외로운 배움이네요...여러가지 하다보니, 정리가 안되네요...정리하면서 다시 봐야겠군요.
2020-12-14

29,700원

내 목록 추가 176 공유
지식공유자 : 싸플
총 66개 수업˙총 13시간 52분
평생 무제한 수강
수료증 발급 강의
중급이상 대상
이 강의는 멘토링 신청이 가능합니다.
멘토링은 수강 신청과 별개로 운영되며, 수강생이 아니어도 신청할 수 있습니다.
수강 전 궁금한 점이 있나요?
문의하기
문의
지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의들을
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스