Stack0

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:

Bolt Chat Prompt
# 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_here
 
Make 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.

Related Resources

bolt.newQuickstartScreenshots SDK