React 라이브러리 조합 가이드: Zustand·TanStack Query·shadcn/ui 선택 기준
React 프로젝트에서 Zustand, TanStack Query, shadcn/ui, Radix UI 같은 라이브러리를 선택할 때 필요한 실무 기준을 정리합니다.
전체 글
프론트엔드 AI 트렌드: 2026년 전 확인할 개발 흐름
프론트엔드 AI 트렌드: 2026년 전 확인할 개발 흐름을 중심으로 변화 흐름과 확인해야 할 기준을 실무 관점에서 정리합니다. 처음 확인할 때 헷갈리는 지점도 함께 짚었습니다.
Firebase 초기화 구조: Next.js firebase.ts 설계 기준
Next.js에서 Firebase 웹 SDK 초기화 위치와 재사용·서버 경계를 설계합니다. 웹 SDK 인스턴스를 한 모듈에서 만들고 공유하면 설정과 리전이 흩어지는 것을 줄입니다. 중복 초기화 방지는 현재 JavaScript…
Next.js 보안 패치 기준: v16.2.5 영향 범위 점검
Next.js 보안 패치를 확인할 때 참고 릴리스 v16.2.5를 기준으로 내 프로젝트가 영향받는지 점검하는 순서를 정리합니다.
Next.js package.json: scripts dependencies 이해
Next.js package.json: scripts dependencies 이해을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다.
Next.js 16 성능 최적화 체크리스트: 번들·이미지·캐시·배포
Next.js 성능 최적화: 배포 플랫폼별 개선 기준을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다. 처음 확인할 때 헷갈리는 지점도 함께 짚었습니다.
Next.js 렌더링 성능 최적화: React 화면이 느릴 때 기준
검색 입력 예제로 상태를 사용하는 위치와 메모이제이션을 점검하고, React Profiler로 같은 조작의 렌더링 결과를 비교하는 방법을 설명합니다.
Axios 사용법: React Next.js에서 API 요청 구조 잡는 법
React·Next.js에서 Axios 조회 함수를 분리하고 로딩·오류·요청 취소를 처리합니다. 같은 출처 API 실습으로 오래된 응답의 화면 갱신도 막아 봅니다.
Next.js redirects 설정: next.config.js에서 URL 이동 처리
Next.js redirects 설정: next.config.js에서 URL 이동 처리을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다.
Next.js SEO SSR 적용법: 검색 노출과 렌더링 구조 잡기
Next.js의 초기 HTML과 요청별 SSR을 구분하고, App Router·Pages Router의 metadata와 본문 렌더링, URL·갱신 정책을 확인합니다.
프론트엔드 SEO 기초: HTML 구조와 이미지 성능 진단하기
제목·설명·링크·제목 계층과 이미지 속성을 작은 HTML 페이지에서 고칩니다. LCP와 CLS, 실험실과 실사용 데이터의 차이도 구분합니다.
Next.js SEO 체크리스트: metadata·초기 HTML·OG 이미지 점검
Next.js SEO 체크리스트: metadata API, SSR, Image까지 점검하기를 실제 작업 순서와 판단 기준 중심으로 정리합니다. 기존 개별 글을 어떻게 이어서 읽으면 좋은지 함께 안내합니다.