전체 글

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..

useDeferredValue는 UI의 일부 업데이트를 늦춰주는 리액트 훅이에요. const deferredValue = useDeferredValue(value) Reference | 레퍼런스 useDeferredValue(value) 값의 연기된 버전을 얻으려면 컴포넌트의 최상위에서 useDeferredValue를 호출하세요. import { useDeferredValue, useState } from "react"; function SearchPage(){ const [query, setQuery] = useState(''); const deferredQuery = useDeferredValue(query); // ... } Parameters | 매개변수(파라미터) value : 연기하고 싶은 값..

useDebugValue는 리액트 DevTools에서 커스텀훅에 라벨을 추가해주는 훅이에요. useDebugValue(value, format?) Reference useDebugValue(value, format?) 읽을 수 있는 디버깅 값을 보여주려면 커스텀훅의 최상위에서 useDebugValue를 호출하세요. function useOnlineStatus(){ // .... useDebugValue(isOnline ? 'Online' : 'Offline'); // .... } Parameters | 파라미터(매개변수) value : 리액트 DevTools에서 보여주고 싶은 값. 어떤 타입의 값을 넣어도 된다. format (선택적) : 포맷팅을 해주는 함수. 컴포넌트가 검사될 때, 리액트 DevToo..