Prerequisites
Before deploying, ensure you have:Deploy to Vercel
The fastest way to deploy the dashboard is using Vercel’s GitHub integration.Option 1: Deploy with Vercel Button
Option 2: Manual Deployment
Import Repository
- Go to vercel.com/new
- Import your Git repository
- Select the
dashboardfolder as the root directory
Configure Build Settings
Vercel will automatically detect Next.js. Verify these settings:
- Framework Preset: Next.js
- Build Command:
pnpm build(ornpm run build) - Output Directory:
.next - Install Command:
pnpm install(ornpm install)
Environment Variables
Configure these environment variables in your Vercel project settings:Required Variables
Your Tinybird admin token or read token. Get it from Tinybird Console → Tokens.
Your Tinybird API host URL. Common values:
https://api.tinybird.co(EU Shared)https://api.us-east.tinybird.co(US East)https://api.us-east.aws.tinybird.co(AWS US East)https://api.eu-central-1.aws.tinybird.co(AWS EU Central)
The public URL of your deployed dashboard (e.g.,
https://analytics.yourdomain.com).For local development, use http://localhost:3000.Optional Variables
Token for tracking analytics on the dashboard itself (dogfooding). Create a token with append permissions to the
analytics_events Data Source.Username for basic authentication. See Authentication for details.
Password for basic authentication.
Set to
true to disable authentication during development. Never use in production.API endpoint for the AI chat feature. Use the default endpoint or deploy your own.
Multi-Tenant Configuration
If using multi-tenant mode, specify the tenant ID to filter data.
Vercel Configuration
The dashboard includes a Next.js configuration optimized for Vercel:The
transpilePackages option ensures the Tinybird packages are properly bundled for deployment.Custom Domain
To use a custom domain with your Vercel deployment:Add Domain in Vercel
- Go to your project settings in Vercel
- Navigate to “Domains”
- Add your custom domain (e.g.,
analytics.yourdomain.com)
Alternative Deployment Platforms
While Vercel is recommended, you can deploy to other platforms:Docker
Node.js Server
Ensure your hosting platform supports Node.js 18+ and can serve the Next.js application.
Production Checklist
Before launching to production:Security
- Change default authentication credentials
- Set up HTTPS/SSL certificate
- Keep
TINYBIRD_TOKENsecret (server-only) - Set
DISABLE_AUTH=false
Configuration
- Verify all environment variables are set
- Test authentication flow
- Confirm data is loading correctly
- Check all time ranges work
Performance
- Enable caching in Tinybird pipes
- Configure SWR revalidation intervals
- Test load times
- Monitor Vercel analytics
Troubleshooting
Build fails with 'Module not found' error
Build fails with 'Module not found' error
Ensure
transpilePackages is configured in next.config.js to include Tinybird packages:Dashboard shows authentication error
Dashboard shows authentication error
- Verify
TINYBIRD_TOKENis set correctly - Check the token has read permissions for all analytics pipes
- Confirm
TINYBIRD_HOSTmatches your workspace region
No data appears in charts
No data appears in charts
- Verify the tracker is sending events to Tinybird
- Check that pipes are published and working in Tinybird Console
- Inspect browser console for API errors
- Verify time range selection includes data
AI chat not working
AI chat not working
Ensure
NEXT_PUBLIC_ASK_TINYBIRD_ENDPOINT is set to a valid endpoint. The default endpoint is:Next Steps
Configure Authentication
Set up secure access to your dashboard
Customize the Dashboard
Adapt the UI to match your brand