Lecture 1.7: Publishing Your First Website | Practical AI & Website Building Course

Publishing your first website from local computer to GitHub repository to live website.

Opening idea: publishing turns your local files into a public website people can visit.

Mission Brief

What this lecture will achieve

Understand publishing

Students understand the difference between saving files locally and publishing a live website.

Use GitHub workflow

Students learn the basic commit, push and GitHub Pages publishing flow.

Check before sharing

Students test links, images, mobile view and content before sharing the website publicly.

Core Message

Your website becomes real when it has a public link

A website file on your laptop is private. A published website link is public. Publishing is the bridge between your work and your audience. Build locally. Save to GitHub. Publish online.

Local folder to GitHub repository to live website.

The three-stage idea: local folder, GitHub repository, live website.

Publishing Concept

From local files to live website

Stage	Where it lives	Who can access it	Purpose
Local folder	Your computer	Only you	Create and edit website files.
GitHub repository	GitHub online storage	You and collaborators	Store, version and manage website files.
Live website	GitHub Pages or hosting platform	Public visitors	Share the website with the world.

Important: A local laptop path is not a website link. Visitors need a public URL such as a GitHub Pages link or custom domain.

Basic publishing workflow: create files, save locally, commit, push, publish, open live link.

Publishing Workflow

The beginner process

Create or edit files

Edit your website files in VS Code.

Save locally

Save your changes inside the correct project folder.

Commit changes

Create a clear Git commit describing what changed.

Push to GitHub

Upload your commit to the online GitHub repository.

GitHub Pages publishes

GitHub Pages or your hosting platform serves the website.

Open live link

Test the public link in your browser.

Common Git Bash flow: git status git add . git commit -m "Publish first website" git pull --rebase origin main git push origin main

Check before you go live: homepage, navigation, images, mobile view, spelling, buttons and analytics if needed.

Quality Check

Before you share your link

Homepage opens

Confirm your main page opens correctly in the browser.

Navigation works

Click every menu item and internal link.

Images load

Check that images appear and paths are correct.

Mobile view looks clean

Use browser responsive mode or phone testing.

Text reviewed

Check spelling, titles and simple wording.

Buttons tested

Test buttons, downloads and contact links.

Common publishing mistakes can usually be avoided with careful folder structure, simple names and repeated testing.

Common Mistakes

Avoid these publishing problems

Common mistakes

Forgetting to push changes.
Using broken file paths.
Publishing from the wrong folder.
Using mixed-up file names.
Sharing an old cached page.

Better practice

Commit and push every update.
Use clear relative links.
Keep folders organized.
Use simple lowercase file names.
Refresh and test live pages.

Tip: When something does not show online, first check: Did I save, commit, push, and refresh the public page?

When your first website is live, the journey has only started. You can keep improving over time.

Lecture 1.7 Prompt Lab

Publishing Prompt Library

Students should use these prompts to understand publishing, check their work and solve beginner problems safely.

Prompt 1 · Explain publishing

Explain website publishing to me like I am a complete beginner. Show the difference between local files, GitHub repository, GitHub Pages, and a public website link.

Prompt 2 · Publishing checklist

Create a beginner checklist for publishing my first website. Include saving files, checking links, committing changes, pushing to GitHub, enabling GitHub Pages, opening the live link, and testing mobile view.

Prompt 3 · Git Bash workflow

Act as a beginner Git teacher. Explain these commands for publishing a website: git status, git add ., git commit -m, git pull --rebase origin main, and git push origin main.

Prompt 4 · Troubleshoot 404

My published website shows a 404 error. Ask me for non-sensitive details such as file names, folder path, GitHub Pages settings, and public URL. Then guide me step by step to fix the issue.

Prompt 5 · Fix broken images

My website images are not showing after publishing. Explain how to check image file names, folder paths, relative links, capital letters, spaces in names, and whether the images were pushed to GitHub.

Prompt 6 · Review before sharing

Act as my website quality reviewer. Create a final checklist before I share my public website link. Include homepage, navigation, images, mobile view, spelling, buttons, downloads, speed, and copyright notice.

Open Full Lecture 1.7 Prompt Library

Practice Task

Publish your first website

Task 1

Create or confirm a simple website folder containing index.html and one CSS file.

Task 2

Push your website files to a GitHub repository.

Task 3

Open your public website link and test homepage, links, images and mobile view.

Common mistake: Do not share your local folder path as your website link. Share the public website URL only.

Final Checklist

Lecture 1.7 complete

I understand what publishing means.
I know the difference between local folder, GitHub repository and live website.
I understand the save, commit, push and publish workflow.
I know how to check the public website before sharing.
I know common publishing mistakes and how to avoid them.
I have used at least two prompts from the Prompt Lab.

Next Lecture 1.8 Back to Module 1

FutureWorld Intelligence materials

© 2026 FutureWorld Intelligence. All modules, lectures, prompts, visuals, graphics, downloadable files and instructional designs are protected intellectual property. Students may use this material for personal learning and may share official links. Copying, re-uploading, selling, modifying, packaging, distributing or presenting this material as someone else’s work is not allowed without written permission.