리액트를 위한 타입스크립트
- Published on
- 타입스크립트를 사용하여 리액트 애플리케이션을 개발하는 데 필요한 다양한 주제를 다룹니다.
컴포넌트 속성 타입
타입스크립트로 리액트 컴포넌트의 프롭스를 타이핑하는 방법에 대한 기본적인 가이드와 타입스크립트의 object
, 인터페이스, 타입 등 다양한 특징을 활용한 리액트 Prop 타입 예시들을 제공하는 참고 자료입니다.
함수 컴포넌트
타입스크립트와 리액트를 함께 사용할 때 함수 컴포넌트를 정의하는 방법과 React.FC
와 React.VFC
의 사용을 다루며 이들 간의 차이점과 권장 사용법을 설명합니다.
훅
이 문서는 타입스크립트를 사용하여 리액트 훅을 효과적으로 활용하는 방법을 다루고 있습니다. 여기에는 useState, useCallback, useReducer, useEffect / useLayoutEffect, useRef 등의 기본 훅 사용법부터 커스텀 훅 만들기, 타입스크립트와 리액트 훅을 사용하는 라이브러리 예시까지 포함되어 있습니다.
클래스 컴포넌트
이 문서는 타입스크립트를 사용해 리액트의 클래스 컴포넌트 및 훅을 어떻게 효율적으로 타이핑하고 활용할 수 있는지에 대한 심도 있는 가이드를 제공합니다.
defaultProps 타입
이 문서는 타입스크립트를 사용하여 리액트 컴포넌트에서 defaultProps
를 타이핑하고 사용하는 방법과 defaultProps
가 필요하지 않을 수 있는 상황을 다룹니다.
폼과 이벤트
이 문서는 타입스크립트를 사용하여 리액트에서 폼과 다양한 이벤트를 처리하는 방법을 다루며 InputEvent
와 같은 특정 이벤트에 대한 브라우저 지원 및 대안을 제시합니다.
컨텍스트
리액트에서 컨텍스트를 생성하고 사용하는 방법, 기본값 없이 컨텍스트를 사용하는 방법과 null
을 확인하지 않고 컨텍스트를 안전하게 사용하기 위한 타입 단언과 런타임 검사 방법을 설명합니다.
forwardRef/createRef
리액트의 forwardRef
와 createRef
를 사용하여 컴포넌트 간에 ref를 전달하고 생성하는 방법과 제네릭을 활용한 더 고급진 사용법을 다룹니다.
포털
리액트의 createPortal
을 사용하여 DOM의 다른 부분에 모달과 같은 UI 요소를 렌더링하는 방법과 관련 예시를 설명합니다.
에러 경계
리액트 애플리케이션에서 발생할 수 있는 에러를 처리하기 위해 react-error-boundary
라이브러리를 사용하는 방법과 사용자 정의 에러 경계 컴포넌트를 작성하는 방법을 설명합니다.