Thumbnail
BEST 개발 · 프로그래밍 웹 개발
따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
(4.9)
123개의 수강평 ∙ 5225명의 수강생

무료

지식공유자 : John Ahn
총 22개 수업˙총 4시간 55분
평생 무제한 수강
수료증 미발급 강의
입문 초급 대상 중급이상
내 목록 추가 공유
초급자를 위해 준비한
[웹 개발, 프레임워크 및 라이브러리] 강의입니다.

이 강의를 통해 리액트와 노드의 개념을 익히는 것뿐만이 아닌 실질적으로 어떻게 웹사이트를 만들 수 있는지를 배울 수 있습니다.

✍️
이런 걸
배워요!
리액트 React JS
몽고 디비 Mongo DB
노드 Node JS
리덕스 Redux

| 강의소개

안녕하세요. 이 강의를 만들게 된 계기는 시중에 보면 리액트와 노드를 설명하는 개념 강의나 Todo Lists를 만드는 강의는 많은데 생각보다 좀 더 큰 웹사이트를 만드는 강의는 많이 못 본 것 같아서 이렇게 이 강의를 만들게 되었습니다.

| 강의에서 만드는 예제

- 메인 페이지

- 상세 비디오 페이지

- 상세 페이지 댓글 , 좋아요 , 구독 기능 

- 이미지 업로드 페이지

| 여기서 다루는 툴

Visual Studio Code를 사용하지만 자신이 원하는 Editor를 사용해도 됩니다. MAC을 사용하지만 윈도우에서도 가능합니다.

| 강의에 대해서

- 비전공자도 들을 수 있나요?

넵 ! 전공자, 비전공자 상관없이 들을 수 있는 강의입니다.


- 왜 노드, 리액트 등을 배워야 하나요?

2019년 Stackoverflow survey 결과를 가져와 봤습니다. 보시다시피 리액트와 노드의 인기는 해가 지나갈수록 점점 높아지고 있기 때문에 배워 두신다면 자신의 커리어 향상에 많은 도움 줄 수 있습니다.

 

- 노드, 리액트을 배우면 어떤 일을 할 수 있나요?

웹 개발자로서 일을 할 수 있습니다.

 

- 이 강의만의 특별한 장점이 있을까요?

하나씩 단계별로 기능을 만들어보면서 자연스럽게 전체 개념과 최신 기술(리액트 훅, 리덕스 등)을 익힐 수 있습니다.

 

🙋🏻‍♂️ 안녕하세요!

최근에 유튜브에서 영어 공부를 하려고 개발 강의를 영어로 찍기 시작했는데 의외로 해외 사람들이 보기 시작하여서 한글로도 이곳에 올리게 되었습니다.

혼자 하나하나 프로젝트를 만들 때 생각보다 자료가 많이 없어서 고생했던 것들을 이곳에서 많은 분과 나누면 좋겠다고 생각하여 이 강의를 시작하게 되었습니다.

 

지식공유자가 알려주는
강의 수강 꿀팁!
🎓
이런 분들께
추천드려요!
즐겁게 따라하며 배우고 싶으신 분
개념과 실질적인 코딩을 함께 배우고 싶으신 분
📚
선수 지식,
필요한가요?
javascript

안녕하세요
John Ahn 입니다.
John Ahn의 썸네일

안녕하세요. 

현재 평범하게 직장 생활하며 

파이썬과 PHP, 그리고 Node 와   

프론트엔드 스택들 리액트, 리덕스 등을 사용하며  

즐겁게 개발 하고 있는 개발자 입니다. 

앞으로 많은 도움을 드릴수 있었으면 좋겠습니다.

