How to Deploy an AI-Built App to Production

You built your AI app in 20 minutes using Claude or Lovable. Now you've spent three weeks getting it into production. Welcome to the localhost wall. This guide walks you through the exact steps to cross it, from first push to live URL, regardless of your app's architecture.

The Localhost Wall: Why AI-Built Apps Stall at Deployment

AI-built apps hit a deployment wall that traditional apps avoid. The generator handles code logic perfectly but cannot configure databases, secrets management, or server infrastructure. Developers must manually solve these problems. Most teams spend 70% of deployment time on infrastructure, not writing code.

The core issue: AI coding tools like Claude Code, Lovable, and Bolt.new operate in a sandbox. They export working JavaScript, Python, or React code, but that code is untrusted. It has hardcoded API keys, assumes localhost:3000, and contains assumptions the generator cannot verify. Moving to production requires removing these assumptions one by one.

Here's what actually breaks: (1) Secrets leak. API keys are in plaintext. You must strip and inject them as environment variables. (2) Databases don't exist. The generator assumes they exist, but you must provision Postgres or MongoDB first. (3) Build and dependencies fail. Your machine has Node.js installed; the server doesn't. (4) Performance craters. Localhost magic doesn't scale. Requests pile up, cold starts slow everything down, rate limits hit hard.

The Deployment Decision Tree: Which Architecture?

Your app's architecture determines which deployment path you follow. Three patterns cover 95% of AI-built apps: static frontends only, full-stack apps without databases, and full-stack apps with persistent storage. Each path has different infrastructure needs, costs, and complexity.

Ask two questions: (1) Does your app have a backend? If it's pure React/Vue with no API calls to a server, you're Path 1 (static). If it calls a backend API (Node.js, Python), it's Path 2 or 3. (2) Does the backend need persistent data? If no, it's Path 2. If yes, it's Path 3.

Path 1: Static (HTML/CSS/JS only). Deploy to Vercel or Netlify. Cost: $0-20/month. Path 2: Full-stack, no database. Deploy backend + frontend together on Railway or Render. Cost: $5-50/month. Path 3: Full-stack + database. Add Postgres/MongoDB and deploy everything together. Cost: $20-150/month.

Path 1: Static Frontend Only

If your app is pure HTML, CSS, and JavaScript with no backend API and no database, deploy it as static. Platforms like Vercel and Netlify serve files instantly worldwide. This path is fastest and cheapest for simple apps.

When this works: You built a calculator, converter, or design tool. No API calls. No database. Pure client-side React/Vue.

When it doesn't: Your app calls an external API (OpenAI, weather data) directly from the browser. Browsers block cross-origin requests. You need a backend proxy. This becomes Path 2.

How to deploy:

1. Export your code to GitHub. Most AI builders (Lovable, Bolt.new) can export directly. If yours can't, create a GitHub repo and paste the code.
2. Connect to Vercel or Netlify. Both offer free GitHub integration. Sign up, authorize GitHub, select your repo.
3. Set your build command. For React: npm run build. For HTML: leave it blank.
4. Deploy. Automatic. Your app is live at https://your-app.vercel.app in 30 seconds.
5. Add a custom domain (optional). Costs ~$10/year for your own domain.

Cost: $0-20/month.

Gotchas: You forgot to gitignore your.env file (never commit secrets). Your build command is wrong (check your package.json). The exported code has errors buried in logs (open browser DevTools to debug).

Path 2: Full-Stack Without a Database

You have a Node.js or Python backend that handles API calls, form validation, or integrations with external services. But your app doesn't store user data. Deploy both frontend and backend together on Railway or Render. This path is balanced: simple but powerful.

When this works: Your backend calls OpenAI, Anthropic, or another API and returns results. Your frontend is a client for that backend. No user accounts, no saved files.

When it doesn't: You need to save user data (accounts, documents, preferences). This becomes Path 3.

How to deploy:

1. Push your code to GitHub. Include a package.json (Node) or requirements.txt (Python) and a start script (npm start or python app.py).
2. Connect to Railway or Render. Both have free GitHub integration. Sign up, authorize, select your repo.
3. Set environment variables. If your backend calls OpenAI, add OPENAI_API_KEY=sk-xxx as an env var. Most platforms provide a dashboard for this.
4. Deploy. Railway and Render auto-detect Node.js or Python. They run npm install (or pip install) and start your server. Live in 2-3 minutes.
5. Connect your frontend. Update your frontend code to call your backend's production API endpoint instead of localhost:3000.

Cost: $5-50/month. Render's free tier sleeps after 15 min (not great). Railway's free tier includes $5/month credit. Paid tiers ($10-50/month) offer faster servers and no sleep.

Gotchas: Your backend doesn't start (check logs--usually missing dependencies or PORT env var). Environment variables leak (hardcoded API keys in code--use.env files and gitignore). Your frontend calls localhost:3000 (won't work on the server--use process.env.REACT_APP_API_URL).

Path 3: Full-Stack + Database

You need persistent storage: user accounts, documents, or application state saved between sessions. Add a database (Postgres, MongoDB, or SQLite) and connect it to your backend. This is the most common path for production apps.

When this works: Your app has sign-up, saves documents, or maintains user state. Most production apps live here.

How to deploy (managed):

1. Provision a database on Railway or Render. Click 'Add database,' choose Postgres, it's created in 30 seconds.
2. Get the connection string. The platform generates DATABASE_URL=postgres://user:pass@host:5432/dbname. Add this as an env var in your backend.
3. Run migrations. If you used Drizzle or Sequelize, run drizzle-kit push or npm run migrate. The database initializes.
4. Deploy your backend. Same as Path 2. Push to GitHub, it auto-detects DATABASE_URL and connects.
5. Test it. Make an API call from your frontend to verify the backend can read and write to the database.

