생활코딩 - 리액트 (React) ver.2020
본 수업은 리액트 (React)를 처음 시작하는 분들에게 권하는 리액트 (React) 입문용 생활코딩 수업입니다.
클래스 소개
난이도
보통
카테고리
웹 프로그래밍 - 프로그래밍
태그
리액트, 자바스크립트
추천 학습대상
- 리액트를 통해서 재사용 가능한 사용자 정의 태그(컴포넌트)를 만들고 싶은 분
- single page application을 구현하고 싶은 분
- 자바스크립트를 공부한 뒤 새로운 라이브러리를 사용해보고 싶은 분
- 리액트가 왜 인기있는지 확인해보고 싶으신 분
- single page application을 구현하고 싶은 분
- 자바스크립트를 공부한 뒤 새로운 라이브러리를 사용해보고 싶은 분
- 리액트가 왜 인기있는지 확인해보고 싶으신 분
#구름EDU 수강자 분들을 위해 생활코딩(https://opentutorials.org)이 함께 합니다. 항상 좋은 지식을 전해주시는 생활코딩에 감사드립니다.
📝수업 소개
🐣이 수업은 리액트(react) 입문자를 위한 내용으로 이루어져 있습니다. 리액트를 사용하는 이유를 설명하고, 리액트 컴포넌트를 만드는 방법, 리액트와 불변(immutable) 사이의 관계를 설명합니다. 본 강좌에서는 데이터베이스, 서버와의 연동, redux는 설명하고 있지 않으니 참고해주시기 바랍니다.
🎯학습 목표
- 리액트의 기본적인 사용법을 알고 다룰 수 있습니다.
- 리액트 컴포넌트를 만들고 유용하게 사용할 수 있습니다.
- 리액트와 불변의 관계를 이해합니다.
📣참고 사항
본 수업은 기술 자료가 부족한 언어로 번역할 계획이기 때문에 부득이하게 본문에 영어를 사용했으니 양해 부탁드립니다.
✍강의자 소개
생활코딩(이고잉)
- 약 10만 멤버로 구성된 개발 커뮤니티 생활코딩 운영
- 일반인들에게 프로그래밍을 알려주는 무료 온라인, 오프라인 수업을 제공
이 클래스는 모든 수업을 자유롭게 체험해 볼 수 있습니다.
교육 과정
모두 펼치기
- 01개발환경
- 02컴포넌트 제작
- 03state
- 04이벤트
- 05Create 기능 구현
- 06Update 기능 구현
- 07수업을 마치며
오리엔테이션
React.js 개발환경의 종류
npm을 이용해서 create-react-app 설치하기
create-react-app을 이용해서 개발환경 구축
샘플 앱 실행하기
JavaScript 코딩하는 법
CSS 코딩하는 법
배포하는 법
리액트가 없다면
컴포넌트 만들기 1
컴포넌트 만들기 2
props
React Developer Tools
Component 파일로 분리하기
State 소개
State 사용
key
이벤트 state props 그리고 render 함수
이벤트 설치
이벤트에서 state 변경하기
이벤트 bind 함수 이해하기
이벤트 setState 함수 이해하기
컴포넌트 이벤트 만들기 1
컴포넌트 이벤트 만들기 2
컴포넌트 이벤트 만들기 3
베이스 캠프
Create 구현 : 소개
Create 구현 : mode 변경 기능
Create 구현 : mode 전환 기능
Create 구현 : form
Create 구현 : onSubmit 이벤트
Create 구현 : Content 변경
Create 구현 : ShouldComponentUpdate 소개
Create 구현 : Immutable (불변)
update 구현
update 구현 : form
update 구현 : state 변경
delete 구현
수업을 마치며
마지막 업데이트|2020년 01월 06일
강좌 후기
무료
평균평점
5.0
난이도
보통
수강기간
평생 무제한