State VS Props

1. state VS props

• props는 외부로부터 전달받은 값
• state는 내부에서 변화하는 값
• State가 변경되면, re-rendering을 통한 화면 업데이트가 일어난다.

2. useState

• React에서는 state를 다루는 방법 중 하나로 useState라는 특별한 함수를 사용한다.
  import {useState} from ‘react’;
• useState의 전달인자는 state의 초기값이다.
• useState의 전달인자는 하나만 전달할 수 있다.
• useState가 반환하는 두번째 요소는 첫번째 요소인 state를 갱신할 수 있는 함수다.
• useState 함수를 호출하면 배열을 반환한다. 그래서 state를 선언할때 {name,SetName}이라고 하면 안된다!
  const [state저장변수, state 갱신 함수 ] = useState(상태 초기 값);

3. props의 전달방법 2가지

<Component attribute = {value} >
또는
<Compoent> 태그와 태그 사이 전달하기 </Component>

4. 이름 지정할 때 주의점

let PascalCase 📐
let camelCase 🐫
let snake_case 🐍

• props를 지정할 때 'props'라는 이름을 쓰면 안된다.
• event이름을 설정할때는 camelCase로 설정해야한다.
• PascalCase를 쓸때는 컴포넌트 이름을 설정할 때이다. → 소문자로 시작하면 HTML 엘리먼트로 인식!