Before you start these steps, make sure you already have three things done. If any of these are missing, click back to the hub and take care of them first.
ReminderEverything on this page happens in your web browser on github.com. You are not going to install anything, open a terminal, or type any commands. If that is what you wanted, go do the command line tutorial instead.
Step 1: Upload your files
This is the easy part. You are literally going to drag your project folder into the browser window.
Open your repo
You should already be there right after creating it. If not, go to github.com/your-username/your-repo-name.
Click "Add file" then "Upload files"
The button is just above your file list, on the right side. It says Add file ⤷.
Drag your project folder into the box
Open Finder (Mac) or File Explorer (Windows), find your capstone folder, and drag it into the big dashed box on the GitHub page. GitHub will automatically include every file and folder inside it. You can also click "choose your files" if dragging is not your thing.
Wait for the upload to finish
You will see a progress bar at the bottom. Do not close the tab until every file shows a green checkmark. Large projects can take a minute or two.
Write a commit message
Scroll down. In the first text box, type something clear like Initial upload of capstone project. Leave the description blank. Click Commit changes. That is it.
Things NOT to uploadAny file with a password in it. Any .env file (those contain API keys). Anything above 100 MB per file. Node_modules or vendor folders — those are huge and should be rebuilt from package.json or similar. Files with personal info like social security numbers or real student records.
Step 2: Make changes and commit them
You fixed a bug. You added a new feature. You rewrote the README. Now you need to save that change to GitHub. This is called committing. A commit is a snapshot of your project at a point in time with a message explaining what changed.
Option A: Edit a single file in the browser
Click the file you want to edit
For example, click README.md on your repo page.
Click the pencil icon
Top right of the file view. This opens an editor right in the browser.
Make your changes
Type, delete, whatever you need to do. There is no save button here — saving happens in the next step.
Click "Commit changes"
Green button, top right. A box pops up asking for a commit message. Write something meaningful like Fix broken link in README. Click Commit changes.
Option B: Upload new or changed files
Same upload flow as Step 3
Go to Add file → Upload files and drop the changed files in. If a file already exists with the same name, GitHub will replace it and remember the old version.
Write a clear commit message
Describe what changed in present tense. Examples: Add login page, Fix database connection bug, Update styling for mobile.
Click Commit changes
Done. Your repo now has a new snapshot, and anyone visiting can see the history of what changed.
Commit message rulesKeep it short (under 60 characters). Use present tense: "Add feature" not "Added feature." Be specific: "Fix cart total bug" not "Fix stuff." Your future self will thank you when you are trying to figure out what changed six months from now.
Step 3: Write a proper README.md
The README is the front page of your repo. When a recruiter, a professor, or your future self lands on the page, this is the first thing they read. A repo without a good README looks abandoned. A repo with a clear README looks professional, even if the code inside is modest. This is the single highest-leverage thing you can write.
What a good README always has
1
Project nameBig, clear title at the top.
2
One-line pitchWhat it does, in plain English.
3
Screenshot or demoEven a phone photo of the running app.
4
How to run itThe exact commands someone else would type.
The README protocol — the sections to include, in order
# Project Title
One # makes a big heading. Use the real project name, not capstone.
One-sentence description
What the project does and who it is for. This is the tagline a hiring manager reads in three seconds.
## Screenshot or Demo
Two ## makes a subheading. Drag an image into the GitHub editor and it uploads automatically. Even a rough photo of the running app is better than nothing.
## Features
A short bulleted list of what the project actually does. Three to six bullets. No marketing fluff.
## Tech Stack
The languages, frameworks, and databases you used. Example: Python 3.11, Flask, SQLite, Bootstrap 5.
## How to Run It
Step by step commands or actions so somebody else can get it running on their computer. This is the part that separates "nice project" from "real project."
## What I Learned
Two or three sentences about what you picked up. This section is gold in interviews — it shows you can reflect on your work.
## Credits / Author
Your name, a link to your LinkedIn, and credit to anyone whose tutorial or library you relied on.
Copy-paste README template
Here is a working template you can paste directly into your README.md and fill in. Markdown is just plain text with a few symbols — GitHub formats it automatically.
# Capstone Inventory App
A Python and SQLite inventory tracking application built for small businesses that need to manage stock without the cost of commercial software. Developed as my NOVA ITP 120 capstone project.
## Screenshot
## Features
- Add, edit, and delete inventory items
- Search and filter by category or supplier
- Low-stock alerts with configurable thresholds
- Export reports to CSV
- Simple login with hashed passwords
## Tech Stack
- **Language:** Python 3.11
- **Framework:** Flask
- **Database:** SQLite
- **Front end:** HTML, CSS, Bootstrap 5
- **Deployment:** Local only (capstone scope)
## How to Run It
1. Clone this repo: `git clone https://github.com/yourname/capstone-inventory-app.git`
2. Install dependencies: `pip install -r requirements.txt`
3. Initialize the database: `python init_db.py`
4. Start the app: `python app.py`
5. Open your browser to `http://localhost:5000`
## What I Learned
Working on this project taught me how to structure a real multi-file Python application, how to design a normalized SQLite schema, and how to handle user authentication safely with password hashing. The hardest part was the CSV export — encoding edge cases took me a full afternoon to debug.
## Credits
Built by First Last for NOVA ITP 120, Spring 2026.
LinkedIn: [linkedin.com/in/yourname](https://linkedin.com/in/yourname)
Flask tutorial adapted from the official Flask documentation.
## License
This project is open for educational use.
How to add it to your repo
Open README.md on your repo page
If you checked "Add a README file" when you created the repo, it is already there. Click the file name.
Click the pencil icon
Top right of the file view.
Paste the template and fill it in
Replace every placeholder with real information about your project. Do not leave placeholder text — it looks worse than no README at all.
Preview before committing
Click the Preview tab at the top of the editor to see how it will look formatted. Headings should be big and bold. Bullets should have dots. Code should look like code.
Commit with a message
Write Add project README and click Commit changes. Your repo front page is now professional.
The markdown symbols you need to know# for a big heading, ## for a sub-heading, **bold** for bold, *italic* for italic, - item for a bullet, `code` for inline code with backticks, and [text](url) for a link. That is 90% of what you will ever need.
Step 4: Get your shareable URL
This is the URL you put on your resume, in your LinkedIn, and in cover letters. It is the whole reason we are doing this.
Your repo URL is always this format:
https://github.com/your-username/your-repo-name
Your profile URL (shows all your repos at once) is this:
https://github.com/your-username
You can get the exact URL by just copying it from your browser's address bar when you are on the repo page. That is the easiest way.
Put it on your resume like thisUnder your name and contact info: github.com/yourname (drop the https:// — it saves space and still works). Or link directly to the capstone repo if you only have one thing you want them to see.
URL Builder
Type your GitHub username and repo name below and I will generate every URL you need. Try it before you even have an account — just use a fake name to see what the URLs will look like.
Build your GitHub URLs
Your URLs will appear here.
Step 5: Make your capstone a live website (Bonus)
If your capstone is anything with HTML, CSS, or JavaScript in it (a portfolio site, a web app front end, a landing page, an interactive tutorial), GitHub Pages will turn your repo into a real live website for free in under a minute. This is huge. A live URL is 10x more impressive on a resume than a zip file.
Make sure your file is named index.html
GitHub Pages looks for a file called exactly index.html at the root of your repo. Rename your main file if needed before you upload.
Go to your repo's Settings tab
It is in the top right of the repo page, all the way over. Click Settings.
Click "Pages" in the left sidebar
Scroll the left menu until you see Pages. Click it.
Set the Source to "main" branch
Under "Build and deployment," change the branch dropdown to main and leave the folder as / (root). Click Save.
Wait about 60 seconds, then refresh
A green box will appear at the top of the Pages settings with your live URL.
Your live URL will look like this:
https://your-username.github.io/your-repo-name/
Every time you commit a change to your repo, the live site updates automatically in about a minute. No deployment headaches, no servers to maintain, no credit card required.
“Can I have a live Pages URL and keep my source code private?”Yes — if you claimed the Student Developer Pack. GitHub Pages for a private repo requires GitHub Pro, and the Student Pack gives you GitHub Pro for free. The built website itself is still publicly viewable at the yourname.github.io/repo URL, but the source code stays locked down. Without the Student Pack, a completely free account can only publish Pages from a public repo.
What if I want the website itself to be private too?Making the Pages website itself access-controlled (so only people you invite can even view the site, not just the code) is a GitHub Enterprise feature and it is not free. For almost every student capstone, you do not need this — "public site, private source" is the normal setup and that is what the Student Pack gives you.
Mac vs Windows notes
Here is the beautiful thing about the web browser method: it is exactly the same on both operating systems. You sign up at github.com, you click the buttons, you drag files in. That is it. The only difference is how you find and open your project folder.
macOS
Find your project folder in Finder (the smiley face icon in your dock).
To drag files to GitHub, just grab the folder and drop it into the browser window.
Keyboard shortcut to copy: ⌘ + C. To paste: ⌘ + V.
If you use Safari and it blocks the drag and drop, switch to Chrome or Firefox.
Hidden files (starting with a dot) are not visible by default. Press ⌘ + Shift + . in Finder to show them.
Windows
Find your project folder in File Explorer (the yellow folder icon in your taskbar).
To drag files to GitHub, grab the folder and drop it into the browser window.
Keyboard shortcut to copy: Ctrl + C. To paste: Ctrl + V.
Edge, Chrome, and Firefox all handle drag-and-drop upload fine.
To see hidden files: in File Explorer click View → Show → Hidden items.
The pointEvery step in this tutorial works identically on Mac and Windows because it all happens in your web browser. Do not let anyone tell you that you need a specific operating system to use GitHub. You do not.
That is the whole Path A tutorial
Your capstone is on GitHub. Your README is written. Your repo has a shareable URL. If you enabled Pages, you also have a live site. This is the thing you put on your resume.