How I Deployed My GitHub Project to Vercel in Minutes

#webdev #github #tutorial #beginners

When you finish a side project, the next step is getting it online. Vercel makes this almost frictionless — especially if you’re already using GitHub.

This is exactly how I deployed my Innoweg repo → innoweg.vercel.app.

1) Initialize Git + Push to GitHub

If your project isn’t versioned yet:

git init
git add .
git commit -m "Initial commit"
git branch -M main
git remote add origin https://github.com/username/repo-name.git
git push -u origin main

Confirm it’s live at: https://github.com/username/repo-name

2) Sign in to Vercel

Go to vercel.com
Sign in with GitHub (recommended)
Authorize Vercel to access your repos

3) Import the GitHub Repo

Click New Project
Select your GitHub repository
Vercel auto-detects your framework (React, Next.js, Vue, static, etc.)

For a Vite/React project, defaults typically are:

Build command: vite build
Output directory: dist/

4) Deploy 🚀

Click Deploy. Within ~1 minute, you’ll get a live URL like:

https://your-project.vercel.app

5) Continuous Deployment

Every git push triggers an automatic redeploy. Every PR gets a preview URL.

git add .
git commit -m "Update UI"
git push origin main

Gotchas & Notes

Environment variables: Set them in Settings → Environment Variables. They’re available at build/runtime.
Branch config: By default, Vercel deploys main. Adjust under Project Settings → Git if you use develop or staging
Framework detection: If auto-detect fails, add a minimal vercel.json (example for Node):
CI/CD contexts: Production (pushes to main), Preview (PRs), Development (vercel dev locally).