useImperativeHandle은 ref로 노출되는 핸들을 커스터마이징할 수 있도록 해주는 리액트 훅이에요. useImperativeHandle(ref, createHandle, dependencies?) Reference | 레퍼런스 useImperativeHandle(ref, createHandle, dependencies?) 노출된 ref 핸들을 커스터마이징하려면 최상위 컴포넌트에서 useImperativeHandle을 호출하세요. import { forwardRef, useImperativeHandle } from 'react'; const MyInput = forwardRef(function MyInput(props, ref) { useImperativeHandle(ref, () => { r..
리액트
useId는 접근성 속성에 전달할 수 있는 고유한 ID를 생성하는 리액트 훅이에요. const id = useId(); Reference | 레퍼런스 useId() 고유 ID를 생성하려면 최상위 컴포넌트에서 useId를 호출하세요. import { useId } from 'react'; function PasswordField() { const passwordHintId = useId(); // ... } 더 많은 예시를 보려면 아래 예시들을 참고하세요. Parameters | 매개변수(파라미터) useId는 어떤 매개변수도 받지 않아요. Returns | 반환값 useId는 해당 컴포넌트에서 특정한 useId 호출과 연관된 고유 ID 문자열을 반환해요. Caveats | 주의사항 useId는 훅이기 때..
useEffect는 외부 시스템과 컴포넌트의 싱크를 맞춰주는 훅이에요. useEffect(setup, dependencies?) Reference | 레퍼런스 useEffect(setup, dependencies?) 이펙트(Effect)를 선언하기 위해서는 컴포넌트 최상단에서 useEffect를 선언하세요. import { useEffect } from 'react'; import { createConnection } from './chat.js'; function ChatRoom({ roomId }) { const [serverUrl, setServerUrl] = useState('https://localhost:1234'); useEffect(() => { const connection = creat..
카나리아 테스트 use 훅은 현재 React의 Canary과 실험실 채널에서만 사용할 수 있어요. 리액트의 릴리즈된 채널에 대해서 알아보려면 여기를 눌러주세요. use는 Promise나 context 같은 리소스 값을 읽게 도와주는 리액트 훅이에요. const value = use(resource); Reference | 레퍼런스 use(resource) Promise나 context 같이 리소스 값을 읽어오려면 컴포넌트에서 use를 호출하세요. import { use } from 'react'; function MessageComponent({ messagePromise }) { const message = use(messagePromise); const theme = use(ThemeContext);..
본 섹션은 리액트 사용자를 위한 자세한 참고 자료에요. 리액트에 대한 소개를 보고 싶다면 '리액트 배우기'를 참고해주세요. 리액트 공식 문서는 기능에 따라 세부 섹션으로 분리되어 있어요. React | 리액트 리액트 기능들 : 훅 (Hooks) - 컴포넌트에 따른 리액트의 다양한 기능을 사용하세요. 컴포넌트 (Components) - JSX에서 사용할 수 있는 내장 컴포넌트에 대한 문서에요. APIs (APIs) - 컴포넌트를 정의하는데 유용한 API들이에요. Directives (Directives) - 리액트 서버 컴포넌트와 호환되는 번들에 대한 명령어에요. React DOM | 리액트 돔 리액트 돔은 브라우저 돔 환경에서 동작하는 웹 어플리케이션에서만 지원되는 기능을 포함해요. 이 섹션은 다음과 같..