Dashboard

Quick Links

• 📚 Documentation
• 💬 Discord Community
• 🐛 Issue Tracker
• 🤝 Contributing Guide

Overview

Our Dashboard is a modern, feature-rich web application built to manage and monitor E2B services. Built with Next.js 16 and React 19, it provides a seamless user experience for managing sandboxes, API keys, and usage analytics.

Features

• Modern Stack: Built with Next.js 16, React 19, and TypeScript
• Real-time Analytics: Monitor your sandbox usage and performance
• Authentication: Secure authentication powered by Supabase
• Type Safety: Full TypeScript support throughout the codebase

Getting Started

Self-hosting Note: If you're planning to self-host this dashboard, you'll likely want to self-host our infrastructure first. Please refer to our infrastructure repository for guidance on setting up the E2B platform on your own infrastructure.

Prerequisites

• Node.js 20.9+
• Git
• Vercel account
• Supabase account

Local Development Setup

1. Clone the repository

git clone https://github.com/e2b-dev/dashboard.git
cd dashboard

2. Install dependencies

# Using Bun (recommended)
bun install

# Using npm
npm install --legacy-peer-deps

3. Environment Variables

# Copy the example env file
cp .env.example .env.local

4. Set up required services:

a. Supabase Setup

1. Create a new Supabase project

2. Go to Project Settings > API

3. Copy the anon key & service_role key to populate .env.local

4. Configure authentication:

   • Go to Authentication > URL Configuration
   • Set Site URL to the hosting domain
   • Add http://localhost:3000/** to Redirect URLs (for development)

5. Enable auth providers:

   • Go to Authentication > Providers
   • Enable the providers you want to use (GitHub, Google, E-Mail)
   • Configure each provider with the appropriate credentials

6. Configure e-mail templates:

   • Navigate to Authentication → Templates in the Supabase dashboard
   • Update the URLs in the Reset Password and Confirm Sign-Up templates so that the CTA links point back to the dashboard's confirmation endpoint:

   Reset Password

   {{ .SiteURL }}/api/auth/confirm?token_hash={{ .TokenHash }}&type=recovery&next={{ .RedirectTo }}&confirmation_url={{ .ConfirmationURL }}
   

   Confirm Sign-Up

   {{ .SiteURL }}/api/auth/confirm?token_hash={{ .TokenHash }}&type=email&next={{ .RedirectTo }}&confirmation_url={{ .ConfirmationURL }}
   

b. Supabase Storage Setup

1. Go to Storage > Buckets
2. Create a new public bucket named profile-pictures

c. Key-Value Store Setup (Optional)

Redis/KV is optional for standard dashboard deployments, including local, enterprise, and on-prem environments. The dashboard can boot and run core auth and dashboard workflows without KV configured.

KV is currently used for optional capability checks and for deduplicating ZeroBounce alternate-email warnings. If you need those capabilities, configure a Vercel/Upstash Redis REST-compatible store:

KV_REST_API_URL=your_redis_rest_api_url
KV_REST_API_TOKEN=your_redis_api_write_token

Note: @vercel/kv expects a Redis REST API. A raw Redis server such as redis://localhost:6379 is not compatible without an Upstash-compatible REST proxy.

Health check: When KV_REST_API_URL and KV_REST_API_TOKEN are set, /api/health will report 503 degraded if KV is unreachable. Leave both unset to opt out of the KV health check entirely.

d. Start the development server

# Using Bun (recommended)
bun run dev

# Using npm
npm run dev

The application will be available at http://localhost:3000

Development

Available Scripts

# Using Bun (recommended)
bun run dev         # Start development server
bun run build      # Create production build
bun run start      # Start production server
bun run preview    # Build and preview production
bun run lint       # Run Biome linter
bun run lint:fix   # Auto-fix Biome lint issues
bun run format     # Format + organize imports with Biome
bun run check      # Run full Biome check (lint + format + imports)

# All commands work with npm as well:
npm run dev
# etc...

Project Structure

src/
├── app/          # Next.js App Router pages and layouts
├── configs/      # Global constants, feature flags, and URL maps
├── core/         # Server-side logic: actions, adapters, modules, and shared clients
├── features/     # Domain-specific components (auth, dashboard, billing, etc.)
├── lib/          # Utility functions, hooks, and shared helpers
├── styles/       # Global styles and Tailwind config
├── trpc/         # tRPC client and server setup
├── types/        # TypeScript type definitions
└── ui/           # Reusable UI primitives and Shadcn components
tests/
├── unit/         # Vitest unit tests
├── integration/  # Vitest integration tests
├── development/  # Vitest development helper tests
└── preview/      # Playwright preview/user-flow tests

Testing

We use a layered testing strategy with Vitest and Playwright. For details on test types, commands, and conventions, see the Testing README.

Environment Variables

See src/lib/env.ts for all required environment variables and their validation schemas.

Production Deployment

This application is optimized for deployment on Vercel:

1. Push your changes to GitHub
2. Import your repository in Vercel
3. Deploy!

Note: The application uses Partial Prerendering (PPR) which is currently only supported on Vercel's infrastructure. This can be turned off inside next.config.mjs.

Contributing

We welcome contributions! Please see our Contributing Guide for details.

Support

If you need help or have questions:

1. Check our Documentation
2. Join our Discord Community
3. Open an Issue

License

This project is licensed under the Apache License, Version 2.0 - see the LICENSE file for details.

Copyright 2025 FoundryLabs, Inc.