Simple Web Template

A basic boilerplate for web projects using HTML, CSS, and JavaScript. This template uses a flat file structure for simplicity.

Project Structure

All core files are located in the root directory for easy access.

• index.html - The main structure of the website.
• styles.css - The stylesheet for all visual design.
• script.js - The JavaScript file for site logic and interactivity.
• images/ - A folder to store all graphic assets (JPG, PNG, SVG).

File Descriptions

index.html

The entry point of the site. It includes a link to the CSS file in the head and a reference to the JavaScript file at the end of the body.

styles.css

Contains all custom CSS. It is linked directly in the HTML as .

script.js

Contains all functional code. It is linked at the bottom of the HTML as <script src="script.js"></script>.

How to Run with GitHub Codespaces

1. Go to your repository on GitHub.com.
2. Click the green "Code" button.
3. Select the "Codespaces" tab and click "Create codespace on main".
4. Once the editor loads, click "Go Live" in the bottom status bar or right-click index.html and select "Open with Live Server" to view your site.

How to Save and Push Changes

In Codespaces, your files save automatically to the cloud, but you must "Commit" and "Push" to update your actual GitHub repository.

1. Click the "Source Control" icon in the left sidebar (it looks like a branch/node).
2. Type a short message in the "Message" box describing what you changed (e.g., "Updated styles").
3. Click the "Commit" button.
4. Click the "Sync Changes" or "Push" button to send the updates back to GitHub.com.