Thumbnail
개발 · 프로그래밍 프론트엔드

React & Express 를 이용한 웹 어플리케이션 개발하기 대시보드

(4.8)
134개의 수강평 ∙  17,808명의 수강생

무료

지식공유자: velopert(김 민준)
총 38개 수업 (5시간 45분)
수강기한: 
무제한
수료증: 미발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변이 제공되는 강의입니다
폴더에 추가 공유

초급자를 위해 준비한
[웹 개발, 프론트엔드] 강의입니다.

Velopert 님이 알려주는 ReactJS 강좌 입니다. 최근 각광받는 Javascript 라이브러리인 React 를 소개하고, 사용법을 알려주는 강좌 입니다.

후반부 텍스트 강좌는 취소되었습니다. 이 강좌에서 다루는 내용이 조금 오래되어 새로운 강의로 리뉴얼되었습니다.

새 강의 보기

1. 강좌 소개

자바스크립트 라이브러리 ReactJS 를 학습하는 react 강좌 입니다. 요즘 들어 HOT 한 페이스북에서 개발한 자바스크립트 라이브러리, React.js 에 대하여 알아보고, 직접 사용을 해보면서 기술을 익힐 수 있는 강좌입니다. React.js 의 기본 개념부터 시작해서, 간단한 예제 프로젝트 몇개를 만들어보고, Node.js, MongoDB를 사용하여 Backend 서버를 만드는 방법도 익히고, 최종적으로는 강좌에서 배운 지식들을 결합하여 간단한 웹 어플리케이션 프로젝트를 완성합니다.

- node.js 를 사용해 본 경험이 있으면 학습하기 수월합니다.
- HTML,CSS,JAVASCRIPT 에 대한 이해도가 있는 분께 적합한 강좌입니다.
- 완강 전 입니다. 매주 한두편씩 연재될 예정입니다.
-  2016년 8월에 Webframeworks.kr 에서 진행하는 React.js 코드랩 세미나를 위해 준비한 자료를 토대로 진행합니다

참고 자료

Links
- http://slides.com/minjunkim-1/deck (강의에서 사용되는 슬라이드)
- https://velopert.com/reactjs-tutorials (React.js 텍스트 강좌 목록)

2. 도움되는 분들

  • 평소 React.js 를 학습하고 싶었던 분
  • 웹 프론트엔드 개발자가 되고 싶은 분
  • HTML,JAVASCRIPT,CSS 에 대한 이해도가 있으신 분

3. 강좌 특징

  • 다루는 기술 : 전반적인 Web front-end 기술, Javascript, React.js, node.js
  • 강좌 수준 : 초급~중급
  • 사전 지식: HTML,CSS,Javascript 에 대한 기본적인 이해가 필요합니다.
  • node.js 를 경험해보신 분이라면 더욱 좋아요.

4. 강사 소개

김민준

트렌디한 IT기술을 지향(하려고 노력)하는 개발자, 김민준입니다. Github이나 블로그에서는 velopert로 활동하고 있습니다. React.js 라이브러리를 매우 좋아하며, 국내에서 이 라이브러리의 인기를 한층 더 높이겠다는 다짐으로 자료를 만들고 있습니다.

안녕하세요
velopert(김 민준) 입니다.
velopert(김 민준)의 썸네일
커리큘럼 총 38 개 ˙ 5시간 45분의 수업
이 강의는 영상, 수업 노트가 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 섹션 1. 오리엔테이션, ReactJS 소개
강좌 소개 05:11
React.JS 소개 미리보기 09:19
React.js 장점과 단점 08:55
섹션 1. 섹션 2. React.js 시작하기
Codepen 설정 , ES6 클래스 04:46
JSX의 특징 06:54
props 07:23
state 08:54
컴포넌트 매핑 (Component Mapping) 11:15
섹션 2. 섹션 3. 개발환경 설정, 프로젝트 진행
작업환경 설정하기 미리보기 06:51
React Project 만들기 | NPM, WEBPACK 24:03
Hot Module Replacement | React Hot Loader 08:08
섹션 3. 섹션 4. 주소록 (Contact) 만들기
Contact 검색기능 구현 | input, sort, filter 미리보기 12:14
Contact 선택기능 구현 | React.js 기초개념 응용 09:12
state 내부 배열 처리하기 | Immutability Helper / ES6 spread 미리보기 13:36
Contact 추가/삭제/수정 기능 구현 | Immutability Helper 적용하기 05:35
Contact 데이터 추가기능 구현 | 컴포넌트 응용 09:03
Contact 데이터 삭제/수정 기능 구현 | 컴포넌트 응용 13:51
Contact 엑스트라 기능 구현 i | KeyPress, ref 07:33
Component LifeCycle API 미리보기 07:03
Contact 데이터 새로고침해도 유지하기 | localStorage 07:52
섹션 6. MEMOAPP 만들기
강의 게시일 : 2016년 08월 14일 (마지막 업데이트일 : 2018년 09월 03일)
수강평 총 134개
수강생분들이 직접 작성하신 수강평입니다.
4.8
134개의 수강평
5점
4점
3점
2점
1점
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
세인트 thumbnail
5
좋은강의감사합니다.
2019-12-02
Eun thumbnail
5
무료강의라서 필요한 부분만 골라 보았는데 참고가 잘 되었습니다. 본 강의는 좀 옛날 내용이라서 참고하셔야 할 것 같습니다.
2022-07-17
우걱다짐 thumbnail
5
이 강좌로 리액트 입문 시작했어요. 지루하지 않게 설명도 최대한 깔끔하게 해주시는 편이고.. 목소리도 여러 후기들 말씀대로 듣기 정말 편하네요 ㅎㅎㅎ 꿀성대 인정합니다!! 짜임새 있는 커리큘럼과 특정 개념을 이해하도록 의도한 예제들이 너무 마음에 듭니다. 아마 이것만 혼자서 반복해도 리액트 실력이 올라갈 것 같네요. 그리고 강사님이 쓰신 "리액트를 다루는 기술" 도서도 샀습니다. 서점 가서 다 비교해보고 샀는데, 100% 풀컬러는 아니지만 그래도 컬러풀한 느낌이 들기도 하고 교재에 예제도 풍부해서 이 강좌 끝나고 교재 보는 것도 좋을 것 같습니다. 감사합니다.
2019-03-22
sjoh thumbnail
5
리엑트로 기본적인 문법과 샘플을 만들어 보면서 익히게 되니 도움이 되네요. 다음에는 node.js와 react 간 데이터 전송도 있었으면 좋겠네요.
2023-11-24
김현수 thumbnail
5
너무유익했습니다 감사합니다~!
2023-02-27