DEVELOPERS.md

Developing Supabase

1. Getting started
   • Install dependencies
2. Local development
   • Fork the repository
   • Clone the repo
   • Running turborepo
     • Shared components
     • Installing packages
   • New Supabase docs
3. Create a pull request

• Common tasks
  • Add a redirect
• Community channels

Getting started

Thanks for your interest in Supabase and for wanting to contribute! Before you begin, read the code of conduct and check out the existing issues. This document describes how to set up your development environment to build and test Supabase.

Install dependencies

You need to install and configure the following dependencies on your machine to build Supabase:

• Git
• Node.js v16.x (LTS)
• npm version 8.x.x or Yarn

Local development

We are in the process of migrating this repository to monorepo, using Turborepo.

Eventually, all the apps will be run using Turborepo, which will significantly improve the developer workflow.

Fork the repository

To contribute code to Supabase, you must fork the Supabase Repository.

Clone the repo

1. Clone your GitHub forked repository:

   git clone https://github.com/<github_username>/supabase.git

2. Go to the Supabase directory:

   cd supabase

Running turborepo

Supabase uses Turborepo to manage and run this monorepo.

1. Install the dependencies in the root of the repo.

   npm install # install dependencies

2. You can then run the apps simultaneously with the following.

   npm run dev # start all the applications

Then visit, and edit, any of the following sites:

Site	Directory	Scope name	Description	Local development server
supabase.com	/apps/www	www	The main website	http://localhost:3000
app.supabase.com	/studio	studio	Studio dashboard	http://localhost:8082
supabase.com/docs	/apps/docs	docs	Guides and Reference (Next.js based)	http://localhost:3001/docs

Running sites individually

You can run any of the sites individually by using the scope name. For example:

npm run dev:www

Shared components

The monorepo has a set of shared components under /packages:

• /packages/common: Common React code, shared between all sites.
• /packages/config: All shared config
• /packages/spec: Generates documentation using spec files.
• /packages/tsconfig: Shared Typescript settings

Installing packages

Installing a package with NPM workspaces requires you to add the -w flag to tell NPM which workspace you want to install into. Do not install dependencies in their local folder, install them from the route using the -w flag.

The format is: npm install <package name> -w=<workspace to install in>.

For example:

• npm install react -w common: installs into ./packages/common
• npm install react -w www: installs into ./apps/www
• npm install react -w studio: installs into ./studio

You do not need to install devDependencies in each workspace. These can all be installed in the root package.

New Supabase docs

Following the changes to the Supabase docs the following is needed to run the new docs locally:

• Inside of apps/docs create a .env.local file with the following: NEXT_PUBLIC_NEW_DOCS=true

Now when you run a local development docs server you will see the new docs site.

---

Create a pull request

After making your changes, open a pull request (PR). Once you submit your pull request, others from the Supabase team/community will review it with you.

Did you have an issue, like a merge conflict, or don't know how to open a pull request? Check out GitHub's pull request tutorial on how to resolve merge conflicts and other issues. Once your PR has been merged, you will be proudly listed as a contributor in the contributor chart.

---

Common tasks

Add a redirect

Create a new entry in the redirects.js file in our main site.

---

Community channels

Stuck somewhere? Have any questions? Join the Discord Community Server or the Github Discussions. We are here to help!

Contributors