ExperienceProjectsPipelineBlogCheatsheetsAboutContact
Back to cheatsheets

Deployment

Vercel And Next.js Deployment Cheatsheet

Local Development

Start the local dev server

Use this to preview the Next.js app locally.

Command
pnpm dev

Build Verification

Run a production build

Use this before pushing changes to catch TypeScript, routing, or static generation issues.

Command
pnpm build

Commit And Push

Stage all changed files

Use this to prepare your current changes for commit.

Command
git add .

Commit the update

Use this to create a local Git commit.

Command
git commit -m "Update portfolio"

Push to GitHub

Use this to trigger Vercel auto-deployment when pushing to the production branch.

Command
git push

Vercel Defaults

Framework preset

Use this setting when importing the repository into Vercel.

Command
Framework: Next.js

Install command

Use this when Vercel does not auto-detect the package manager.

Command
Install command: pnpm install

Build command

Use this as the production build command.

Command
Build command: pnpm build

Output directory

Leave this empty for a standard Next.js app. Vercel handles the output.

Command
Output directory: leave empty

Verify Live Routes

Check the homepage

Use this to confirm the live site returns a successful response.

Command
curl -I https://your-site.vercel.app/

Check the blog listing

Use this to confirm the blog route is live.

Command
curl -I https://your-site.vercel.app/blog

Check the projects listing

Use this to confirm the projects route is live.

Command
curl -I https://your-site.vercel.app/projects

Common Checks

  • Production branch should be main.
  • Deployment protection should be disabled for public portfolios.
  • Resume PDF should return HTTP 200.
  • Important pages should not return noindex if search indexing is desired.