커리큘럼 총 22 개 ˙ 4시간 55분의 수업
이 강의는 영상, 수업 노트, 첨부 파일이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 따라하며 배우는 노드, 리액트 시리즈
강의 소개 미리보기 03:12
전체적인 틀 만들고 Mongo DB 연결 11:53
Boiler Plate 강의
비디오 업로드 FORM 만들기 (1) 19:42
비디오 업로드 FORM 만들기 (2) 12:35
Multer로 노드 서버에 비디오 저장하기 13:28
ffmpeg로 비디오 썸네일 생성하기 15:08
비디오 업로드 하기 17:46
랜딩 페이지에 비디오들 나타나게 하기 13:35
비디오 디테일 페이지 만들기 16:02
디테일 비디오 페이지에 Side 비디오 생성 09:11
구독 기능 (1) 20:16
구독 기능 (2) 11:33
구독 비디오 페이지 13:39
댓글 기능 생성 (1) 구조 설명 09:19
댓글 기능 생성 (2) Comment.js 15:52
댓글 기능 생성 (3) SingleComment 25:56
댓글 기능 생성 (4) ReplyComment 21:46
좋아요 싫어요 기능 생성 (1) 구조 설명 04:33
좋아요 싫어요 기능 (2) 템플릿, 데이터 가져오기 19:59
좋아요 싫어요 기능 (3) 클릭시 기능들 20:17
도표 자료 미리보기
강의 게시일 : 2020년 01월 02일 (마지막 업데이트일 : 2020년 01월 21일)
수강평 총 123개
수강생분들이 직접 작성하신 수강평입니다. 수강평을 작성 시 300잎이 적립됩니다.
4.9
123개의 수강평
5점
4점
3점
2점
1점
VIEW 좋아요 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
김태진 thumbnail
완강했어요! 리액트와 노드익스프레스 두가지를 동시에 사용하는 강의가 없어 아쉬웠는데, 이런 강의를 발견하게 되어 기쁜마음으로 보일러 플레이트랑 유튜브 강의 일주일만에 다 들었습니다! 클론 결과물에 대해 아직 자잘하게 남은 에로사항들이 있긴 한데, 어쨋든 한바퀴 다 돌렸습니다. 에로사항은 천천히 고치려구요 ㅎㅎ 그리구 질문에도 친절히 답변해주셔서 감사합니다! 클론강의 만들어주시는대로 수강할게요 ㅎㅎㅎ 감사합니다!
2020-03-22
지식공유자John Ahn
일주일 만에 두 강의를 다 들으셨다니 엄청난 열정이시네요!!! 정말 그러기 쉽지 않을 텐데… 
너무 수고하셨고 애로사항들은 계속 막히시면 질문 주세요 너무 좋은 강의평 써주셔서 진심으로 감사드립니다.
2020-03-23
kangdari_ thumbnail
정말 좋은 강의였습니다. react 뿐만 아니라 기본적인 express와 mongoDB 사용법까지 공부할 수 있었습니다.
2020-03-26
지식공유자John Ahn
좋은 강의평 감사합니다 ^^ 완강하시느라 너무 수고하셨어요 !!!
2020-03-31
wizstudy1004 thumbnail
너무 좋아요
2020-08-27
JK Cho thumbnail
React를 처음 배우는 분들에게 매우 추천하는 강의입니다. React와 NodeJS, MongoDB의 사용법에 대해 전반적으로 배울 수 있습니다. 수업 진행도 매끄럽고(영상의 길이, 목소리, 말 속도 등), 문제가 생겼을 때 질문하면 강의자님께서 친절히 답변해주십니다! 이 강의를 수강하면 하나의 결과물이 확실하게 나오는 것 뿐만 아니라 기능을 더 추가하거나, 다른 사이트를 만들어 보면서 응용하기에도 쉽습니다. 무료로 강의를 올려주셔서 감사드리고, 다른 강의도 기다리겠습니다!
2020-03-23
지식공유자John Ahn
너무나 전문적이게 평가를 써주셨네요 ^^ 진심으로 감사드립니다. 앞으로도 좋은 강의로 찾아뵙겠습니다 ~!!! 감사합니다!
2020-03-23
릴롱궤 thumbnail
기초부터 쭉 달리고 있습니다. 제가 인프런에서 만났던 강의들 중에 베스트인것 같습니다 ㅎㅎ 특별히 좋았던 것은 반복 숙달이었어요 처음에 이해가 잘 안되던 것도 계속 반복하니 어느새 체득하게 되는 것 같습니다 ! react를 이제 조금 알게 된것같습니다. 아 그리고 ㅎㅎㅎㅎ 처음 접하게 되는 메소드들에 대해서 개념설명을 좀 더 자세히 해주시면 더더욱 좋은 강의가 될 것 같습니다! 그리고 질문올리면 정말 성의껏 답변해주셔서 너무너무 감사합니다! 저는 또 쇼핑몰 배우러 갑니다 :)
2020-05-09

무료

내 목록 추가 공유
지식공유자 : John Ahn
총 22개 수업˙총 4시간 55분
평생 무제한 수강
수료증 미발급 강의
입문 초급 대상 중급이상
연관 로드맵
이 강의가 포함된 잘 짜여진 로드맵을 따라 학습해 보세요!
지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의를
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스