Deployment

Prerequisites

Before deploying, you need:

Create Supabase Project
- Go to supabase.com
- Click "New Project"
- Note your project URL and API keys

Push Database Migrations

# Link to your Supabase project
npx supabase link --project-ref your-project-ref

# Push all migrations
npx supabase db push

Configure Environment Variables
- Get credentials from Supabase dashboard
- Set up in your deployment platform

Environment Variables

Required variables for deployment:

VITE_SUPABASE_URL=https://your-project.supabase.co
VITE_SUPABASE_PUBLISHABLE_KEY=your-publishable-key

Build

Supasheet is a Vite SPA. Build it with:

npm run build

This outputs static files to the dist/ directory. Preview the production build locally before deploying:

npm run preview

Deployment Platforms

Netlify (Recommended)

npm i -g netlify-cli
netlify login
netlify deploy --prod --dir=dist

Or connect your Git repository at netlify.com:

Build command: npm run build
Publish directory: dist

Add environment variables under Site Settings → Environment Variables.

Vercel

npm i -g vercel
vercel login
vercel --prod

Set the output directory to dist in your Vercel project settings. Add environment variables under Settings → Environment Variables.

Cloudflare Pages

Go to dash.cloudflare.com → Workers & Pages
Connect your Git repository
Set build command: npm run build
Set output directory: dist
Add environment variables and deploy

Docker

Serve the static build with nginx:

Dockerfile:

FROM node:18-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build

FROM nginx:alpine
COPY --from=builder /app/dist /usr/share/nginx/html
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80

nginx.conf (required for client-side routing):

server {
  listen 80;
  root /usr/share/nginx/html;
  index index.html;

  location / {
    try_files $uri $uri/ /index.html;
  }
}

docker build -t supasheet .
docker run -p 80:80 supasheet

VPS (Ubuntu/Debian)

# Install dependencies
sudo apt update && sudo apt install -y nodejs npm nginx

# Clone and build
git clone https://github.com/htmujahid/supasheet.git
cd supasheet
npm install
npm run build

# Copy build to nginx web root
sudo cp -r dist/* /var/www/html/

# Configure nginx for SPA routing
sudo tee /etc/nginx/sites-available/supasheet <<'EOF'
server {
  listen 80;
  server_name yourdomain.com;
  root /var/www/html;
  index index.html;

  location / {
    try_files $uri $uri/ /index.html;
  }
}
EOF

sudo ln -s /etc/nginx/sites-available/supasheet /etc/nginx/sites-enabled/
sudo nginx -t && sudo systemctl reload nginx

Pushing Migrations

After deploying, ensure migrations are applied:

# Link to your Supabase project
npx supabase link --project-ref your-project-ref

# Push all migrations
npx supabase db push

For CI/CD pipelines:

export SUPABASE_PROJECT_REF=your-project-ref
export SUPABASE_ACCESS_TOKEN=your-access-token

npx supabase db push

Post-Deployment

Verify Deployment
- Visit your deployed URL
- Test sign up/sign in
- Check CRUD operations
Configure Custom Domain (optional)
- Add domain in platform settings
- Update DNS records
- Wait for SSL provisioning
Monitor
- Check deployment logs
- Verify database connection
- Test critical features

Next Steps

Environment Variables - Full variable list
Production Checklist - Pre-launch verification

Deployment

On this page