We use cookies to enhance your experience on the site
CodeWorlds

Hosting Static Pages - Publish Your Pyramid

You have built a pyramid - but nobody will see it if it stays hidden on your disk! Hosting is the place where your page will be available to the entire world via the internet. For static HTML/CSS/JS pages, free hosting services exist.

What Is a Static Page?

A static page is a page made up of ready-made HTML, CSS, and JavaScript files. It does not require a backend server or a database. The browser downloads the files and displays them directly.

GitHub Pages

GitHub Pages is free hosting from GitHub. An ideal solution to start with:

How to Publish a Page on GitHub Pages:

  1. Create a repository on GitHub (e.g.,
    my-pyramid
    )
  2. Upload files HTML, CSS, JS to the repository
  3. Go to Settings -> Pages
  4. Select a branch - usually
    main
  5. Click Save
  6. Your page will be available at:
    https://your-username.github.io/my-pyramid/

File Structure for GitHub Pages:

1<!-- The file must be named index.html -->
2my-pyramid/
3  index.html       <!-- Main page -->
4  style.css        <!-- Styles -->
5  script.js        <!-- JavaScript -->
6  images/          <!-- Images folder -->
7    pyramid.jpg
8    sphinx.png

Netlify

Netlify is a modern hosting platform with a free plan. It offers:

  • Drag & drop deployment - drag and drop a folder with files
  • Automatic HTTPS - free SSL certificate
  • Custom domain - you can connect your own domain
  • Continuous deployment - automatic deploy from GitHub

Deploy on Netlify:

  1. Go to app.netlify.com
  2. Drag the folder with files onto the page
  3. Done! The page is available at
    https://random-name.netlify.app

Vercel

Vercel is a platform from the creators of Next.js, but it works great for static pages too:

  • Import from GitHub - connect a repository
  • Automatic builds - every push = new deploy
  • Preview deploys - preview changes before publishing
  • Free HTTPS - automatic certificate

Platform Comparison

| Feature | GitHub Pages | Netlify | Vercel | |---------|-------------|---------|--------| | Price | Free | Free (basic) | Free (hobby) | | HTTPS | Yes | Yes | Yes | | Custom domain | Yes | Yes | Yes | | Drag & drop | No | Yes | No | | CI/CD from GitHub | Yes | Yes | Yes | | Forms | No | Yes | No |

Custom Domain

Every platform lets you connect a custom domain:

  1. Buy a domain (e.g., on Namecheap, GoDaddy, Cloudflare)
  2. Configure DNS - set CNAME or A records
  3. Add the domain in the hosting platform settings
Go to CodeWorlds