TanStack Query vs Zustand: 서버 상태와 클라이언트 상태 차이
둘 다 상태를 다루는 도구처럼 보여 API 데이터까지 Zustand에 넣거나, 모달 상태까지 Query로 관리하려는 혼란이 생깁니다. 둘 다 상태를 다루지만 출발점이 다릅니다 TanStack Query와 Zustand는 모두 화면의 값을 다룬다는 점에서 비슷해 보…
더 읽기개발
프로그래밍 카테고리에서는 HTML, CSS, JavaScript, React, Next.js를 비롯한 다양한 개발 지식과 실무 구현 방법을 정리합니다. 기초 문법부터 UI 구현, API 연동, 상태 관리, 성능 최적화, 트러블슈팅까지 실제 작업에 바로 적용할 수 있는 내용을 쉽고 체계적으로 다룹니다.
Next.js 커스텀 훅 설계: 프론트엔드 상태 관리 구조 잡기
프로젝트 개요 이 프로젝트는 실제 서비스 운영을 전제로 설계된 개인 포트폴리오이며, 인증, 사용자 데이터, 장바구니, 포인트, 대시보드, 공통 유틸, 입력 처리 등 반복적으로 사용되는 로직을 모두 Custom Hook으로…
더 읽기
Firebase Functions v2 사용법: 트리거 배포 Secret 처리
주요 포인트 한눈에 보기 ※ 이 문서는 Firebase Functions 2nd gen(v2) 기준으로 설명합니다. Firebase Functions는 프론트엔드에서 처리하면 위험하거나 부적절한 로직을 서버에서 안전하게 실행하기 위한 서버리스(Serverless) 기능…
더 읽기
jQuery 4.0 변경 사항: IE 지원 종료와 Slim 빌드 기준
주요 포인트 한눈에 보기 jQuery 4.0.0은 약 10년 만에 공개된 메이저 버전이며, jQuery 출시 20주년을 기념해 내부 구조를 크게 정리한 버전입니다. 새로운 기능이 대거 추가되었다기보다는 오래된 코드와 더 이상 필요 없는 기능을 제거하고 최신 브라우저 …
더 읽기
Firebase Custom Claims 사용법: 관리자 권한 구분하기
주요 포인트 한눈에 보기 이 문서는 Firebase 관리자 권한(Custom Claims)을 설정할 수 있도록, 실제 프로젝트에서 필요한 정보만 남기고 보안상 민감한 값은 모두 예시 값으로 대체하여 정리한 가이…
더 읽기
Firebase 보안 규칙 설계: Firestore와 Storage 권한 관리하기
주요 포인트 한눈에 보기 이 문서는 GPT를 활용해 Firebase 보안 규칙을 학습하고 실제 프로젝트에 적용하는 과정을 정리합니다. Firestore Database와 Firebase Storage 규칙을 중…
더 읽기
Firebase Storage 이미지 업로드 사용법: 상품 이미지 관리 흐름 만들기
주요 포인트 한눈에 보기 이 글은 완성된 포트폴리오 코드를 기준으로 Next.js + TypeScript + Firebase를 사용할 때 어떤 방식으로 제작되었는지 프로젝트를 분석합니다. 그 중 이번 챕터에서는 Firebase 구조를 분석합니다. 포…
더 읽기
코딩테스트 JS 투 포인터 풀이: 연속 구간 합 시간 줄이기
연속 부분수열 알고리즘은 연속된 구간의 합을 효율적으로 계산하는 대표적인 코딩 테스트 문제 유형입니다. 이 글에서는 연속 부분수열 알고리즘 문제를 예제로 삼아, 잘못된 접근과 정답 접근의 차이를 단계별로 설명합니다. 주요 포인트 한눈에 보기 …
더 읽기
Firestore CRUD 사용법: 컬렉션 구조와 읽기 쓰기 흐름
주요 포인트 한눈에 보기 이 글은 Firebase를 처음 사용하는 개발자를 위해 firebase/firestore가 어떤 역할을 담당하는지, 그리고 Firestore를 사용할 때 반드시 이해해야 할 최소한의 구조와 흐름을 정리합니다. CRUD 전체를 나열…
더 읽기
Firebase Auth Context 설계: 로그인 권한과 라우팅 관리하기
주요 포인트 한눈에 보기 이 글은 완성된 포트폴리오 코드를 기준으로 Next.js + TypeScript + Firebase를 사용할 때 어떤 방식으로 제작되었는지 프로젝트를 분석합니다. 그 중 이번 챕터에서는 Firebase Auth Conte…
더 읽기