Supabase 서버 사이드 인증과 SSR 헬퍼 패키지 이해하기
Next.js 같은 SSR 환경에서 Supabase Auth 세션을 쿠키 기반으로 읽고 갱신하는 이유와 @supabase/ssr 헬퍼 패키지의 역할을 정리합니다.
개발
프로그래밍 카테고리에서는 HTML, CSS, JavaScript, React, Next.js를 비롯한 다양한 개발 지식과 실무 구현 방법을 정리합니다. 기초 문법부터 UI 구현, API 연동, 상태 관리, 성능 최적화, 트러블슈팅까지 실제 작업에 바로 적용할 수 있는 내용을 쉽고 체계적으로 다룹니다.
총 208개의 글
Next.js에서 Supabase 사용하는 법: 설정부터 데이터 조회까지
Next.js App Router 프로젝트에 Supabase를 연결하는 기본 흐름을 Supabase 프로젝트 준비, 환경 변수 설정, 클라이언트 구성, 데이터 조회, 인증 확장, 배포 전 확인 사항 순서로 정리합니다.
Supabase, Neon, Firebase SQL Connect 차이 총정리: PostgreSQL 백엔드 선택 기준
Supabase, Neon, Firebase SQL Connect의 핵심 차이를 백엔드 플랫폼, 서버리스 PostgreSQL, Firebase SQL 연동 관점에서 비교하고 프로젝트 상황별 선택 기준을 정리합니다.
Next.js 16 Proxy 마이그레이션: Node.js Runtime·matcher 검증
Next.js 16.2.10에서 middleware.ts를 proxy.ts로 옮길 때 Node.js runtime 고정, Edge 예외, matcher, 지원 API, 테스트와 배포 검증을 정확히 정리합니다.
Next.js 동적 라우트 완전 정리: [slug], params, catch-all
App Router의 [slug], params Promise, useParams, generateStaticParams, catch-all과 실무 404·slug 변경 정책을 예제로 정리합니다.
GSAP이 처음일 때 기초 사용법: 설치부터 기본 애니메이션까지
GSAP을 처음 사용하는 초보자를 위해 CDN과 npm 설치, gsap.to(), gsap.from(), gsap.fromTo(), duration, ease, stagger, timeline까지 기본 사용법을 순서대로 정리한…
Next.js Metadata API 완전 정리: 정적 metadata와 generateMetadata
Next.js App Router에서 metadata, generateMetadata, title 템플릿, canonical, Open Graph, robots를 최신 params Promise 예제로 정리합니다.
Zustand persist 마이그레이션 기준: 저장된 상태 구조가 바뀔 때
Zustand persist에서 저장된 상태 구조가 바뀔 때 version과 migrate가 필요한 기준을 정리합니다. 필드 추가, 필드명 변경, 중첩 구조 변경, 값 의미 변경, partialize 변경 사례를 중심으로 운영…
TypeScript as const 사용법: union 타입을 자동 생성하는 기준
TypeScript의 as const로 배열과 객체 값을 readonly 리터럴 타입으로 좁히고, typeof, keyof, 인덱스 접근 타입을 조합해 union 타입을 자동 생성하는 실무 기준을 정리합니다.
TypeScript 제네릭 쉽게 이해하기: props와 API 응답 타입으로 감 잡기
TypeScript 제네릭을 React props와 API 응답 타입 예시로 쉽게 이해할 수 있도록 정리합니다. any와 제네릭의 차이, GenericList와 ApiResponse 활용 흐름을 함께 살펴봅니다.