Deploying AI-Generated Apps

Choosing a Deployment Platform

Different platforms excel at different things. Here's a quick comparison:

Method 1: Deploy from Bolt.new (Easiest)

Bolt.new has built-in deployment. This is the fastest way to get online:

1. Click "Deploy" in Bolt.new's interface (top right)
2. Choose Netlify or Vercel (both work great)
3. Sign in with GitHub if you haven't already
4. Click "Deploy" and wait 30-60 seconds
5. Get your live URL - something like your-app-name.netlify.app

That's it! Your app is live and automatically updates when you make changes in Bolt.new.

Method 2: Deploy to Vercel (Recommended)

Step 1: Export Your Code

If your code is in Bolt.new, download it:

• Click the menu icon (three dots)
• Select "Download project"
• Unzip the downloaded file

Step 2: Push to GitHub

Open your terminal in the project folder:

git init
git add .
git commit -m "Initial commit"
git branch -M main
git remote add origin https://github.com/YOUR-USERNAME/YOUR-REPO.git
git push -u origin main

Replace YOUR-USERNAME and YOUR-REPO with your GitHub details. Create the repo on GitHub first if you haven't.

Step 3: Connect to Vercel

1. Go to vercel.com and sign in with GitHub
2. Click "Add New Project"
3. Select your repository from the list
4. Vercel auto-detects settings (usually perfect as-is)
5. Click "Deploy"

In 1-2 minutes, you'll get a live URL like your-app.vercel.app

Step 4: Set Up Auto-Deploy

Vercel automatically redeploys when you push to GitHub. Make a change:

git add .
git commit -m "Update homepage text"
git push

Your site rebuilds automatically. Check the Vercel dashboard to watch the deploy.

Method 3: Deploy to Netlify

Netlify is great for static sites and simple React apps:

Option A: Drag & Drop (No Git Required)

1. Build your project locally: npm run build
2. Go to app.netlify.com/drop
3. Drag your build or dist folder onto the page
4. Get instant deployment!

Option B: Git Integration (Auto-Deploy)

1. Push your code to GitHub (same as Vercel method)
2. Go to Netlify and sign in
3. Click "Add new site" → "Import an existing project"
4. Connect to GitHub and select your repo
5. Configure build settings:
   • Build command: npm run build
   • Publish directory: dist or build
6. Click "Deploy site"

Adding a Custom Domain

Turn your-app.vercel.app into yourdomain.com:

On Vercel:

1. Go to your project settings → "Domains"
2. Enter your domain (buy one from Namecheap or Porkbun if you don't have one)
3. Follow DNS instructions to point domain to Vercel
4. Wait 5-60 minutes for DNS propagation
5. SSL certificate auto-configures (free HTTPS!)

On Netlify:

1. Go to "Domain settings" in your site dashboard
2. Click "Add custom domain"
3. Enter your domain
4. Update your DNS records (Netlify shows you exactly what to add)
5. Enable HTTPS (automatic and free)

Environment Variables & Secrets

If your app uses API keys or secrets, don't commit them to GitHub! Add them to your deployment platform:

Vercel:

1. Project settings → "Environment Variables"
2. Add each variable (e.g., OPENAI_API_KEY)
3. Choose environments (Production, Preview, Development)
4. Redeploy to apply changes

Netlify:

1. Site settings → "Environment variables"
2. Click "Add a variable"
3. Enter key and value
4. Redeploy (Netlify auto-redeploys on variable changes)

Troubleshooting Deployment Issues

"scripts": {
  "build": "vite build"  // or "next build", etc.
}

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

Deployment Checklist

Before going live, make sure you've:

Monitoring Your Live App

Once deployed, keep an eye on things:

• Vercel Analytics - Free built-in performance monitoring
• Netlify Analytics - Server-side analytics (paid)
• Sentry - Error tracking and crash reporting
• Plausible - Privacy-friendly analytics alternative

Advanced: Deploy with Databases

If your app needs a database, Railway makes it easy:

1. Go to Railway and sign in with GitHub
2. Create a new project from your GitHub repo
3. Add a PostgreSQL database (one click)
4. Railway auto-connects your app to the database
5. Use environment variables for the connection string

Railway charges based on usage (~$5/month for small apps).

Free Tier Limits

Know what you get for free:

When to Upgrade

Free tiers work great for side projects and MVPs. Upgrade when you:

• Exceed bandwidth limits (usually means you have real traffic—congrats!)
• Need password protection or team collaboration
• Want advanced analytics and monitoring
• Require SLA/uptime guarantees for business use

For enterprise deployments and white-label solutions, explore Reinventing.AI.

Learning Resources

• Vercel Documentation - Comprehensive deployment guides
• Netlify Docs - Everything about Netlify deployment
• Railway Docs - Full-stack deployment tutorials

Next Steps

• →Build a project to deploy
• →Fix deployment issues with AI
• →Optimize your app for production
• →Read the complete vibe coding guide