개발일지

📌 useEffect란?useEffect는 컴포넌트를 외부 시스템과 동기화할 수 있는 React훅입니다.useEffect(setup, dependencies?)📌 useEffect컴포넌트의 최상위 레벨에서 useEffect를 호출하여 Effect를 선언합니다:import { useEffect } from 'react';import { createConnection } from './chat.js';function ChatRoom({ roomId }) { const [serverUrl, setServerUrl] = useState('https://localhost:1234'); useEffect(() => { const connection = createConnection(serverUrl, ..

📌 useReducerimport { useReducer } from 'react';function reducer(state, action) { // ...}function MyComponent() { const [state, dispatch] = useReducer(reducer, { age: 42 }); // ...  📍매개변수reducerinitialArg선택적 init📍반환값useReducer는 정확히 두 개의 값을 가진 배열을 반환합니다:1. 현재 state. 첫 번째 렌더링 중에는 init(initialArg) 또는 (init이 없는 경우) initialArg로 설정됩니다.2. state를 다른 값으로 업데이트하고 렌더링을 촉발할 수 있는 dispatch function.* useR..

📌 useContext란?useRef는 렌더링에 필요하지 않은 값을 참조할 수 있는 React훅입니다.const ref = useRef(initialValue)📌 useContext컴포넌트 최상위 레벨에서 useRef를 호출하여 ref를 선언합니다.import { useRef } from 'react';function MyComponent() { const intervalRef = useRef(0); const inputRef = useRef(null); // ... 📍 매개변수initialValue: ref 객체의 current프로퍼티 초기 설정값입니다. 여기에는 어떤 유형의 값이든 지정할 수 있습니다. 이 인자는 초기 렌더링 이후부터는 무시됩니다.📍 반환값useRef는 단일 프로퍼티를 가..

📌 useContext란?useContext는 컴포넌트에서 context를 읽고 구독할 수 있게 해주는 React Hook입니다.const value = useContext(SomeContext) 📌 useContext컴포넌트 최상위 레벨에서 useContext를 호출하여 context를 읽고 구독합니다.import { useContext } from 'react';function MyComponent() { const theme = useContext(ThemeContext); // ... 📍 매개변수context: 이전에 createContext로 생성한 context입니다. context 자체는 정보를 보유하지 않으며, 컴포넌트에서 제공하거나 읽을 수 있는 정보의 종류를 나타낼 뿐입니다.?..