Nextacular🌙
  • What is Nextacular?
  • Overview
    • Feature Highlights
    • Main Technologies
    • Dependencies
  • Updating From Latest
  • Changelogs
    • Version 1.2.0 – Beta
    • Version 1.1.1 – Beta
    • Version 1.1.0 – Beta
    • Version 1.0.2 – Beta
    • Version 1.0.0 – Beta
  • 🚀Getting Started
    • Quick Start
    • Quick Deploy Guide
    • Deployment Checklist
    • FAQs
  • 🌟Development Features
    • Workspaces
    • Teams Management
    • Domains
    • Authentication
    • Sending Emails
    • Email Templates
    • Payment Handling
    • Validation
  • 🎨Customization
    • Project Structure
    • Environment Variables
    • Configurations
      • Tailwind CSS
      • Subscription Rules
      • API Validation
      • Sidebar Menu
      • Email Templates
    • Layouts
    • Components
    • Sections
    • Pages
      • Page Fetching Methods
      • Authenticated Pages
      • Account Pages
      • Landing Pages
  • 💻Technology Guide
    • Framework
      • Next JS
    • Database
      • ORM
        • Prisma
      • Relational Database
        • Heroku PostgreSQL
        • Supabase
    • Authentication
      • Next Auth JS
    • Email
      • Mailjet
      • SendGrid
    • Payment
      • Paddle
      • Stripe
    • Styling
      • Tailwind CSS
    • Server
      • Vercel
    • Analytics
      • Google Analytics
    • Blog
      • Notion
    • File Management
      • Cloudinary
      • Google Cloud Platform
    • Iconography
      • Hero Icons
    • Internationalization
      • Tolgee
    • Notifications
      • LogSnag
    • CMS
      • Sanity
  • 🌙Additional Resources
    • Learn React JS
    • Learn Next JS
    • Learn Prisma for Next JS
    • Project Roadmap
Powered by GitBook
On this page
  • Prerequisites
  • Vercel - https://vercel.com/
  • Email
  • Authentication
  • Payment
  • Database
  • Analytics
  • Steps
  • 1. Deploy a Vercel Project
  • 2. Domain Configuration
  • 3. Post Build Configuration

Was this helpful?

  1. Getting Started

Quick Deploy Guide

In this guide, you'll learn how to quickly deploy your Nextacular project over at Vercel. After successfully going through this guide, you'll feel confident in handling your own deployment.

PreviousQuick StartNextDeployment Checklist

Last updated 3 years ago

Was this helpful?

Prerequisites

Vercel -

A Vercel account is required in order for us to successfully deploy our SaaS project. Head over to Vercel and create your account now.

Email

Check out our supported email providers here and how to set them up:

Authentication

As of v1.0.0, Email is our go-to authentication provider. Additional modification and setup will have to be done for other providers.

Visit for additional setup of other providers.

Payment

As of v1.0.0, Stripe is our go-to payment provider. Additional modification and setup will have to be done for other payment providers.

You will need to set up an account with stripe and create the products.

Check out our supported payment providers here and how to set them up:

Database

Check out our supported database providers here and how to set them up:

Analytics

Check out our supported analytics providers here and how to set them up:

Steps

1. Deploy a Vercel Project

Create a Vercel Authorization Token

Prepare a Vercel Authorization Token in your account dashboard by clicking the "Create" button in the "Tokens" settings.

Create a Vercel Project

Create a new project in your Vercel dashboard by clicking the "+ New Project" button.

Import Git Repository

If this is your first time deploying a project in Vercel, connect your repository provider and authorize specific projects.

After authorizing repositories for deployment, click the "Import" button for your specific project.

Configure Project

Update your project configurations such as your Project Name.

Add Environment Variables

Set up your Environment Variables by adding the following values:

# App Configuration
APP_URL
NEXTAUTH_URL
NEXTAUTH_SECRET

# Database Configuration
DATABASE_URL
SHADOW_DATABASE_URL

# Email Configuration
EMAIL_FROM
EMAIL_SERVER_USER
EMAIL_SERVER_PASSWORD
EMAIL_SERVICE

# Payment Configuration (Stripe)
NEXT_PUBLIC_PUBLISHABLE_KEY
PAYMENTS_SECRET_KEY
PAYMENTS_SIGNING_SECRET

# Vercel Configuration
NEXT_PUBLIC_VERCEL_IP_ADDRESS
VERCEL_AUTH_BEARER_TOKEN

# Analytics Configuration
NEXT_PUBLIC_GOOGLE_ANALYTICS_ID

If you can't provide all of these environment variables, some expected functionality won't work.

  1. App Configuration - authentication and application build will fail

  2. Database Configuration - application build will fail and the database connection error will occur

  3. Email Configuration - nodemailer will throw an error and sending of emails (ie. authentication) won't work

  4. Payment Configuration - the project will still work, but errors in billing and product display pages will occur

  5. Vercel Configuration - the project will still work, but errors in the domain configuration pages will occur

  6. Analytics Configuration - the project will still work, but warnings and errors are thrown on the client's console

Please refer to this documentation for more details:

Deploy

Click the "Deploy" button and wait for the build to finish.

2. Domain Configuration

DNS Nameservers Migrated to Vercel

Select your project, and go to your settings page. On the left side, you'll be able to set your "Domains". Add the following domains here to allow multi-tenancy for your project:

  1. yourdomain.com (Add yourdomain.com and redirect www.yourdomain.com to it – 2nd option)

  2. *.yourdomain.com

3. Post Build Configuration

During this time, your application should have been built successfully, but we're not quite there yet. In order for us to have a fully-working application, we need to set up additional environment variables, most especially the ones associated with your Vercel account (which were created after the build happened).

The following Environment Variables should be added:

# Vercel Configuration
VERCEL_PROJECT_ID
VERCEL_TEAM_ID

# 3rd-Party Services Configuration
# If you intend to use third-party applications,
# this is the best time you should add them to your list of
# environment variables

If you encounter any issues while building the project, please don't hesitate to raise them over at our Discord channel. ()

🚀
https://vercel.com/
Email
NextAuth.js
Authentication
Payment
Database
Analytics
Environment Variables
https://discord.gg/GnCnzWbzDT