Skip to main content

Deploy JetShip to Vercel

Vercel is the preferred platform for deploying Next.js applications, offering seamless integration and optimal performance. This guide will walk you through the process of deploying your JetShip application to Vercel, ensuring a smooth deployment experience.

Connecting Your Repository​

The first step in deploying to Vercel is connecting your repository. Vercel supports major Git providers including GitHub, GitLab, and Bitbucket. Here's how to get started:

  1. Log in to your Vercel Dashboard
  2. Click on "Add New..." and select "Project"
  3. Choose your Git provider and select your repository
  4. Grant necessary permissions if prompted

Connect Repository

Project Configuration​

When setting up your project on Vercel, there are crucial configuration settings that need to be properly set for JetShip to deploy correctly:

  1. Framework Preset: Ensure Next.js is selected as your framework. Vercel should automatically detect this, but it's important to verify.

  2. Root Directory: This is critical - you must set the root directory to apps/web. This tells Vercel where your Next.js application is located within your monorepo structure.

Build Settings​

Vercel will attempt to automatically configure your build settings. However, in some cases, you might need to manually adjust them:

  1. Build Command: If Vercel doesn't automatically detect it, set it to cd ../../ && pnpm run build
  2. Output Directory: This should be automatically set to .next
  3. Install Command: Set to pnpm install if you're using pnpm
IMPORTANT

If you don't set these configurations correctly, your deployment will fail. Double-check these settings before proceeding with the deployment.

Project Configuration

Environment Variables​

Please make sure to set all the environment variables required for the project to work correctly.

A production deployment should be setting the below environment variables:

Environment Variables

FIRST DEPLOYMENT

Your first deployment might fail if you don't have a custom domain yet, as the NEXT_PUBLIC_APP_URL cannot be set correctly. This is normal. After the initial deployment:

  1. Get your Vercel-assigned domain or set up your custom domain
  2. Update the environment variables with the correct URL
  3. Trigger a new deployment

Deploying Multiple Apps​

If your monorepo contains multiple applications, you'll need to customize the build command for each deployment. Here's how to handle it:

  1. For the main web app, Vercel will automatically handle it
  2. For additional apps, modify the build command:
cd ../.. && turbo run build --filter=<app-name>

Replace <app-name> with the name of the specific app you're deploying.

Congratulations! Your JetShip application is now successfully deployed to Vercel.🚀