mirror of
https://github.com/supabase/supabase.git
synced 2026-10-17 07:09:07 +03:00
wip
This commit is contained in:
avallete committed
1 parent
b3fa37037c
commit
c7fb9a6729
29 files changed
+123
-136
No files matched your search
@@ -1,7 +0,0 @@
|
||||
# Get these from your API settings: https://supabase.com/dashboard/project/_/settings/api
|
||||
# URL of supabase api will be passed to next frontend build for app deployment
|
||||
NEXT_PUBLIC_SUPABASE_URL=http://127.0.0.1:54321
|
||||
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6ImFub24iLCJleHAiOjE5ODM4MTI5OTZ9.CRXP1A7WOeoJeXxjNni43kdQwgnWNReilDMblYTn_I0
|
||||
# The frontend site url, will be used by Supabase Auth services to properly configure auth redirects
|
||||
SUPABASE_AUTH_SITE_URL=http://localhost:3000
|
||||
SUPABASE_AUTH_ADDITIONAL_REDIRECT_URLS=http://localhost:3000/**,http://localhost:3000/
|
||||
@@ -1,6 +0,0 @@
|
||||
# Get these from your API settings: https://supabase.com/dashboard/project/_/settings/api
|
||||
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
|
||||
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
|
||||
# Get this from your Vercel project settings
|
||||
NEXT_SITE_URL=https://<your-vercel-project-name>.<your-vercel-org-name>.vercel.app/
|
||||
NEXT_REDIRECT_URLS=https://<your-vercel-project-name>.<your-vercel-org-name>.vercel.app/,https://<your-vercel-project-name>.<your-vercel-org-name>.vercel.app/**
|
||||
@@ -1,117 +0,0 @@
|
||||
# Realtime chat example using Supabase
|
||||
|
||||
This is a full-stack Slack clone example using:
|
||||
|
||||
- Frontend:
|
||||
- [Next.js](https://github.com/vercel/next.js) - a React framework for production.
|
||||
- [Supabase.js](https://supabase.com/docs/library/getting-started) for user management and realtime data syncing.
|
||||
- Backend:
|
||||
- [supabase.com/dashboard](https://supabase.com/dashboard/): hosted Postgres database with restful API for usage with Supabase.js.
|
||||
|
||||
## Demo
|
||||
|
||||
- CodeSandbox: https://codesandbox.io/s/github/supabase/supabase/tree/master/examples/nextjs-slack-clone
|
||||
|
||||
|
||||
|
||||
## Deploy with Vercel
|
||||
|
||||
The Vercel deployment will guide you through creating a Supabase account and project. After installation of the Supabase integration, all relevant environment variables will be set up so that the project is usable immediately after deployment 🚀
|
||||
|
||||
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fsupabase%2Fsupabase%2Ftree%2Fmaster%2Fexamples%2Fslack-clone%2Fnextjs-slack-clone&project-name=supabase-nextjs-slack-clone&repository-name=supabase-nextjs-slack-clone&integration-ids=oac_VqOgBHqhEoFTPzGkPd7L0iH6&external-id=https%3A%2F%2Fgithub.com%2Fsupabase%2Fsupabase%2Ftree%2Fmaster%2Fexamples%2Fslack-clone%2Fnextjs-slack-clone)
|
||||
|
||||
## Build from scratch
|
||||
|
||||
### 1. Create new project
|
||||
|
||||
Sign up to Supabase - [https://supabase.com/dashboard](https://supabase.com/dashboard) and create a new project. Wait for your database to start.
|
||||
|
||||
### 2. Run "Slack Clone" Quickstart
|
||||
|
||||
Once your database has started, run the "Slack Clone" quickstart.
|
||||
|
||||
|
||||
|
||||
### 3. Get the URL and Key
|
||||
|
||||
Go to the Project Settings (the cog icon), open the API tab, and find your API URL and `anon` key. You'll need these in the next step.
|
||||
|
||||
The `anon` key is your client-side API key. It allows "anonymous access" to your database, until the user has logged in. Once they have logged in, the keys will switch to the user's own login token. This enables row level security for your data. Read more about this [below](#postgres-row-level-security).
|
||||
|
||||
|
||||
|
||||
**_NOTE_**: The `service_role` key has full access to your data, bypassing any security policies. These keys have to be kept secret and are meant to be used in server environments and never on a client or browser.
|
||||
|
||||
## Supabase details
|
||||
|
||||
### Using a Remote Supabase Project
|
||||
|
||||
1. Create or select a project on [Supabase Dashboard](https://supabase.com/dashboard).
|
||||
2. Copy and fill the dotenv template `cp .env.production.example .env.production`
|
||||
3. Link the local project and merge the local configuration with the remote one:
|
||||
|
||||
```bash
|
||||
SUPABASE_ENV=production npx supabase@latest link --project-ref <your-project-ref>
|
||||
```
|
||||
|
||||
3. Sync the configuration:
|
||||
|
||||
```bash
|
||||
SUPABASE_ENV=production npx supabase@latest config push
|
||||
```
|
||||
|
||||
4. Sync the database schema:
|
||||
|
||||
```bash
|
||||
SUPABASE_ENV=production npx supabase@latest db push
|
||||
```
|
||||
|
||||
## Vercel Preview with Branching
|
||||
|
||||
Supabase integrates seamlessly with Vercel's preview branches, giving each branch a dedicated Supabase project. This setup allows testing database migrations or service configurations safely before applying them to production.
|
||||
|
||||
### Steps
|
||||
|
||||
1. Ensure the Vercel project is linked to a Git repository.
|
||||
2. Configure the "Preview" environment variables in Vercel:
|
||||
|
||||
- `SUPABASE_AUTH_SITE_URL`
|
||||
- `NEXT_PUBLIC_SUPABASE_ANON_KEY`
|
||||
|
||||
3. Create a new branch, make changes (e.g., update `max_frequency`), and push the branch to Git.
|
||||
- Open a pull request to trigger Vercel + Supabase integration.
|
||||
- Upon successful deployment, the preview environment reflects the changes.
|
||||
|
||||
|
||||
|
||||
---
|
||||
|
||||
### Role-based access control (RBAC)
|
||||
|
||||
Use [plus addressing](https://en.wikipedia.org/wiki/Email_address#Subaddressing) to sign up users with the `admin` & `moderator` roles. Email addresses including `+supaadmin@` will be assigned the `admin` role, and email addresses including `+supamod@` will be assigned the `moderator` role. For example:
|
||||
|
||||
```
|
||||
// admin user
|
||||
email+supaadmin@example.com
|
||||
|
||||
// moderator user
|
||||
email+supamod@example.com
|
||||
```
|
||||
|
||||
Users with the `moderator` role can delete all messages. Users with the `admin` role can delete all messages and channels (note: it's not recommended to delete the `public` channel).
|
||||
|
||||
### Postgres Row level security
|
||||
|
||||
This project uses very high-level Authorization using Postgres' Row Level Security.
|
||||
When you start a Postgres database on Supabase, we populate it with an `auth` schema, and some helper functions.
|
||||
When a user logs in, they are issued a JWT with the role `authenticated` and their UUID.
|
||||
We can use these details to provide fine-grained control over what each user can and cannot do.
|
||||
|
||||
- For the full schema refer to [full-schema.sql](./full-schema.sql).
|
||||
- For documentation on Role-based Access Control, refer to the [docs](https://supabase.com/docs/guides/auth/custom-claims-and-role-based-access-control-rbac).
|
||||
|
||||
## Authors
|
||||
|
||||
- [Supabase](https://supabase.com)
|
||||
|
||||
Supabase is open source, we'd love for you to follow along and get involved at https://github.com/supabase/supabase
|
||||
+2
-1
@@ -17,7 +17,7 @@
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
.env*
|
||||
.env.keys
|
||||
!.env.*.example
|
||||
|
||||
# debug
|
||||
@@ -27,3 +27,4 @@ yarn-error.log*
|
||||
|
||||
# Supabase
|
||||
.supabase
|
||||
.vercel
|
||||
@@ -0,0 +1,100 @@
|
||||
# Dotenvx integration with supabase project
|
||||
|
||||
This is a full-stack Slack clone example using:
|
||||
|
||||
- Frontend:
|
||||
- [Next.js](https://github.com/vercel/next.js) - a React framework for production.
|
||||
- [Supabase.js](https://supabase.com/docs/library/getting-started) for user management and realtime data syncing.
|
||||
- Backend:
|
||||
- [supabase.com/dashboard](https://supabase.com/dashboard/): hosted Postgres database with restful API for usage with Supabase.js.
|
||||
- A connection to github for authentification.
|
||||
|
||||
## Introduction
|
||||
|
||||
This project demonstrate how you can leverage [dotenvx](https://dotenvx.com/) and `config.toml` to easily deploy differents
|
||||
environments. We'll see how you can have a similiar setup for your dev and remote production project.
|
||||
|
||||
## Core concept
|
||||
|
||||
Most of the configurations within `config.toml` can received env variables via the `env()` syntax. Our goal here is to leverage
|
||||
this with `dotenvx` to handle sensistives values such as Github app credentials for the auth 3rd parties.
|
||||
|
||||
The key thing to know about `dotenvx` is that it allows you to easily encrypt secrets and share them across your team.
|
||||
The key to decrypt thoses secrets will be stored under `.env.keys`, those must be secured and left out of your version control.
|
||||
You'll need to share thoses private keys with your team to allow them to decrypt the env values [more details about how dotenvx secrets works](https://dotenvx.com/encryption).
|
||||
|
||||
In this example, we'll reproduce how you would deploy and manage an app environment using dotenvx.
|
||||
|
||||
### How to structure your environment files:
|
||||
|
||||
We recommend to follow a similar convention to the one we use in this project.
|
||||
We're clearly spltting the environments into 3 files"
|
||||
|
||||
- `supabase/.env.local` -- In charge of setting up the "local development" so you can test and develop your application when you use `npx supabase start`
|
||||
- `supabase/.env.production` -- Will contain the environment for the main production project on supabase.
|
||||
|
||||
If we explore our `.env.local` with our `config.toml` we can see that we drive the values that are environment
|
||||
dependents with the `env()` synax:
|
||||
|
||||
```toml
|
||||
...
|
||||
site_url = "env(SUPABASE_AUTH_SITE_URL)"
|
||||
# A list of *exact* URLs that auth providers are permitted to redirect to post authentication.
|
||||
additional_redirect_urls = [
|
||||
# Will be localhost:3000 in development or the URL of your deployed app in production.
|
||||
"env(SUPABASE_AUTH_ADDITIONAL_REDIRECT_URLS)",
|
||||
]
|
||||
...
|
||||
|
||||
[auth.external.github]
|
||||
enabled = true
|
||||
client_id = "env(SUPABASE_AUTH_EXTERNAL_GITHUB_CLIENT_ID)"
|
||||
secret = "env(SUPABASE_AUTH_EXTERNAL_GITHUB_SECRET)"
|
||||
```
|
||||
|
||||
# Local development
|
||||
|
||||
To run the stack locally, we need to set those values. Some of them aren't senstitives and are stored in plain text
|
||||
but you can see that we have encrypted values for our github connections:
|
||||
|
||||
```supabase/.env.local
|
||||
SUPABASE_AUTH_EXTERNAL_GITHUB_CLIENT_ID=encrypted:BGN3vY/hup3ZENuwbkSxhL9TI7QvGH24HyPS9nd/oaZSQMmuDPS+Y1IJKPCsi38BSxxcHEUh09I9jp75nUuslXjHWs+y9p4OLIUPcUBAYlPTKvPrxkn3MLzJ0WxdvukWlzMosSZfUdMtYpze3GnU9UEDG0+O
|
||||
SUPABASE_AUTH_EXTERNAL_GITHUB_SECRET=encrypted:BMefTMshFBXOxqYuxGt7HEOhVM1C0tySmX/Wl23nRe0Bm1aiMuzfFIBqUDd21jM2hqnEUJgaOQ6HJSFEJt/iXBWUvqz2aedTUbELTyuCZKNCQWF2cAAOYqipaoFKIODCqGwULhYFD31G0y0WlJWXOB0IAwyhACJu7y4nvsZmuZ8yNvASHP5Blho=
|
||||
```
|
||||
|
||||
You want to replace thoses with the ones macthing your own development [Github Oauth App](https://docs.github.com/en/apps/oauth-apps/building-oauth-apps/creating-an-oauth-app)
|
||||
|
||||
To do so, we can simply remove the ones we currently have in our `.env.local` and set your own using `dotenvx` cli:
|
||||
|
||||
```bash
|
||||
npx dotenvx set SUPABASE_AUTH_EXTERNAL_GITHUB_CLIENT_ID "<your-github-client-id>" -f supabase/.env.local
|
||||
npx dotenvx set SUPABASE_AUTH_EXTERNAL_GITHUB_SECRET "<your-github-app-secret>" -f supabase/.env.local
|
||||
```
|
||||
|
||||
Dotenvx will automatically encrypt those values and create a `.env.keys` for you locally.
|
||||
|
||||
Now that we have everything setup, we can run our stack with `dotenvx` so all the env values get set and decrypted properly:
|
||||
|
||||
```
|
||||
# First we start our supabase local server
|
||||
npx dotenvx run -f supabase/.env.local -- npx supabase start
|
||||
# Then we can start our frontend dev server similarly
|
||||
npx dotenvx run -f supabase/.env.local -- npm run dev
|
||||
```
|
||||
|
||||
If you now heads up to `locahost:3000` you should be able to connect using github oauth integration and use the app.
|
||||
|
||||
# Remote deployment
|
||||
|
||||
Now that we ensured our local development is working, it's time to get this deployed to our remote supabase project.
|
||||
|
||||
## Deploy with vercel
|
||||
|
||||
The easiest way to get started is to deploy with vercel. This will:
|
||||
|
||||
1. Allow you to create a new supabase project
|
||||
2. Link and deploy the frontend for this project on Vecel
|
||||
|
||||
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fsupabase%2Fsupabase%2Ftree%2Fmaster%2Fexamples%2Fslack-clone%2Fnextjs-slack-clone&project-name=supabase-nextjs-slack-clone&repository-name=supabase-nextjs-slack-clone&integration-ids=oac_VqOgBHqhEoFTPzGkPd7L0iH6&external-id=https%3A%2F%2Fgithub.com%2Fsupabase%2Fsupabase%2Ftree%2Fmaster%2Fexamples%2Fslack-clone%2Fnextjs-slack-clone)
|
||||
|
||||
> Here we assume you already have a vercel
|
||||
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
+1
-1
@@ -3,7 +3,7 @@
|
||||
"version": "0.2.0",
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"dev": "next dev -p 3456",
|
||||
"dev": "next dev",
|
||||
"export": "next export",
|
||||
"build": "next build",
|
||||
"start": "next start"
|
||||
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
@@ -0,0 +1,17 @@
|
||||
#/-------------------[DOTENV_PUBLIC_KEY]--------------------/
|
||||
#/ public-key encryption for .env files /
|
||||
#/ [how it works](https://dotenvx.com/encryption) /
|
||||
#/----------------------------------------------------------/
|
||||
DOTENV_PUBLIC_KEY_PRODUCTION="037c5782c1623f8b9b3d9c1ae53e20138c483738d7630305f0a163ab2359537bde"
|
||||
|
||||
# .env.production
|
||||
# Get these from your API settings: https://supabase.com/dashboard/project/_/settings/api
|
||||
# URL of supabase api will be passed to next frontend build for app deployment
|
||||
NEXT_PUBLIC_SUPABASE_URL=https://<project-id>.supabase.co
|
||||
NEXT_PUBLIC_SUPABASE_ANON_KEY=<your-anon-key>
|
||||
# The frontend site url, will be used by Supabase Auth services to properly configure auth redirects
|
||||
SUPABASE_AUTH_SITE_URL=https://<app-website-url>vercel.app/
|
||||
SUPABASE_AUTH_ADDITIONAL_REDIRECT_URLS=https://<app-website-url>vercel.app/**,https://<app-website-url>vercel.app/
|
||||
# Credentials for github connection
|
||||
SUPABASE_AUTH_EXTERNAL_GITHUB_CLIENT_ID=encrypted:BLoqgNAyszYB04dGrTrZd/0UiRADDvSfnpuWhP3lqH70AxKLmh7zTLfmGP/S8giNzWp5cK4b95nXvk8ayqMdV8c/7D3vpDNMNS+abJrbKw6cf1GYVeKmq5bCTi4P4nE2zNUdAP5H4MkTsok+KsZE9NEhqvlZ
|
||||
SUPABASE_AUTH_EXTERNAL_GITHUB_SECRET="encrypted:BHJaDty+uIxt+fYPBmIH5zEcTc0Jj8E5lAseiVEk272rNlVNQHjuCIgnEBNUK5tfnwJa+zVKLvvIzin03SKjGum7Naa4jr5P3dPVqG3hFJe8WNOFK+13EuC/lDun8MFa2ODjq/Mk50jKcc44AdDL9GIYXZ8lJ0RhS54fGUx3rO3U0gXD6/8mua8="
|
||||
File renamed without changes.
+3
-4
@@ -33,11 +33,11 @@ enabled = true
|
||||
enabled = true
|
||||
# The base URL of your website. Used as an allow-list for redirects and for constructing URLs used
|
||||
# in emails.
|
||||
# site_url = "env(SUPABASE_AUTH_SITE_URL)"
|
||||
site_url = "env(SUPABASE_AUTH_SITE_URL)"
|
||||
# A list of *exact* URLs that auth providers are permitted to redirect to post authentication.
|
||||
additional_redirect_urls = [
|
||||
# Will be localhost:3000 in development or the URL of your deployed app in production.
|
||||
# "env(SUPABASE_AUTH_ADDITIONAL_REDIRECT_URLS)",
|
||||
"env(SUPABASE_AUTH_ADDITIONAL_REDIRECT_URLS)",
|
||||
]
|
||||
# How long tokens are valid for, in seconds. Defaults to 3600 (1 hour), maximum 604,800 (1 week).
|
||||
jwt_expiry = 3600
|
||||
@@ -64,7 +64,7 @@ max_frequency = "1m0s"
|
||||
# Number of characters used in the email OTP.
|
||||
otp_length = 6
|
||||
# Number of seconds before the email OTP expires (defaults to 1 hour).
|
||||
otp_expiry = 3600
|
||||
otp_expiry = 86400
|
||||
|
||||
# Email testing server. Emails sent with the local dev setup are not actually sent - rather, they
|
||||
# are monitored, and you can view the emails that would have been sent from the web interface.
|
||||
@@ -88,7 +88,6 @@ uri = "pg-functions://postgres/public/custom_access_token_hook"
|
||||
enabled = true
|
||||
client_id = "env(SUPABASE_AUTH_EXTERNAL_GITHUB_CLIENT_ID)"
|
||||
secret = "env(SUPABASE_AUTH_EXTERNAL_GITHUB_SECRET)"
|
||||
redirect_uri = "env(SUPABASE_AUTH_REDIRECT_URI)"
|
||||
|
||||
|
||||
[analytics]
|
||||
File renamed without changes.
File renamed without changes.
File renamed without changes.
Reference in new issue
Block a user