# Deploy Your First Website for Free (Vercel, Netlify, GitHub Pages)

> Step-by-step commands to deploy on Vercel, Netlify, or GitHub Pages for free, their real 2026 limits, and how to add a custom domain including .ph options.

- Author: Vibe Coders PH Team
- Published: 2026-09-25
- Category: Web Development
- Tags: Deployment, Vercel, Netlify, GitHub Pages, Web Development, Beginners
- Canonical URL: https://www.vibecoders.ph/blog/deploy-your-first-website-free
- Publisher: Vibe Coders PH (https://www.vibecoders.ph)

> **Short answer:** Vercel, Netlify, and GitHub Pages all let you deploy a website for free. Vercel's Hobby plan is the strongest default for Next.js and most modern frameworks (100GB data transfer, 1 million function calls a month, but personal/non-commercial use only). Netlify works well for static sites and has generous free functions too, now running on a credit system for newer accounts. GitHub Pages is the simplest for a pure static site with no backend, with a 1GB size cap and a soft 100GB bandwidth guideline. Pick based on what your site needs: a framework with server functions leans Vercel or Netlify; a plain static site works fine on any of the three, including GitHub Pages.

You built something. Now it needs to actually be live, not just running on `localhost`. Here's exactly how to deploy on each of the three most common free options, what their limits really are in 2026, and how to point a real domain, including a Philippine one, at whichever you pick.

## Option 1: Vercel

Best fit for Next.js, React, and most modern JavaScript frameworks, since Vercel is built by the same team behind Next.js.

**Deploy via GitHub (recommended for ongoing projects):**

1. Push your project to a GitHub repository.
2. Go to [vercel.com](https://vercel.com), sign up, and click **Add New > Project**.
3. Import your GitHub repo. Vercel auto-detects most frameworks and sets the build command for you.
4. Add any environment variables your app needs (API keys, database URLs) under **Environment Variables**.
5. Click **Deploy**. Every future push to your main branch redeploys automatically.

**Deploy via CLI (good for a quick one-off):**

```bash
npm install -g vercel
vercel login
vercel
```

**Vercel Hobby plan limits (2026):** 100GB of Fast Data Transfer per month, 1,000,000 Edge Requests, 1,000,000 function invocations, 4 CPU-hours of active function compute, up to 200 projects, and up to 100 deployments per day. Functions can run for up to 300 seconds (5 minutes) on this plan, and builds run one at a time, so rapid consecutive pushes queue up. Importantly, Vercel's fair-use terms restrict the Hobby plan to personal, non-commercial use; a project that starts generating revenue needs to move to a paid plan.

## Option 2: Netlify

A strong choice for static sites, JAMstack projects, and sites using Netlify Functions, with a straightforward drag-and-drop option for pure static builds.

**Deploy via drag-and-drop (fastest for a static site):**

1. Build your site locally so you have an output folder (commonly `dist` or `build`).
2. Go to [app.netlify.com/drop](https://app.netlify.com/drop) and drag that folder in. It deploys immediately with a live URL.

**Deploy via GitHub (recommended for ongoing projects):**

1. Push your project to GitHub.
2. In the Netlify dashboard, click **Add new site > Import an existing project**, connect GitHub, and pick your repo.
3. Confirm the build command and publish directory, then deploy. Future pushes redeploy automatically.

**Netlify CLI:**

```bash
npm install -g netlify-cli
netlify login
netlify deploy
```

**Netlify free tier limits (2026):** Netlify's current Free plan runs on a shared credit system: 300 credits a month, hard limit, with no option to buy more or auto-recharge. Bandwidth costs 20 credits per GB transferred (roughly 15GB of traffic if that's all you spend the pool on), each production deploy costs 15 credits (about 20 deploys a month), and function or preview-server compute costs 10 credits per GB-hour. Deploy previews and branch deploys don't consume credits. If your credit pool runs out mid-month, every site on the account pauses until the next billing cycle resets it. Older accounts created before Netlify's 2025 pricing change may still be on legacy limits (100GB bandwidth, 300 build minutes as hard caps), so check your own account's billing page rather than assuming which model applies to you.

## Option 3: GitHub Pages

The simplest option for a pure static site (HTML/CSS/JS, or a static site generator's output) with no server-side logic and no backend functions.

**Deploy:**

1. Push your site's static files to a GitHub repository.
2. In the repo, go to **Settings > Pages**.
3. Under **Build and deployment**, choose your source (a branch like `main`, or GitHub Actions if you're building from a framework like Astro or Hugo first).
4. Save. GitHub gives you a live URL at `https://yourusername.github.io/repo-name` within a few minutes.

**GitHub Pages free tier limits (2026):** Sites are capped at 1GB in published size, with a soft guideline of about 100GB of bandwidth a month and roughly 10 builds per hour. These are described as soft, fair-use limits rather than hard cutoffs, but GitHub Pages is only available on public repositories on the free plan, and it supports static content only, no server-side code or backend logic.

## Side-by-side comparison

| Platform | Best for | Free bandwidth/traffic | Server functions on free tier | Commercial use allowed |
| --- | --- | --- | --- | --- |
| Vercel (Hobby) | Next.js, React, most modern frameworks | 100GB Fast Data Transfer/month | Yes, 1M invocations/month, up to 300s duration | No, personal/non-commercial only |
| Netlify | Static sites, JAMstack, Netlify Functions | ~15GB (new accounts, credit-based) or 100GB (legacy accounts) | Yes, shared credit pool, 10s function timeout | Check current plan terms; historically more permissive than Vercel Hobby |
| GitHub Pages | Pure static sites, no backend | Soft guideline ~100GB/month | No, static only | Yes, but public repo required on free plan |

## Which one to pick

- **Building with Next.js, or need API routes/server functions and want the smoothest setup:** Vercel.
- **Building a static site but might add serverless functions later, or want more generous bandwidth on an older account:** Netlify.
- **A truly static personal site, portfolio, or documentation with zero backend, and you're fine with a public repo:** GitHub Pages, especially if you're already comfortable in GitHub.
- **Not sure yet:** start with Vercel if you're using a modern JS framework; it has the most beginner-friendly defaults and the tightest fit with tools like [Claude Code](/blog/claude-code-beginners-guide) when it scaffolds a new project.

## Adding a custom domain

Once deployed, all three platforms let you connect a custom domain instead of the default subdomain they give you.

1. **Buy a domain** from a registrar (Namecheap, GoDaddy, Cloudflare, or a Philippine-specific registrar for a `.ph` domain, covered below).
2. **In your hosting platform's dashboard**, go to the domain settings for your project (Vercel: Project Settings > Domains; Netlify: Site Settings > Domain Management; GitHub Pages: repo Settings > Pages > Custom Domain).
3. **Add the domain**, and the platform gives you DNS records to add (usually an `A` record or `CNAME`) at your domain registrar.
4. **Update your DNS at the registrar** with those records. Propagation usually takes anywhere from a few minutes to a few hours.

## Getting a .ph or .com.ph domain

If you want a Philippine-specific domain, `.ph`, `.com.ph`, `.net.ph`, and `.org.ph` are all managed by the dotPH registry, and registration is open to individuals and businesses worldwide, with no local presence required. Registration is typically for a minimum of two years, and prices vary noticeably by registrar, generally running higher than a standard `.com` (reported ranges across registrars run roughly $40 to over $180 for the first term, depending on the provider and term length), so it's worth comparing a few registrars before committing rather than buying from the first one you find. `.com.ph` is a common, slightly cheaper-feeling alternative to plain `.ph` for businesses that want the local identity without the shorter top-level domain.

| Domain type | Who it signals | Registry |
| --- | --- | --- |
| `.ph` | General Philippine identity, any individual or business | dotPH |
| `.com.ph` | Philippine commercial entity | dotPH |
| `.org.ph` | Philippine non-profit or organization | dotPH |
| `.com` | No geographic signal, globally recognized default | Global registrars (Namecheap, GoDaddy, Cloudflare, etc.) |

If your project or business specifically wants to signal it's Philippine-based to local users, a `.ph` or `.com.ph` is worth the premium. If you're building for a global audience or the peso cost difference matters more at this stage, a standard `.com` from any major registrar works everywhere the `.ph` options do, and connects to Vercel, Netlify, or GitHub Pages the exact same way.

## A realistic first deploy, start to finish

1. Build your site or app locally and confirm it runs.
2. Push it to a GitHub repository, even a public one is fine for a first project.
3. Pick a platform based on the comparison above and connect your GitHub repo.
4. Add any environment variables it needs before the first deploy, not after.
5. Confirm the live URL actually works, not just that the build succeeded.
6. Optionally, add a custom domain once you're happy with how it looks.

If this is your first time doing any of this, our free [Ship Your First Project](/challenges/ship-your-first-project) 7-day challenge walks through building and deploying something real in a structured week, and our [Discord](https://discord.gg/HgKuev28wg) is a good place to ask if something in your DNS setup or build config isn't behaving.

## Frequently asked questions

### Which free hosting platform is best for a beginner's first website?

Vercel is the strongest default if you're building with Next.js or a similar modern framework, since it's built by the same team and has the smoothest setup. GitHub Pages is simplest if your site is purely static with no backend at all.

### Can I use Vercel's free Hobby plan for a business website?

No. Vercel's fair-use guidelines restrict the Hobby plan to personal, non-commercial use; a site generating revenue or representing a registered business should move to a paid Vercel plan.

### What are GitHub Pages' actual limits?

GitHub Pages caps published sites at 1GB in size, with a soft guideline of roughly 100GB of bandwidth a month and about 10 builds per hour. It only supports static content and requires a public repository on the free plan.

### How do I connect a custom domain to my free-tier site?

Add the domain in your hosting platform's project or site settings, which will give you DNS records (usually an A record or CNAME) to add at your domain registrar. Once you update those records, the connection typically takes minutes to a few hours to propagate.

### Where do I register a .ph domain?

`.ph`, `.com.ph`, `.net.ph`, and `.org.ph` domains are managed by the dotPH registry and sold through multiple accredited registrars; prices and terms vary, so compare a few before buying, and expect a minimum registration term of two years.

## Sources

- [Vercel Hobby Plan, Vercel Docs](https://vercel.com/docs/plans/hobby)
- [Deploying to Vercel, Vercel Docs](https://vercel.com/docs/deployments)
- [Credit-based pricing plans, Netlify Docs](https://docs.netlify.com/manage/accounts-and-billing/billing/billing-for-credit-based-plans/credit-based-pricing-plans/)
- [GitHub Pages documentation, GitHub](https://docs.github.com/en/pages)
- [.ph, Wikipedia, on dotPH registry and registration terms](https://en.wikipedia.org/wiki/.ph)
- [.ph Domain Registration, 101domain](https://www.101domain.com/ph.htm)
- [Our Claude Code beginners guide](/blog/claude-code-beginners-guide)