Dangdang00/2019ReactStudy

2019 ReactStudy - 참고: 리액트를 다루는 기술(개정)

2019ReactStudy

📚 리액트를 다루는 기술(개정)

📅 2019.11.25 ~

💻 macOS

목차

1장 리액트 시작

• 1.1 왜 리액트인가?
• 1.2 리액트의 특징
• 1.3 작업 환경 설정

2장 JSX

• 2.1 코드 이해하기
• 2.2 JSX란?
• 2.3 JSX의 장점
• 2.4 JSX 문법
  • 2.4.1 감싸인 요소
  • 2.4.2 자바스크립트 표현
  • 2.4.3 if문 대신 조건부 연산자
  • 2.4.4 AND 연산자(&&)를 사용한 조건부 렌더링
  • 2.4.5 undefined를 렌더링하지 않기
  • 2.4.6 인라인 스타일링
  • 2.4.7 class 대신 className
  • 2.4.8 꼭 닫아야 하는 태그
  • 2.4.9 주석
• 2.5 ESLint와 Prettier 적용하기
• 2.6 정리

3장 컴포넌트

• 3.1 클래스형 컴포넌트
• 3.2 첫 컴포넌트 생성
• 3.3 props
  • 3.3.1 JSX 내부에서 props 렌더링
  • 3.3.2 컴포넌트를 사용할 떄 props값 지정하기
  • 3.3.3 props 기본값 설정: defaultProps
  • 3.3.4 태그 사이의 내용을 보여주는 children
  • 3.3.5 비구조화 할당 문법을 통해 props 내부 값 추출하기
  • 3.3.6 propTypes를 통한 props 검증
  • 3.3.7 클래스형 컴포넌트에서 props 사용하기
• 3.4 state
  • 3.4.1 클래스형 컴포넌트의 state
  • 3.4.2 함수형 컴포넌트에서 useState 사용하기
• 3.5 state를 사용할 때 주의 사항
• 3.6 정리

4장 이벤트 핸들링

• 4.1 리액트의 이벤트 시스템
• 4.2 예제로 이벤트 핸들링 익히기
• 4.3 함수형 컴포넌트로 구현해 보기

5장 ref: DOM에 이름 달기

• 5.1 ref는 어떤 상황에서 사용해야할까?
• 5.2 ref 사용
• 5.3 컴포넌트에 ref 달기
• 5.4 정리