한 줄로

Vercel은 GitHub에 있는 Next.js 앱을 빌드하고, 그 결과를 사이트 주소로 열어 주는 호스팅이다. Next.js를 만든 회사의 서비스다.

React가 화면을 그리고, Next.js가 경로와 서버 실행을 맡는다. GitHub는 그 코드의 이력이다. Supabase와 PostgreSQL은 데이터와 로그인이다. Vercel은 그 Next.js 앱을 방문자에게 도달하게 한다. 데이터베이스를 대신하지 않는다.

이 허브와 다른 점

이 학습 허브는 HTML 파일만 있으면 열린다. 서버 함수, proxy.js, 요청마다 그리는 페이지가 있는 Next.js 앱은 파일만 복사하는 호스팅으로 부족하다. 직접 서버에서 npm start를 실행해도 된다. Vercel은 그 빌드와 실행을 대신한다. 로컬에서 먼저 확인하는 절차는 Next.js · 배포·자주 쓰는 기능에 있다.

시작 전에

• GitHub 저장소에 main으로 푸시할 수 있다.
• .env.local은 커밋하지 않는다. 배포 쪽 키는 환경 변수 단원에서 넣는다.

이 묶음에서 다루는 것

단원	내용
개념	프로젝트, 배포, 운영 브랜치, 미리보기
GitHub 연결	저장소 가져오기, Next.js 프리셋, 루트 디렉터리
환경 변수	Production·Preview, 공개 키와 secret 키
미리보기·운영	푸시가 만드는 주소, 빌드 실패, 되돌리기

대시보드 메뉴 이름은 바뀔 수 있다. 버튼이 다르면 Vercel Git 문서 (새 창)를 우선한다. 이 강좌는 GitHub 연결을 쓴다. 터미널의 npx vercel은 같은 프로젝트를 올리는 다른 입구다.