Zero-Cost Hosting for Student Projects

I discovered a simple, free method for hosting HTML and CSS websites: GitHub Pages. It is incredibly user-friendly and works best when managed from a laptop or desktop computer.

How to Set Up GitHub Pages

Regardless of your operating system (Windows, macOS, or Linux), the process is identical because it primarily lives in your web browser.

1. Create a Repository

• Log in to GitHub.
• Click the + icon in the top right and select New repository.
• Repository Name: Give it a name (e.g., my-website).
• Publicity: Ensure it is set to Public (Private hosting requires a paid plan for GitHub Pages).
• Check the box that says Add a README file.
• Click Create repository.

2. Upload Your Files

• Inside your new repository, click Add file > Upload files.
• Drag and drop your index.html, style.css, and any images into the window.
• Crucial Note: Your main homepage must be named index.html for GitHub to recognize it as the landing page.
• Click Commit changes.

3. Enable the Website

• Go to the Settings tab at the top of your repository.
• On the left sidebar, click Pages (under the "Code and automation" section).
• Under Build and deployment, ensure the source is set to "Deploy from a branch."
• Select the main branch and the /(root) folder.
• Click Save.

4. View Your Site

After a minute or two, refresh the Pages settings screen. You will see a bar at the top that says: "Your site is live at..." followed by your new URL.

Platform-Specific Tips

While the web steps are the same, here is how to handle the files locally:

• Windows: Use File Explorer to organize your HTML/CSS files before dragging them into the browser.
• macOS: Use Finder. Avoid using "TextEdit" to write code unless it's in "Plain Text" mode; use VS Code instead.
• Linux/Chromebook: Since you likely have a terminal, you can eventually learn to use git push to update your site, but the "Upload files" button in the browser works perfectly for beginners.