[TIL] # 003 (리액트)

Today I Learned

유튜브로 리액트 공부

• 생활코딩 React - 19.3 ~ 19.6강
  create 구현 : contents 변경
• 생활코딩 React 15.1. State 소개 ~ 19.1강 (복습)

리액트 공식문서 영어 독해

• 4. Components and Props 에서
     'Composing Components' 전까지 영어 독해

개념 요약

1. 리액트 state & props

• 상위 컴포넌트의 state 값을 하위 컴포넌트의 props 값으로 전달이 가능하다.
• 여러 개의 목록을 자동으로 생성 할 때 key값을 줘야 하고, key 값의 속성으로는 각각의 목록을 다른것과 구별할 수 있는 식별자를 준다.
• render함수는 어떤 HTML을 그릴 것인가 결정하는 함수이다.
• props나 state 값이 바뀌면 render함수가 호출되어 화면이 다시 그려 진다.
• 이벤트 객체 안에 preventDefalt가 속해 있다.
• this 값이 없을 때 bind를 써서 this 값을 강제로 주입할 수 있다.
• bind는 새로운 함수를 복제한다.

2. 리액트 create 구현

• push는 기존 배열을 변경 시키고, concat은 새로운 배열을 만들기 때문에 리액트에서 새로운 데이터를 추가하는데 적합하다.

3. 공식문서 영어 독해

• 리액트의 컴포넌트는 대문자로 시작해야 된다. 소문자로 시작하면 DOM tag로 인식한다.
• 단어 정리
  capital letter : 대문자
  lowercase letters : 소문자
  requires : 요구하다.
  treats : 처리하다.
  efficiently : 효율적으로
  represent : 나타내다.
  additional : 추가의
  features : 기능
  above : 위에
  equivalent : 동등하다.
  describing : 기술하다.
  arbitrary : 임의적인
  Conceptually : 개념적으로

4. TIP

• 디버깅 중인 소스창에서 ESC를 누르면 아래에 콘솔창이 뜬다.

Tomorrow’s Things to Do

• 생활코딩 React
  19.7. create 구현 : shouldComponentUpdate
  ~ 21. delete 구현 (6강)
• 리액트 공식문서 'Composing Components' 부터 Components and Props 까지 독해