Back when I was still in college, I started working on a lot of projects. Other students did the same, but to gain an edge, I turned to hosting and cloud services. This led me down a deep rabbit hole of FREE VPS Services, Dockerfiles and many other things.

I have been approached by many of my colleagues, classmates and even random strangers on reddit to help them host their college project, freelance gig or their brand-new SaaS products.

So here it is: a one stop guide to free hosting — everything here either provides a free tier or has a freemium pricing model.

Frontend

At this point, most people know how to host a website. But if you're looking for alternatives, here's what I've used:

  1. Vercel — Serverless functions, free PostgreSQL (via Neon), image optimization with Next.js.
  2. Github Pages — Easy static deployment.
  3. CloudFlare — Great for websites and serverless functions, needs a bit more setup.
  4. Netlify — Serverless functions and server config.

While hosting a website is relatively simple, there are many things that can go wrong, which creates plenty of opportunities to learn.

Some key points to consider:

  • Use GitHub Pages if you only have simple HTML files and are experimenting with things. There's a lot that can be done using GitHub Pages and Jekyll (also, while you're here, study static site generators and try one).
  • Don't create a brand-new Vercel project for a "Hello World" index.html.

If you're hosting a simple Vite (React) project, you might run into an issue where if you directly enter the route to a specific page, or reloading a random page results in a 404 error, this a common issue and quite popular in the ReactJS Ecosystem. However you are using Next.js you might have never even heard of this issue.

Here's a popular Stack Overflow thread from where I learned about this: Link. So, What's the solution I used? I created a catch-all and called it a day as it was just my college project and no one cared except me. It did help me during an interview, though.

Here's the code which worked for my vercel deployment. Just create a vercel.json file and put it the root directory. Example project here.

{
  "rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
}

For Netlify, create a netlify.toml file and place it in the root directory:

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200
  force = false

Bonus

If you don't really trust these providers to host your website or you want to try something different, consider running Coolify or Docker locally on your own machine.

Authentication

If you're here, chances are your web application is about to be flooded with millions of users (or, realistically, maybe one person every other week). Either way, you'll need a basic authentication layer to:

  • Prevent API spam
  • Avoid database flooding with junk requests

So here are my top picks:

Better Auth

  • Open-source auth that lives in your code and database. No vendor lock-in, no per-MAU pricing. Free, forever.
  • Works with any framework. Email/password, social login, passkeys, 2FA, anonymous auth — all included.
  • Self-hosted, so you own your user data. The dashboard is optional and paid, but the library itself is completely free.

Auth0

  • Drop-in auth and authorization. Multiple identity providers, solid docs.
  • Free tier: 25,000 MAU. Advanced features are paid.

Auth.js (NextAuth)

  • Open-source auth for Next.js. Supports OAuth, magic links, email, and credentials.
  • The newer versions can be tricky to set up and you might not get everything you need out of the box.

Clerk

  • Pre-built auth components with multi-factor auth and social logins.
  • Free tier: 50,000 monthly retained users. Advanced features are paid.

Build Your Own

If you go this route, a few things I learned:

  • Use OTP-based sign-in — never store passwords. No passwords means no password leaks.
  • OTP sign-in also removes the need for a "Forgot Password" flow entirely.
  • When using JWT auth, always extract the user from the JWT payload instead of sending it separately in the body, URL, or query params — this avoids data leaks.
  • Don't forget about authorization: roles, user types, organizations.
  • Think about account merging — what happens when a user signs up with email but later uses Google OAuth?

Here's my GitHub project using Auth.js.

P.S: Before copy-pasting anything, check the version and follow the docs.

All the best. And read Part 2, where I cover backend, database, and storage.

Next: Part 2: Backend, Database & Storage Solutions