Frontend
Next.js 렌더링 전략 완벽 가이드: SSR, SSG, ISR부터 RSC까지
Next.js의 SSR, SSG, ISR 렌더링 전략과 서버 컴포넌트(RSC)의 동작 원리를 비교하고 상황별 선택 기준을 정리합니다.
02026. 3. 28.
#React13개
Frontend
React 18 동시성 렌더링 핵심 가이드: 자동 배칭부터 useTransition, useId까지
React 18의 동시성 렌더링, 자동 배칭, useTransition, useId 등 핵심 기능으로 UI 응답성과 사용자 경험을 개선하는 방법을 정리합니다.
02024. 11. 24.
Frontend
React Native 새 아키텍처 이해하기: 브릿지를 대체한 JSI
React Native의 기존 브릿지 구조가 가진 성능 한계를, 새 아키텍처의 JSI와 Fabric, Turbo Modules가 어떻게 해결하는지 정리합니다.
02022. 11. 16.
Frontend
React 커스텀 훅 useStateWithHistory로 Undo/Redo 구현하기
useRef와 커스텀 훅으로 상태 이력을 관리해 Undo/Redo 기능을 구현하는 방법을 정리합니다.
02022. 8. 29.
Frontend
useReducer로 만드는 useFetch 커스텀 훅
서버 데이터를 fetch하면서 로딩과 에러 상태를 함께 관리하는 useFetch 커스텀 훅을, 기본 버전과 useReducer 버전 두 가지로 만들어 봅니다.
02022. 8. 29.
Frontend
실무에서 두루 쓰는 React 커스텀 Hook 4가지
useToggle, useTimeout, useDebounce, useUpdateEffect 등 대부분의 프로젝트에서 재사용하기 좋은 React 커스텀 Hook을 코드와 함께 정리합니다.
02022. 7. 27.
Frontend
React 18 useTransition으로 무거운 작업 중에도 입력 응답성 유지하기
React 18 useTransition으로 업데이트 우선순위를 나눠 무거운 필터링 중에도 입력 응답성을 유지하는 방법을 정리합니다.
02022. 7. 24.
Frontend
esbuild로 react app 만들어보기!
CRA 없이 esbuild로 처음부터 React 프로젝트를 구성하며 번들 속도를 직접 확인해봅니다.
02022. 4. 27.
Frontend
getStaticPaths와 fallback 프로퍼티를 알아보자!!
Next.js 동적 라우팅 정적 페이지를 만드는 getStaticPaths와 fallback 프로퍼티의 동작 방식을 알아봅니다.
02022. 4. 27.
Frontend
Next.js 에서 facebook comments plugin 적용해보기
Next.js 블로그에 페이스북 댓글 플러그인을 연동하는 과정을 단계별로 정리합니다.
02022. 4. 27.
Frontend
react-testing-library를 사용하여 간단한 테스트 코드 작성해보기
react-testing-library로 렌더링, 이벤트, API 모킹, 커스텀 훅 등을 검증하는 테스트 예제를 살펴봅니다.
02022. 4. 27.
Frontend
Intersection Observer를 사용하여 lazy loading 해보기
Intersection Observer API로 무한 스크롤과 이미지 지연 로딩을 구현하는 방법을 알아봅니다.
02022. 4. 26.
Frontend
React에서 더 나은 UX를 제공하는 Skeleton 만들어보기!
로딩 중 사용자 경험을 개선하는 스켈레톤 컴포넌트를 React에서 적용하는 방법을 알아봅니다.
02022. 4. 26.