Cost: Managed Postgres on Railway starts at $10/month (shared). Dedicated instances run $50+/month. Hobby apps fit on shared plans.

DIY alternative (Hetzner + Coolify): Rent a Hetzner VPS for EUR 3.99/month. Install Coolify (open-source Docker PaaS). Coolify handles databases, SSL, and deployment. Total cost: $5-15/month. Trade-off: you manage the server, troubleshoot outages, and handle backups yourself. Not recommended unless you love DevOps.

Common gotchas: Connection string is wrong (Postgres and MongoDB formats differ). Migrations don't run (check logs). Your code has N+1 queries (one query per user in a loop--add.join() in your ORM). Database grows unchecked (set up backups).

The Three-Week Debugging Journey: What Actually Breaks

Deployment doesn't end when your app goes live. The first three weeks are a debugging gauntlet. Teams that expect smooth handoff hit predictable snags. Here's what breaks and when.

Week 1: Secrets and environment variables leak. Your exported code has API keys in comments or.env files committed to Git. The moment production runs, your API quota explodes or your frontend hits localhost:3000 (404). Fix: audit your code. Use environment variables. Rotate leaked keys. Check Git history--if you committed a key, it's compromised forever.

Week 2: Scaling and rate limits. You launched to friends. Requests spike. Cold starts (first request to serverless takes 5+ seconds) make your app feel broken. Database queries slow. External APIs hit rate limits. Fix: add caching. Batch requests. Upgrade your server if on managed PaaS, or add more VPS nodes if DIY. Set up alerts.

Week 3: Monitoring and rollbacks. Your app is live but you have no visibility. Silent bugs corrupt data. You have no logs. You can't roll back. Fix: add logging (Sentry or platform logs). Tag each deployment with a git commit hash. Keep the previous version running so you can flip a switch to roll back.

Tradeoff Comparison: DIY vs Managed vs Hybrid

Three strategies exist. Each trades cost against control and learning curve. Pick the one matching your risk tolerance, time, and comfort with operations.

Strategy 1: DIY (Hetzner + Coolify). Cost: $5-15/month. You rent a Hetzner VPS (EUR 3.99/month). Install Coolify (Docker-based open-source PaaS). Coolify handles databases, SSL, and deployment. You own the server, backups, and outages.

Pros: Cheapest. Full control. No vendor lock-in. Cons: Learn Docker and Linux. Outages are your problem. Scaling means renting more VPS.

Right for: Bootstrapped founders, side projects, teams with DevOps expertise.

Strategy 2: Managed PaaS (Railway, Render, Northflank). Cost: $20-100+/month. Click a button, your app is live. Databases, SSL, domains, auto-scaling are managed. Outages are the platform's responsibility.

Pros: Zero DevOps. Auto-scaling. Better uptime. Excellent logging. Cons: Vendor lock-in (switching is painful). Less control. Expensive at scale.

Right for: Seed-stage startups, teams without DevOps expertise, apps that can't afford downtime.

Strategy 3: Hybrid (Opsily). Cost: Predictable flat pricing. Opsily targets teams with working apps who want simplicity without pure managed PaaS costs.

Pros: Predictable costs (no surprise overages). Managed experience with builder-friendly pricing. Database and infrastructure included. Cons: Less flexible than DIY, more expensive than bare metal.

Right for: Teams at 'I have a real app, I'm hiring, I want one less thing to manage' stage.

For the cheapest way to host a full-stack app, see the DIY (Hetzner + Coolify) option above.

Most teams start DIY (cheap!), hit a database scaling issue (week 6), migrate to Railway, and spend $10k/year. If you can skip DIY, do.

Frequently Asked Questions

Can I publish an app made by AI?

Yes. AI-generated code is code. If it works, it's deployable. Check your AI tool's license (most paid tools allow commercial use). Free tools rarely have restrictions.

How to deploy AI in production?

Pick your architecture (static, full-stack, or full-stack + DB). Follow the step-by-step path above. Push to GitHub, connect to Vercel/Railway/Opsily, deploy. AI code deploys like any code.

How do I deploy my AI Studio app?

Google AI Studio generates JavaScript/Python code. Export as a GitHub repo or zip. Follow Path 1, 2, or 3 based on your app's needs. Most AI Studio apps are Path 1 (static).

How much does it cost to build an AI app?

Building is free (Claude, Lovable, Cursor all free trials). Deploying costs $0-50/month depending on architecture. Static costs $0. Full-stack with database costs $20-50/month on managed platforms. DIY costs $5-15/month.

Can ChatGPT build an app?

ChatGPT can generate code, but copy-pasting it into an IDE is tedious. Tools built on ChatGPT's API like Lovable and Cursor do the full cycle: generate, preview, deploy. Use those instead.

What's the difference between Vercel and Railway?

Vercel optimizes static frontends and edge functions (fast, global). Railway optimizes full-stack apps (backend + database). Use Vercel for Next.js/React static sites. Use Railway for Node.js/Python backends with databases.

The Bottom Line

Your AI-built app is deployable with the right path. Start with the decision tree: static, full-stack, or full-stack + database? Follow the step-by-step guide for your path. Expect weeks 2-3 debugging; it's normal. When you're ready for managed infrastructure without surprise cost-per-request bills, Opsily's Ship hosting offers predictable pricing for teams moving from prototype to production.