Netlify Deployment Guide: GitHub to Live Website

Complete guide to deploy your website from GitHub to Netlify in 8 steps. No images, just clear instructions and code.

Prerequisite: GitHub Repository Setup

Your code must already be on GitHub:

# If not already done, run these commands in VS Code terminal:
git init
git add .
git commit -m "Initial commit"
git branch -M main
git remote add origin [your-github-repo-url]
git push -u origin main

Make sure your main HTML file is named index.html in the root folder.

Step 1: Create Netlify Account

Go to netlify.com → Click "Sign up" → Choose "GitHub" authentication

Tip: Using GitHub authentication allows seamless connection to your repositories.

Step 2: Start New Deployment

From Netlify dashboard → Click "Add new site" → Select "Import an existing project"

Step 3: Connect GitHub Account

Click "GitHub" button → Authorize Netlify access → Grant requested permissions

Step 4: Select Your Repository

Choose your repository from the list → Select the branch (usually "main")

Step 5: Configure Build Settings

For basic HTML/CSS/JS websites:

Build command: [LEAVE EMPTY]
Publish directory: /

For React/Vue/Angular projects:

React: Build command: npm run build | Publish directory: build/
Vue: Build command: npm run build | Publish directory: dist/
Angular: Build command: ng build | Publish directory: dist/[project-name]/

Step 6: Deploy Your Site

Click "Deploy site" → Wait 1-2 minutes for deployment to complete

Deploy log will show:
✅ Building site
✅ Post processing
✅ Deploy site succeeded

Step 7: Get Your Live URL

After deployment, Netlify provides:

Your live site: https://[random-name].netlify.app

Click the URL to verify your site is live.

Step 8: Automatic Updates Setup

Netlify automatically redeploys when you push to GitHub:

# After making code changes:
git add .
git commit -m "Update website"
git push origin main
# Netlify will auto-deploy in ~1 minute
✅ Success! Your website is now live and will automatically update when you push changes to GitHub.