Skip to main content
Set up your development environment to work with the Cloud API and local services.

​
Environment variables

Create .env.local in your project root:
.env.local
# Required - Set deployment mode
DEVKIT4AI_MODE=project

# Required - Cloud API URL
NEXT_PUBLIC_API_URL=https://api.vibecoding.ad

# Required - Your credentials from Cloud Admin
DEVKIT4AI_DEVELOPER_KEY=dk_your_developer_key_from_cloud_admin
DEVKIT4AI_PROJECT_ID=your-project-uuid-from-cloud_admin
DEVKIT4AI_PROJECT_KEY=ak_your_project_api_key_from_cloud_admin

# Optional - Deployment environment identifier
ENVIRONMENT=local
1

Get your credentials

Log into Cloud Admin and create a project. Copy your:
  • Developer Key (starts with dk_)
  • Project ID (UUID format)
  • Project API Key (starts with ak_)
2

Create .env.local file

Copy the template above and replace placeholders with your actual credentials.
Never commit .env.local to version control. It’s already in .gitignore.
3

Verify configuration

Start the dev server:
npm run dev
If configuration is invalid, you’ll see an amber banner at the top of the page with specific errors.

​
Configuration validation

The Starter Kit automatically validates your environment on startup: Error-level issues (blocks API calls):
  • Missing required environment variables
  • Invalid Project ID format (must be UUID)
  • Invalid API URL format
Warning-level issues (app works but review recommended):
  • Using default values
  • Non-standard configuration
Check the browser console and terminal output for detailed validation messages.

​
Multiple environments

Create environment-specific files: 
.env.local          # Local development
.env.development    # Development server
.env.staging        # Staging environment  
.env.production     # Production (use hosting provider secrets)
Next.js loads these automatically based on NODE_ENV.

​
Environment-specific API URLs

For testing against different API environments:
.env.local
# Production Cloud API (default)
NEXT_PUBLIC_API_URL=https://api.vibecoding.ad

# Or alternative deployment
NEXT_PUBLIC_API_URL=https://api.devkit4ai.com

​
Security best practices

Never expose sensitive credentials:
  • Don’t commit .env.local or .env.production
  • Don’t log environment variables in client code
  • Don’t share developer or API keys publicly
  • Rotate keys if accidentally exposed
For production:
  • Use your hosting provider’s secret management (Vercel, Netlify, etc.)
  • Enable environment variable encryption when available
  • Restrict API keys to specific domains in Cloud Admin

​
Troubleshooting

Check that:
  • .env.local exists in project root
  • All required variables are set
  • Project ID is valid UUID format
  • No extra spaces or quotes around values
Verify:
  • Developer key is correct and active
  • Project ID matches your Cloud Admin project
  • Project API key hasn’t been revoked
  • Restart dev server after changing .env.local
The file might be hidden in your file browser:
# Create it from terminal
touch .env.local

# Open in editor
code .env.local

​
Next steps

Frontend Development

Start building your application

Cloud Admin

Manage credentials and settings