ywc.life개인Next.js 16 Cache Components - Vercel이 공개한 PPR·use cache 가이드 (전문 번역)
Vercel Labs가 공개한 Next.js 16 Cache Components 스킬 전문 번역입니다. Partial Prerendering(PPR), use cache 지시어, cacheLife, cacheTag, updateTag까지 캐시 컴포넌트의 전체 그림을 한글로 옮겼어요.
ywc.life
개인최근 글
React Native Skills - Vercel이 공개한 React Native·Expo 베스트 프랙티스 (전문 번역)
Vercel Labs가 공개한 React Native Skills 전문 번역입니다. 리스트 가상화, Reanimated 애니메이션, 네이티브 내비게이션, 상태 관리 등 14개 카테고리 36개 규칙을 한글로 옮겼어요.
React Composition Patterns - Vercel이 공개한 React 합성 패턴 (전문 번역)
Vercel Labs가 공개한 React Composition Patterns 전문 번역입니다. 불리언 prop 남발을 피하는 컴파운드 컴포넌트, 상태 끌어올리기, 의존성 주입 컨텍스트 등 4개 카테고리 8개 규칙을 한글로 옮겼어요.
Next.js Best Practices - Vercel이 공개한 Next.js 개발 가이드 (전문 번역)
Vercel이 공개한 Next.js 베스트 프랙티스 스킬 전문 번역입니다. 파일 컨벤션, RSC 경계, 데이터 패턴, 에러 처리, 이미지·폰트 최적화 등 19개 문서를 한글로 번역했어요.
모노레포 Dockerfile에서 yarn install 캐시가 매번 깨지는 이유
모노레포 Dockerfile에서 package.json만 나눠 복사해야 하는 이유를 캐시 판정 원리와 재현 실험으로 정리했어요.
Next.js Proxy 패턴으로 JWT 인증 설계하기
JWT 액세스 토큰을 Zustand에서 서버 세션으로 전환하고, NextAuth + SSR Prefetch 아키텍처로 발전시킨 Next.js Proxy 패턴 설계 경험을 공유합니다.
TanStack Query의 Query Key Factory 패턴
TanStack Query에서 Query Key를 문자열로 직접 쓰다 보면 오타, 중복, 관리 실패가 발생합니다. Query Key Factory 패턴은 이 문제를 해결하는 커뮤니티 표준 패턴입니다. 단순한 키 팩토리부터 queryOptions()와 결합한 최종 진화형까지, 단계별로 알아봅니다.
React Best Practices - Vercel 엔지니어링 팀의 성능 최적화 가이드 (전문 번역)
Vercel 엔지니어링 팀이 공개한 React/Next.js 성능 최적화 가이드 전문 번역입니다. 8개 카테고리, 45개 이상의 규칙을 영향도 기준으로 정리했습니다.
Next.js 15에 MSW(Mock Service Worker) 설치하기
제가 공식문서와 구글링을 통해 여러 뻘짓과 시행착오를 겪고 MSW를 Next.js 15에 설치하는 간단한 방법을 소개하려고 합니다.
React v19, forwardRef를 대체할 방법에 대해서 알아보자
React v19에서 forwardRef가 더 이상 필요없어졌어요. 향후 버전에서는 forwardRef를 제거한다고도 하는데요. 대신 이제 ref를 prop에서 접근할 수 있도록 바뀌었어요. ref를 일반 prop처럼 전달할 수 있게 되면서 코드가 간결해지고 타입 정의가 단순해졌어요. 이 글에서는 기존 forwardRef의 문제점과 React v19의 새로…
Luxon으로 손쉽게 자바스크립트 날짜와 시간을 처리해보기
Luxon은 자바스크립트에서 날짜와 시간을 처리하기 위한 라이브러리입니다. 자바스크립트에서 날짜와 시간을 다룰 때 Date API를 사용해본 경험이 있으시면 날짜와 시간을 다루는 것이 여간 짜증나는 일이 아닐 수 없는데요. Luxon은 자바스크립트에서 날짜와 시간을 다루는 일을 쉽게 만들어 주는 라이브러리입니다. 이번 포스팅에서는 Luxon의 주요 특징과…