Labs ICT
Pro Login

How to Deploy Your First Website for Free

General Web Development 5 min read

Step-by-step guide to deploying a website using free hosting platforms like Netlify, Vercel, and GitHub Pages.

How to Deploy Your First Website for Free

Building a website is only half the fun. Deployment is the process of putting your site on the internet so anyone can visit it. The good news is that several platforms let you do this for free.

What Is Deployment?

Deployment means uploading your code to a server that is always connected to the internet. People can then access your website by typing in a URL. Free hosting platforms handle the server setup for you.

GitHub Pages

GitHub Pages is the simplest way to deploy a static website. Push your code to a GitHub repository, go to Settings, and enable Pages from your main branch.

  1. Create a GitHub repository for your project
  2. Push your HTML, CSS, and JavaScript files to it
  3. Go to Settings then Pages
  4. Select your branch as the source
  5. Your site is live at username.github.io/repo-name

Netlify

Netlify offers two deployment methods. The drag-and-drop method lets you upload a folder directly from your browser. For continuous deployment, connect your GitHub repository and Netlify will rebuild your site every time you push changes.

// You can also deploy from the command line
npm install -g netlify-cli
netlify init
netlify deploy --prod

Vercel

Vercel works similarly to Netlify and is especially good for frameworks like Next.js. Connect your GitHub repository, and Vercel automatically detects your framework and deploys it.

Custom Domains

All three platforms let you connect a custom domain. You can buy a domain from providers like Namecheap or Google Domains and point it to your free hosting. The setup involves changing DNS records, which sounds scary but is straightforward.

// Example DNS records for GitHub Pages
Type: CNAME
Name: www
Value: username.github.io

Which Platform Should You Choose?

GitHub Pages is best for simple static sites and portfolios. Netlify is ideal if you want forms, serverless functions, and easy Git integration. Vercel shines if you are using Next.js or need edge functions.

Free Tier Limitations

Free tiers are generous for personal projects but have limits. GitHub Pages caps your site at 1GB and 100GB of bandwidth per month. Netlify offers 100GB of bandwidth and 300 build minutes. Vercel gives you 100GB of bandwidth as well. For learning and small projects, these limits are more than enough.

Note: Always check that your repository is public when using GitHub Pages free tier. Private repositories require a paid plan for Pages deployment.