Appearance
Deploying to Vercel
Easily deploy your SaaS application to Vercel for seamless hosting, automatic scaling, and tight Next.js integration.
Vercel is the official platform for Next.js, making it the ideal choice for deploying your NextSaasPilot project. This guide walks you through the entire process—from connecting your repository to setting up environment variables and custom domains.
1. Prepare Your Project
- Ensure your project is committed to a Git repository.
- Double-check your
.env
file for all required environment variables.
2. Connect to Vercel
Sign in to Vercel
Go to vercel.com and log in or create an account.Import Your Project
- Click "Add New..." > "Project" on your Vercel dashboard.
- Connect your Git provider and select your SaaS project repository.
Framework Detection
- Vercel will auto-detect Next.js and pre-fill build settings.
- You usually don’t need to change the default build command or output directory.
3. Configure Environment Variables
Add Environment Variables
- In the project setup, expand the "Environment Variables" section.
- Add all variables from your
.env
file (e.g.,DATABASE_URL
,AUTH_SECRET
,RESEND_API_KEY
, etc.). - Assign each variable to the correct environment: Production, Preview, or Development as needed.
Tip: You can always edit or add variables later in Project Settings > Environment Variables.
Sensitive Data
- Never commit secrets to your repository.
- Use Vercel’s dashboard to securely manage all secrets and API keys.
4. Deploy Your Application
- Click "Deploy" to trigger your first build and deployment.
- Vercel will build your app and provide a live preview at a unique subdomain (e.g.,
your-app-name.vercel.app
). - Every push to your main branch will automatically trigger a new deployment.
5. Set Up a Custom Domain
Go to Domain Settings
- In your Vercel project dashboard, navigate to Settings > Domains.
Add Your Domain
- Enter your custom domain (e.g.,
your-saas.com
) and click "Add".
- Enter your custom domain (e.g.,
Configure DNS
- Follow Vercel’s instructions to update your DNS provider:
- Recommended: Point your nameservers to Vercel for automatic configuration.
- Alternative: Add the required A or CNAME records if you want to keep your current nameservers.
- Follow Vercel’s instructions to update your DNS provider:
Automatic SSL
- Once DNS changes propagate, Vercel will verify your domain and issue a free SSL certificate.
6. Continuous Deployment
- Every time you push changes to your connected Git branch, Vercel will automatically build and deploy your updated application.
- You can monitor deployments, view logs, and roll back to previous versions from the Vercel dashboard.
For more details, see the Vercel Documentation or reach out to the NextSaasPilot community for help.