JavaScript 투두리스트 만들기: 상태와 이벤트 위임으로 완성하기
배열을 기준으로 추가·완료·삭제하고, 이벤트 위임과 검색·완료 필터의 파생 화면을 구현합니다.
해비
웹퍼블리싱 실무를 바탕으로 React, Next.js, TypeScript와 프론트엔드 문제 해결 과정을 기록합니다.
총 368개의 글
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 이동 처리을 중심으로 개념, 사용 기준, 실무 적용 흐름을 예제와 함께 정리합니다.