Next.js와 Supabase 풀스택 앱 구축하기

Middle class 약 25분활용 사례

Next.js App Router와 Supabase를 결합해 인증, 데이터베이스, 파일 저장소가 포함된 풀스택 앱을 만듭니다.

Supabase 열기

supabase.com

STEP 1 / 3…

STEP 1. Next.js Supabase 스타터 설정

Terminal

➜ npx -y @modelcontextprotocol/...

Need to install the following packages:

@modelcontextprotocol/server-filesystem

Ok to proceed? (y) y

✓ MCP server started

Waiting for connection...

create-next-app → with-supabase → .env 설정 → npm run dev

`npx create-next-app -e with-supabase`로 Supabase가 통합된 Next.js 프로젝트를 시작합니다. 기본 인증(이메일/비밀번호)이 이미 구현된 보일러플레이트입니다.

공식 Supabase Next.js 템플릿에는 Auth, 미들웨어, 서버 컴포넌트 패턴이 모두 포함되어 있어요.

이 단계를 완료했나요?