Bolt.new
Build full-stack applications in your browser with Bolt.new, powered by Stack0 for email and files.
⚡ Quick Setup
Bolt.new runs entirely in the browser and supports npm packages. Just tell it to install @stack0/sdk and provide your API key.
Starting Your Project
Open bolt.new and paste one of these prompts to get started:
📧 Contact Form App
Create a Next.js app with a beautiful contact form.
Requirements:
- Modern, clean design with Tailwind CSS
- Form fields: name, email, subject, message
- Form validation
- Loading state and success/error messages
- Dark mode support
Backend:
- Create an API route at /api/contact
- Use Stack0 SDK (@stack0/sdk) to send emails
```typescript
import { Stack0 } from '@stack0/sdk'
const stack0 = new Stack0({
apiKey: process.env.STACK0_API_KEY!
})
await stack0.mail.send({
from: 'contact@mysite.com',
to: 'team@mysite.com',
subject: formSubject,
html: emailHtml,
})
```
Set STACK0_API_KEY in environment variables.🖼️ Image Gallery App
Build an image gallery application with Next.js.
Features:
- Grid layout for images
- Upload new images
- Lightbox view for full-size images
- Delete functionality
- Responsive design
Use Stack0 CDN for image storage:
```typescript
import { Stack0 } from '@stack0/sdk'
const stack0 = new Stack0({
apiKey: process.env.STACK0_API_KEY!
})
// Get presigned upload URL
const { uploadUrl, cdnUrl, assetId } = await stack0.cdn.getUploadUrl({
filename: file.name,
mimeType: file.type,
size: file.size,
})
// Upload directly to CDN
await fetch(uploadUrl, {
method: 'PUT',
body: file,
})
// Confirm upload
await stack0.cdn.confirmUpload({ assetId })
// Use cdnUrl to display image
// Add transforms: cdnUrl + '?w=400&h=300&fit=cover'
```
Set STACK0_API_KEY in environment variables.📰 Newsletter Platform
Create a newsletter subscription platform.
Features:
- Landing page with email signup
- Admin dashboard to compose newsletters
- Subscriber list management
- Send to all subscribers
- Unsubscribe handling
Use Stack0 for sending newsletters:
```typescript
import { Stack0 } from '@stack0/sdk'
const stack0 = new Stack0({
apiKey: process.env.STACK0_API_KEY!
})
// Send to single subscriber
await stack0.mail.send({
from: 'newsletter@mysite.com',
to: subscriberEmail,
subject: newsletterSubject,
html: newsletterContent,
})
// Send to multiple (batch)
for (const subscriber of subscribers) {
await stack0.mail.send({
from: 'newsletter@mysite.com',
to: subscriber.email,
subject: newsletterSubject,
html: newsletterContent,
})
}
```
Set STACK0_API_KEY in environment variables.
Store subscribers in a JSON file or SQLite for simplicity.📸 Screenshot Tool
Build a URL screenshot tool.
Features:
- Input field for URL
- Take screenshot button
- Display captured screenshot
- Download option
- History of recent screenshots
Use Stack0 Screenshots API:
```typescript
import { Stack0 } from '@stack0/sdk'
const stack0 = new Stack0({
apiKey: process.env.STACK0_API_KEY!
})
const screenshot = await stack0.screenshots.capture({
url: targetUrl,
format: 'png',
fullPage: false,
viewport: {
width: 1280,
height: 720,
},
})
// screenshot.url contains the image URL
```
Set STACK0_API_KEY in environment variables.Setting Up Environment Variables in Bolt
After Bolt creates your project, add your Stack0 API key:
# Tell Bolt to create/update .env.local file:"Add STACK0_API_KEY to the environment variables.Create a .env.local file with:STACK0_API_KEY=sk_live_your_api_key_hereMake sure the API route reads from process.env.STACK0_API_KEY"
Troubleshooting Common Issues
SDK not installing
Tell Bolt: "Install @stack0/sdk using npm. Add it to package.json dependencies."
API key not working
Make sure .env.local exists and the variable name is exactly STACK0_API_KEY.
CORS errors
Stack0 API calls must be made from server-side (API routes), not client-side.
Type errors
Tell Bolt: "Add TypeScript types for Stack0. The SDK includes built-in types."
Exporting Your Project
Once you're happy with your Bolt project, you can:
Deploy to Vercel
Click the deploy button and add STACK0_API_KEY to Vercel's environment variables.
Download Code
Export the project and run locally or deploy anywhere.