⌘K

Studio Self-Hosting

Deploy nativeblocks-studio on your own infrastructure using Docker.

This guide covers deploying nativeblocks-studio on your own infrastructure.

Note: The Studio is a frontend application that connects to a running nativeblocks-core-api instance. Make sure your core API is deployed and reachable before setting up the Studio.


Prerequisites

RequirementNotes
DockerRecommended deployment method
nativeblocks-core-apiRunning and publicly reachable

Environment Variables

Environment variables are injected at container startup and made available to the app at runtime.

VariableRequiredDescription
VITE_WEBSITE_URLYesDashboard URL, e.g. https://nativeblocks.io/dashboard
VITE_API_ENDPOINT_GRAPHQL_URLYesCore API GraphQL endpoint, e.g. https://api.yourcompany.com/graphql
VITE_API_REALTIME_ENDPOINT_URLYesRealtime WebSocket endpoint, e.g. wss://api.yourcompany.com/hotReload
VITE_SENTRY_DSNNoSentry DSN for error reporting

Docker Deployment

Pull and run

docker pull nativeblocks/nativeblocks-studio:selfhost

docker run -d \
  --name nativeblocks-studio \
  --restart unless-stopped \
  -p 80:80 \
  -e VITE_WEBSITE_URL="https://nativeblocks.io/dashboard" \
  -e VITE_API_ENDPOINT_GRAPHQL_URL="https://api.yourcompany.com/graphql" \
  -e VITE_API_REALTIME_ENDPOINT_URL="wss://api.yourcompany.com/hotReload" \
  -e VITE_SENTRY_DSN="<your-sentry-dsn>" \
  nativeblocks/nativeblocks-studio:selfhost

Docker Compose Deployment

version: "3.9"

services:
  studio:
    image: nativeblocks/nativeblocks-studio:selfhost
    restart: unless-stopped
    ports:
      - "80:80"
    environment:
      VITE_WEBSITE_URL: "https://nativeblocks.io/dashboard"
      VITE_API_ENDPOINT_GRAPHQL_URL: "https://api.yourcompany.com/graphql"
      VITE_API_REALTIME_ENDPOINT_URL: "wss://api.yourcompany.com/hotReload"
      VITE_SENTRY_DSN: "<your-sentry-dsn>"
docker compose up -d

Reverse Proxy (Nginx)

server {
    listen 443 ssl;
    server_name studio.yourcompany.com;

    ssl_certificate     /etc/ssl/certs/yourcompany.crt;
    ssl_certificate_key /etc/ssl/private/yourcompany.key;

    location / {
        proxy_pass         http://127.0.0.1:80;
        proxy_http_version 1.1;
        proxy_set_header   Upgrade $http_upgrade;
        proxy_set_header   Connection "upgrade";
        proxy_set_header   Host $host;
        proxy_set_header   X-Real-IP $remote_addr;
        proxy_set_header   X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header   X-Forwarded-Proto $scheme;
    }
}

server {
    listen 80;
    server_name studio.yourcompany.com;
    return 301 https://$host$request_uri;
}

Upgrading

docker pull nativeblocks/nativeblocks-studio:selfhost
docker compose up -d --no-deps studio

Minimum Resource Recommendations

ComponentCPUMemory
studio0.5 vCPU512 MB