Hosting Guide

How to put your game on the internet so anyone can play it.

Why Static Hosting?

Both games are 100% client-side — HTML, CSS, and JavaScript files that run in the browser. No server-side code. No database. No API keys. This means you can host them on any static hosting service for free.

Folder Structure for Deployment

Your project folder should look like this before deploying:

your-game/
  index.html          ← Entry point (must be named index.html)
  style.css           ← Stylesheet
  main.js             ← Main game script
  game/
    state.js           ← Game state management
    loop.js            ← Core loop logic

Hosting Options

Option 1: GitHub Pages (Recommended)

  1. Create a GitHub account (if you don't have one)
  2. Create a new repository
  3. Upload all your game files
  4. Go to Settings → Pages
  5. Set source to "main" branch, root folder
  6. Your game will be live at username.github.io/repo-name

Option 2: Cloudflare Pages

  1. Create a Cloudflare account
  2. Go to Pages → Create a project
  3. Connect your GitHub repo or upload files directly
  4. No build settings needed (static files)
  5. Your game gets a free .pages.dev domain

Option 3: Netlify (Drag & Drop)

  1. Go to netlify.com
  2. Drag your project folder onto the deploy area
  3. Done — you get a free .netlify.app URL
  4. Simplest option, no account required for first deploy

Common Hosting Errors

Blank page after deploy

Usually means file paths are wrong. Check that your HTML links to CSS and JS with relative paths (e.g., ./style.css not /Users/yourname/game/style.css).

JavaScript not loading

Check the browser console (F12 → Console). Look for 404 errors. Make sure file names match exactly (case-sensitive on most hosts).

Three.js not rendering

Make sure the Three.js CDN script tag is in your HTML. Check that the CDN URL is using https:// (some hosts require it).

LocalStorage not working

LocalStorage works on all hosted sites. It does NOT work when opening files directly with file:// protocol in some browsers. Always test on the live URL.

Pre-Launch Testing Checklist