Self-Hosting
Deploying
Deploy to Netlify

Deploy to Netlify

Netlify ↗ (opens in a new tab) is a cloud-based platform and service that offers web hosting, serverless computing, and automation tools for web developers. It is designed to simplify the process of deploying and managing web applications and websites.

In this quick start guide, we demonstrate just how effortless it is to host the platform on Netlify ↗ (opens in a new tab), complemented by a Database hosted at Neon ↗ (opens in a new tab). Best of all, both services offer perfect free plans, allowing you to explore the platform and scale up as you progress.

Getting started

To begin, create a database.

Ensure that you have an operational PostgreSQL database server capable of accepting remote connections.

ℹ️

Any traditional instance of PostgreSQL with connection pooling, such as PgBouncer ↗ (opens in a new tab), will work effectively.

If you do not already have a database, consider selecting one from the recommended list below:

  • Neon - Serverless Postgres

    During the deployment step, you will be prompted to provide two environment variables for the database. The first is DATABASE_URL, which is the Connection URL to your database using PgBouncer. The second is DIRECT_DATABASE_URL, which serves as the direct connection URL to the database, used for migrations.

Next, set up authentication.

To simplify this guide, we will use Github ↗ (opens in a new tab) as the authentication provider, allowing you to create an account and log in to the Platform. Additionally, this setup will allow other members of your organization to log in as well.

Create a new OAuth App (opens in a new tab) by filling out the form with the following settings:

ℹ️

If you don't have a Project URL yet, you can leave it blank for now. Check out the Troubleshooting section for further assistance.

"Application name": "Forms by Basestack" // or any name you prefer like
"Homepage URL": "https://your-basestack-forms-instance.com"
"Authorization callback URL": "https://your-basestack-instance.com/api/auth/callback/github"

Once you've successfully created a new OAuth App (opens in a new tab), it will generate two important keys: GITHUB_CLIENT_ID and GITHUB_CLIENT_SECRET. Be sure to save these keys for later use during the deployment step, as they will be needed as environment variables.

⚠️

For more granular control over authentication aspects, including rules, enabling or disabling account creation, and allowing account creation with credentials (email and password), we recommend using Auth0.

Finally, proceed with the deployment.

Option 1: Quick Deploy (Skip this if you want to receive updates)

By clicking on the button below, a new repository will be created in your GitHub account from the Basestack Platform (opens in a new tab) repository, and the platform will be deployed for you. This will be an independent copy with no connection to the main project.

Deploy to Netlify (opens in a new tab)

Option 2: Fork the Platform

To receive updates from the main repository, you will need to manually fork (opens in a new tab) the project to your GitHub account and import it manually into your Netlify account dashboard. The rest of the process remains the same in terms of configuration, such as Environment Variables and Project Settings. For more details, refer to the Getting Updates Page.

Import to Netlify
  1. Log in to Netlify ↗ (opens in a new tab).
  2. Click the Add new site dropdown button, then select Import an existing project from the menu.
  3. Click the Deploy with Github button.
  4. Connect your GitHub account and choose the forked platform repository.
  5. Follow the on-screen instructions to set up the necessary Environment Variables and click "Deploy"
"Base directory": "/"
"Site to deploy": "apps/feature-flags"
"Build command": "yarn deploy:feature-flags"
"Publish directory": "apps/forms/.next"
  1. Your deploy will be automatically built. Each git push will trigger a new deployment.
Environment Variables

To ensure a successful deployment on Netlify, the platform requires a minimum set of environment variables. Below is the list of environment variables that you must fill in. For the complete list of Environment Variables, please refer to the Configuration Page.

PropertyDescriptionValue
DATABASE_URLConnection URL to your database using PgBouncer.
DIRECT_DATABASE_URLDirect connection URL to the database used for migrations
NEXTAUTH_SECRETUsed to encrypt the NextAuth.js JWT, and to hash email verification tokens.
NEXTAUTH_URLSet to the canonical URL of your site
GITHUB_CLIENT_IDClient Id generated in the OAuth App (opens in a new tab) creation
GITHUB_CLIENT_SECRETClient Secret generated in the OAuth App (opens in a new tab) creation
NODE_VERSIONNode version to use for the build process.18.12.0
SKIP_INSTALL_DEPSDisables npm install to use yarntrue
ℹ️

For the NEXTAUTH_SECRET variable you can use openssl rand -base64 32 or generate a random value (opens in a new tab).

What's next?

Begin by familiarizing yourself with the platform.

Create projects, add new feature flags, invite members, and implement the feature flags in your product using our official SDKs.

Lastly, stay tuned about updates, including new features and bug fixes. To ensure your platform is always up-to-date with the latest improvements, refer to our guide on updating the platform by visiting the Updates Page.

ℹ️

For more comprehensive information about the deployment process, please check out the Configuration Page. This page provides detailed guidance to ensure a successful and seamless deployment of the Forms Platform.

Troubleshooting

How to Retrieve the Project URL for NEXTAUTH_URL and Github OAuth App?

If you don't have a domain yet, feel free to leave the fields below empty or use dummy information. Proceed with the deployment as usual. Once the deployment is complete, Netlify will generate a URL for your project.

Copy this URL and update the information in your OAuth App (opens in a new tab). Next, modify the environment variables in the project settings on Netlify and initiate a new deployment on Netlify once again.

Environment Variables:

  • NEXTAUTH_URL

Github OAuth App (opens in a new tab) Fields:

  • Homepage URL
  • Authorization callback URL