Choose Hosting for an AI-Built App

Start with what the app needs to run

The tool that wrote the code does not decide where the app can live. The important question is what must keep running after you close the editor. Before you compare hosts, put your project in one of these rows.

What the AI built What has to be hosted Hosts that fit
An HTML report, landing page or single-page demo HTML, CSS, JavaScript and images Netlify, Cloudflare Pages, GitHub Pages
A front end that calls a public API Static files, plus an API it can reach The same static hosts
An app with accounts, a database or file uploads Server code, a database, login and secrets Vercel, Railway, Render, or the builder’s own hosting
An agent or a scheduled job A process that keeps running, or runs on a schedule Render background workers and cron jobs, Railway cron jobs

Static hosting (a service that serves only finished files) has fewer moving parts. If the project allows it, use static hosting. Use a server host (a service that runs your code) only for the parts that need one.

Find out which kind you have

Open the project folder and examine four things. Or ask the AI tool that built the project to answer these questions.

  1. Find the build command and the output folder. The build command turns the source code into finished files. In package.json, look at the build script. When you run npm run build, a Vite project writes static files to dist/. If the folder has no package.json and already has an index.html, you can upload it as it is.
  2. Look for server code. Some signs are folders such as api/ or server/, Next.js route handlers, or a full-stack framework such as TanStack Start. If you find one of these signs, you need a host that runs code.
  3. Look for data and login services. The code can contain a database URL, an auth provider (a service that signs users in), or file storage. If it does, the host of the app must be able to reach these services.
  4. List every environment variable that the code reads (process.env.NAME or import.meta.env.NAME). An environment variable is a named value that the host gives the code. You must set each one again on the new host.

This prompt works in most AI coding tools: “List what this project needs in production: build command, output folder, server code, database, login provider, environment variables and scheduled jobs.”

A preview inside the builder does not prove that server code will run after a static upload. If the app saves data or signs people in, treat it as a server app. Change this only when you know that the app is static.

Put static output online

Any of these three hosts can serve a folder of finished files.

To use Netlify Drop, sign in. Then drag the project folder onto the drop zone at app.netlify.com/drop (Netlify Drop quickstart). When you are signed in, Netlify can detect the framework and run the build for you. You can also drop a folder that is already built. If you drop the folder and you are not signed in, Netlify publishes the files as they are. A temporary password protects them until you claim the project.

To update the project, drag the new folder into the drop area under Production deploys on the project dashboard. The team default controls whether a new project starts as private. If visitors see a Netlify access page, look at Project configuration > General > Visitor access (project visibility).

To use Cloudflare Pages Direct Upload, open the Cloudflare dashboard. Go to Workers & Pages > Create application > Get started > Drag and drop your files. Drag and drop takes up to 1,000 files of up to 25 MiB each. The command npx wrangler pages deploy dist takes up to 20,000 files. You cannot switch a Direct Upload project to Git deploys later. If you expect to connect a repository, create the project from Git at the start (Direct Upload docs).

To use GitHub Pages, push the files to a repository. Open Settings > Pages. As the source, choose a branch and a folder, or a GitHub Actions workflow (GitHub guide). On GitHub Free, the repository must be public. The published site is public on the internet even when the repository is private, unless your plan allows private sites. GitHub also says that Pages is not meant for online businesses, e-commerce or sensitive data, such as passwords or card numbers.

A single-page app needs a fallback. A single-page app is one HTML page that changes views in the browser. If the app has client-side routes such as /settings, a static host can return a 404 when a visitor opens that URL directly. A fallback rule sends these requests to index.html. On Netlify, add a _redirects file with the line /* /index.html 200 (Netlify rewrites). On Vercel, add a rewrite in vercel.json.

Cloudflare Pages serves the start page for unknown paths on its own if the project has no top-level 404.html.

This blog has step-by-step guides for Netlify, Cloudflare Pages and GitHub Pages.

Run a server-backed app

First, list the framework, the runtime, the database, the background jobs, and the file storage. Then compare each host with that list, not the other way round.

  • Vercel fits Next.js and other frameworks with server functions (small pieces of code that run on the host). On the New Project page, connect GitHub. Pick the repository and click Deploy. After that, Vercel deploys again on every push to the connected branch (Vercel getting started). Before the first real deploy, set the environment variables in the project settings. For details, read the Vercel walkthrough.
  • Render and Railway run long-lived servers. The Render service types include web services and Postgres databases. They also include background workers that run continuously, and cron jobs that run on a schedule and exit. Railway starts cron jobs from a crontab expression (a schedule written as text) in the service settings. The schedules are in UTC, and runs must be at least 5 minutes apart. For details, read the Railway walkthrough.
  • Some builders, such as Lovable, have their own hosting. This hosting is often the simplest home for an app that depends on the builder’s database and login. If you move only the front end, sign-in or uploads can stop working. The article Do you need GitHub or separate hosting? covers that decision.

Keep secrets on the server

Variables for the browser go into the files that every visitor downloads. Vite puts VITE_ variables into the client code at build time. The Vite docs warn against API keys in these variables. Next.js puts NEXT_PUBLIC_ variables into the client code in the same way. Keep payment keys, database passwords, and AI API keys in server-side variables. Set them in the settings of the host. Read them only from server code.

So a “static” app that calls a paid API with a secret key is not static. It needs at least one server function to hold the key.

Deploy a small version first

Before you move real users, deploy a working copy and test it:

  1. Sign up, sign in and sign out.
  2. Create, edit, and delete a record. Then reload the page and make sure that the app saved the change.
  3. Open a nested URL directly in a new tab.
  4. Redeploy or restart the service. Then make sure that the data and the sessions are still there.
  5. While you click through the app, watch the logs of the host for errors.
  • Decide who can see the app. For a review build, restrict access. Vercel Standard Protection is available on all plans. It protects every deployment except production domains (Deployment Protection). Netlify can make a project private. On Pro, Netlify can also put the project behind a password. On Cloudflare Pages, use Cloudflare Access.
  • Decide what you want to measure. On Cloudflare Pages, open the project and go to Metrics. Turn on Web Analytics to see page views by path, referrer, and country.
  • Plan the domain. When the app is stable, add your own domain. Then the link stays the same if you change hosts later.
  • Run a security pass. Before you send the link, go through the AI website security checklist.

A docs portal with Ask AI
and support tickets

Connect a repository, or describe your product to start. Each docs site has search, Ask AI, an API console, an MCP server and support tickets.

  • Publishes from GitHub on every push
  • Works with Mintlify repositories
  • API console from your OpenAPI file
  • MCP server and llms.txt for AI agents
  • Ask AI and support tickets
  • Analytics for people and AI agents
Start Free Questions? Ask AI in our docs

No card required.

Share:
Markdown version

Related Articles

↧
Loading PDF…