← All guides

Publish your site

Take a site that runs on localhost and give it a real public address, with automatic deploys on every push.

Time: 30–60 minutes · Cost: Free for a personal project

Get this guide as a skill for Claude Code, Cursor or any AI coding agent.Get the skill

Use your AI as the copilot

Open your coding agent in the project folder and give it this job. Let it inspect files, run safe checks and prepare the work; you stay in control of accounts, payments, secrets and the final publish button.

Help me deploy this project safely. First inspect the repository and explain what framework, build command, environment variables, database and hosting requirements you find. Do not expose secret values, create paid resources, push to Git or deploy yet. Give me a short plan and ask before any action that affects an external service.

1. Prove it builds on your machine

Hosting runs a production build, not your dev server. If it fails here it fails there. Have the AI run the real build, explain errors in plain language and fix them one at a time.

Ask your AI:

Run the production build. If it fails, identify the first root cause, make the smallest fix and rerun it. Show me the final command and result.
npm run build

2. Keep secrets out of the code

Ask the AI to check that .env, .env.local and key files are ignored and were never committed. (If your folder is not a Git repository yet, run git init first or check .gitignore directly.) It must report variable names only, never their values. Secrets go into the host's settings in step 6, not into GitHub. If a key was ever committed and pushed, treat it as leaked: create a new one at the provider and revoke the old one. Deleting the file does not take it back.

Ask your AI:

Audit this repository for accidentally tracked secrets. Do not print secret values. Check ignore rules and Git history (if Git is initialized), then list only the file paths and variable names I need to address.
git status --ignored
git log --all -- .env .env.local

3. Put the code on GitHub

Create an empty private repository on GitHub, then connect your folder and push. Skip the first three lines if your folder is already a Git repository with commits on a branch called main.

git init
git add .
git commit -m "First version"
git branch -M main
git remote add origin https://github.com/<you>/<repo>.git
git push -u origin main

4. Pick a host

For Next.js and most React sites, Vercel is the shortest path: sign up with your GitHub account. Its free Hobby plan is for non-commercial use; a paid plan is needed for a business. Netlify and Cloudflare Pages work the same way. Hostinger and DigitalOcean App Platform are also options, mostly on paid plans. A plain HTML site fits any of them.

5. Move the database off your laptop

Skip this if your site has no database. localhost means "this computer", so the live site cannot reach a database on your laptop. Before the first deploy, create a hosted one (for example Neon for Postgres), run your migrations against it and keep its address for the DATABASE_URL setting in the next step.

6. Import the repository and add your settings

In Vercel: Add New → Project → choose the repository. The framework is detected for you. Ask the AI which variable names are required, then copy their values yourself into Environment Variables (including DATABASE_URL from the step before) and press Deploy. Never paste secret values into the chat.

Ask your AI:

Inspect the code and produce a deployment checklist of required environment-variable names, where each is used and whether it is needed at build time or runtime. Do not read or print their values.

7. Open it and read the logs

You get an address like your-app.vercel.app. Click through the main journey. If something fails, copy the relevant redacted log lines to the AI and ask it to diagnose before changing code.

Ask your AI:

If the build or runtime fails and I paste redacted deployment logs: explain the likely root cause, what evidence supports it and the smallest safe fix. Ask for any missing context instead of guessing.

8. Ship by pushing

From now on every push to main deploys to the live site, and every other branch gets its own preview address. If a release breaks the site, use the host's rollback (on Vercel: Deployments → an earlier deployment → Instant Rollback / Promote to Production) to bring the last good version back while you fix it.

Official pages

Prices and rules change. When this guide and the provider disagree, the provider is right.

Learn to build the thing you are publishing: see the courses →

Publish your site: a step-by-step guide · Vibe to Dev