React 썸네일형 리스트형 Compound Component 패턴으로 반응형 레이아웃 관리하기 서문현대 웹 개발에서는 다양한 기기의 화면 크기에 적응하는 반응형 인터페이스를 만드는 것이 필수적입니다.React와 컴파운드 컴포넌트 패턴을 활용하면 유연하고 유지 관리가 쉬운 레이아웃을 구현할 수 있습니다.이 글에서는 제가 프로젝트를 진행하면 구상한 컴파운드 컴포넌트 패턴을 통한 반응형 레이아웃 관리에 대해 예시를 들며 설명합니다.컴파운드 컴포넌트 패턴이란?//Example.tsxconst ExampleContext = createContext() function Example(props) { const [open, toggle] = useState(false) return ( {props.children} )} function Toggle() { const { open.. 더보기 useReducer의 initialState와 props 문제 이슈PC버전에서 사이드 메뉴를 통해 최초 이동 이후 페이지 이동 시 문제가 바뀌지 않는 버그가 있었습니다. 분석//ExamPage.tsx const { data: questionList, isError, isFetching, isSuccess, error, } = useGetExamQuery(round); const renderContent = () => { if (isFetching) { return ; } if (isError && error) { return ( ); } if (isSuccess && questionList.length === 0) { return ; } i.. 더보기 이전 1 다음
