React 컴포넌트 타입은 Props, State, Event 경계를 나눈다
컴포넌트가 받는 값, 내부 상태, 사용자 상호작용 타입을 분리하면 UI 계약과 입력 처리가 안전해진다.
필수·선택 속성과 children 계약을 정의한다.
초기값과 변경 가능한 범위를 일관되게 둔다.
ChangeEvent, MouseEvent처럼 DOM 이벤트 형태를 명시한다.
| 구분 | 의미 | 판단 |
|---|---|---|
| props contract | 외부 입력 문서화 | 잘못된 prop을 실행 전에 잡는다. |
| state union | loading/success/error | UI 분기를 타입으로 드러낸다. |
| event handler | 대상 요소 타입 | value 접근 실수를 줄인다. |
핵심 React에서 TypeScript를 쓰는 이유는 컴포넌트 경계를 문서화하고 잘못된 prop이나 이벤트 접근을 실행 전에 잡기 위해서다.