You can deploy an app from GitHub using several platforms: GitHub Pages for static sites, Vercel for React and Next.js apps, Netlify for static and serverless projects, and Railway for full-stack apps with databases. Most platforms connect directly to your GitHub repository and auto-deploy whenever you push changes.
Your Options for Publishing an App From GitHub
Once your code is on GitHub, you need a hosting platform to make it accessible on the internet. The right choice depends on what kind of project you have:
- **Static sites** (HTML, CSS, JavaScript only — no server/database): Use **GitHub Pages** (free) or **Netlify** (free tier available). These are the simplest options. - **React, Vite, or Next.js apps**: Use **Vercel** (free tier available). Vercel is built by the team behind Next.js and offers the best experience for frontend frameworks. - **Full-stack apps** (frontend + backend + database): Use **Railway** (free trial, then pay-as-you-go) or host the frontend on Vercel and the backend on a platform like Supabase or Firebase. - **AI-built apps**: Tools like **Lovable** and **Replit** have built-in deployment — you may not need a separate platform at all. Lovable has a Publish button; Replit has Autoscale deployments.
All of these platforms support connecting to a GitHub repository, which means they auto-deploy whenever you push new code. This guide focuses on the most common path: connecting GitHub to Vercel for a React/Vite project.
Prerequisites
- A GitHub account with a repository containing your project code
- An account on your chosen deployment platform (Vercel, Netlify, or Railway)
- Your project should have a build command and output directory defined (most AI-generated projects already have this)
Step-by-step guide
Choose the right deployment platform
Choose the right deployment platform
Before connecting anything, decide which platform fits your project: - **GitHub Pages**: Free. Best for simple HTML/CSS/JS sites, portfolios, documentation. No server-side code. - **Vercel**: Free tier (100GB bandwidth). Best for React, Vite, Next.js projects. One-click GitHub integration. This is what most Lovable and V0 exports deploy to. - **Netlify**: Free tier (100GB bandwidth). Similar to Vercel, good for static sites and serverless functions. - **Railway**: Free trial ($5 credit). Best for full-stack apps needing Node.js, Python, or database hosting. For this guide, we will use Vercel as the example since it is the most common choice for AI-built projects.
Expected result: You have identified which platform best fits your project.
Create a Vercel account and connect GitHub
Create a Vercel account and connect GitHub
Go to **vercel.com** and click **Sign Up**. Choose **Continue with GitHub** — this is the easiest path because it links your accounts automatically. Authorize Vercel to access your GitHub account when prompted. After signing up, you land on the Vercel dashboard. If this is your first time, Vercel may show a welcome wizard — follow it or skip to the next step.
Expected result: You have a Vercel account connected to your GitHub account.
Import your GitHub repository to Vercel
Import your GitHub repository to Vercel
On the Vercel dashboard, click the **Add New...** button and select **Project**. You will see a list of your GitHub repositories. Find the repository you want to deploy and click **Import** next to it. If you do not see your repository, click **Adjust GitHub App Permissions** at the bottom of the list. This opens GitHub's installation settings where you can grant Vercel access to specific repositories or all repositories. Select the ones you need and save.
Expected result: Your repository appears in the import list and you click Import to proceed.
Configure project settings and deploy
Configure project settings and deploy
After importing, Vercel shows a configuration screen: - **Project Name**: Auto-filled from your repository name. You can change it. - **Framework Preset**: Vercel auto-detects your framework (Vite, Next.js, Create React App). If it detects correctly, leave it. - **Build Command**: Usually `npm run build`. Vercel fills this in automatically for known frameworks. - **Output Directory**: Usually `dist` for Vite projects or `.next` for Next.js. Auto-detected. - **Environment Variables**: If your project needs environment variables (like VITE_SUPABASE_URL), click **Environment Variables** and add them here. Never put API keys in your code — always use environment variables. Click the **Deploy** button. Vercel clones your repository, runs the build, and deplishes your app. This takes 30-90 seconds.
Expected result: Vercel shows a 'Congratulations' page with confetti and a link to your live deployed app.
Visit your live app and set up auto-deploy
Visit your live app and set up auto-deploy
Click the **Visit** button or the URL shown on the congratulations page to see your live app. The URL follows the format `project-name.vercel.app`. Auto-deploy is enabled by default — every time you push changes to the main branch on GitHub (whether via the web editor, GitHub Desktop, or a merged pull request), Vercel automatically rebuilds and deploys. You can see deployment history in the Vercel dashboard under your project's **Deployments** tab.
Expected result: Your app is live at a .vercel.app URL and future GitHub pushes trigger automatic redeployment.
Connect a custom domain (optional)
Connect a custom domain (optional)
On the Vercel dashboard, click your project, then go to **Settings → Domains**. Type your custom domain (e.g., myapp.com) and click **Add**. Vercel will show you DNS records to add at your domain registrar. For most domains, add a **CNAME record** pointing `www` to `cname.vercel-dns.com`. For apex domains (without www), add an **A record** pointing to `76.76.21.21`. Vercel automatically provisions an SSL certificate once DNS propagates (15 minutes to 24 hours).
Expected result: Your custom domain is connected and your app is accessible at your own URL with HTTPS.
Complete working example
1{2 "rewrites": [3 {4 "source": "/(.*)",5 "destination": "/index.html"6 }7 ]8}Common mistakes when publishing an App From GitHub
Why it's a problem: Deploying a full-stack app to GitHub Pages
How to avoid: GitHub Pages only hosts static files. If your app has a backend (API routes, database queries, server-side rendering), use Vercel, Railway, or Netlify instead.
Why it's a problem: Forgetting to add environment variables on the deployment platform
How to avoid: Environment variables from your local .env file are not automatically transferred. Add them manually in Vercel (Settings → Environment Variables), Netlify (Site Settings → Environment Variables), or Railway (Variables tab).
Why it's a problem: Getting blank pages after deploying a React SPA
How to avoid: Single-page apps need URL rewrites. Add a vercel.json file with a rewrite rule that sends all routes to index.html (see the complete code section above).
Why it's a problem: Not granting the deployment platform access to the repository
How to avoid: If Vercel or Netlify cannot see your repository, go to GitHub → Settings → Applications → configure the platform's GitHub App to include the correct repositories.
Best practices
- Choose your deployment platform based on your project type: Pages for static, Vercel for React/Next.js, Railway for full-stack.
- Always add environment variables through the platform's dashboard — never hardcode secrets in your repository.
- Add a vercel.json with SPA rewrites if deploying a single-page React or Vite application.
- Test your build locally or check the build logs on the platform before troubleshooting deployment failures.
- Use auto-deploy from GitHub — push to main and your live site updates automatically.
- For AI-built apps from Lovable or V0, check the platform's export documentation for specific deployment instructions.
- Set up a custom domain for professional projects — most platforms offer free SSL with custom domains.
- If deployment is complex and you need help, RapidDev can configure the full pipeline from GitHub to production.
Still stuck?
Copy one of these prompts to get a personalized, step-by-step explanation.
I have a React project on GitHub that was built with Lovable. Walk me through deploying it to Vercel including environment variables, custom domain setup, and SPA routing configuration.
Frequently asked questions
Which deployment platform is best for a Lovable project?
Lovable has a built-in Publish button that handles deployment for you. If you want to deploy the GitHub export separately, Vercel is the best choice because Lovable projects use Vite + React, which Vercel supports natively.
Is Vercel free?
Vercel offers a free Hobby tier with 100GB bandwidth per month, serverless function execution, and automatic deployments from GitHub. This is sufficient for personal projects and small apps.
Do I need to run any build commands myself?
No. Platforms like Vercel and Netlify run the build command for you in the cloud. You just push your source code to GitHub and they handle building and deploying.
Can I deploy from a private GitHub repository?
Yes. Vercel, Netlify, and Railway all support private repositories. You grant them access through their GitHub App integration during setup.
What if my deployment fails with a build error?
Check the build logs on your deployment platform (Vercel → Deployments → click the failed deployment → build logs). Common issues include missing dependencies, wrong Node.js version, or missing environment variables.
Can RapidDev help me deploy my app from GitHub?
Yes. RapidDev specializes in helping non-technical founders deploy their AI-built apps. They can set up the GitHub-to-production pipeline, configure environment variables, connect custom domains, and troubleshoot build failures.
Talk to an Expert
Our team has built 600+ apps. Get personalized help with your project.
Book a free consultation