Development2024-03-29

Building a Static Site with Zero Server Cost: My Indie Hacker Stack

I run a 500-page website for $0/month in hosting. Here's my stack: Next.js static export, Cloudflare Pages, and why I'll never pay for a server again.

#static-site#cloudflare#nextjs#indie-hacker#serverless

服务器续费贵。太贵了。

I used to pay $50/month for a VPS to host my side projects. Then I discovered static site generation. Now I host a 500-page website for exactly $0/month. Zero. Nada.

Here's my stack, why it works, and how you can replicate it for your own projects.

The Stack

  • Framework: Next.js with output: 'export'
  • Hosting: Cloudflare Pages (free tier: unlimited bandwidth)
  • Build: GitHub → Cloudflare auto-deploy
  • Database: None. Everything is JSON/Markdown at build time.
  • Total monthly cost: $0

Why Static Export?

Most websites don't need a server. Think about it:

  • Blog? Static.
  • Documentation? Static.
  • Portfolio? Static.
  • Landing pages? Static.
  • Tool websites? Static (if computation happens in the browser).

Next.js static export generates plain HTML/CSS/JS files. No Node.js server needed. No database connections. No runtime costs.

// next.config.js
module.exports = {
  output: 'export',
};

That's it. Run next build, get a folder of static files. Deploy anywhere.

Why Cloudflare Pages?

Feature Vercel (Free) Netlify (Free) Cloudflare Pages (Free)
Bandwidth 100GB 100GB Unlimited
Build minutes 6,000 300 500
Functions
Custom domain
Edge network Global Global 300+ cities

For a growing site, unlimited bandwidth is the killer feature. Vercel and Netlify will charge you $20+ once you exceed limits. Cloudflare won't.

The Workflow

  1. Push code to GitHub
  2. Cloudflare detects the push
  3. Runs npm run build
  4. Deploys out/ directory
  5. Live in ~60 seconds

No SSH. No Docker. No server management. Just push and go.

What About Dynamic Features?

"But what about user authentication? Database queries? API calls?"

Ask yourself: do you actually need them?

  • Search → Client-side with a JSON index
  • Forms → Third-party service (Formspree, Getform)
  • Comments → Giscus (GitHub Discussions)
  • Analytics → Google Analytics (client-side script)
  • Tools → All computation in the browser

I run 100+ web tools — JSON formatter, image compressor, tax calculator — all running 100% client-side. No server required.

Performance Benefits

Static sites are fast. Ridiculously fast.

  • No database queries (0ms latency)
  • No server-side rendering (instant HTML)
  • CDN-cached globally (TTFP < 50ms)
  • No cold starts

My Lighthouse scores: Performance 98, Accessibility 100, SEO 100.

When You Need a Server

Fair enough — some apps need a backend:

  • Real-time chat
  • Payment processing
  • Complex database queries
  • File uploads > 100MB

For those, use Cloudflare Workers (100k requests/day free) or a separate API service. But 90% of websites don't need any of this.

The Sitemap Problem

Static sites need a sitemap for SEO. But since there's no server, you need to generate it at build time. I wrote a postbuild script that crawls all generated HTML and creates a proper XML sitemap.

My Advice

If you're an indie hacker building a content site, tool site, or documentation site — go static. You'll save hundreds per year, get better performance, and never worry about server maintenance again.

Generate your sitemap automatically with our free Sitemap Generator — perfect for static sites deployed on Cloudflare Pages.

🛠

Try It Yourself

Put what you've learned into practice with our free online tools.