This lesson is part of Week 2 of the FNB App Academy 2025. In Lesson 1, you learned how to use CSS to style your app. Now, you’re stepping into the world of version control, collaborative coding, and real-world workflows using GitHub.
If you missed the live session, don’t worry — this guide covers everything from basic GitHub terms to advanced collaboration techniques. Whether you’re working alone or with a team, GitHub is where your app becomes professional.
🚀 Why GitHub Matters for Developers
GitHub isn’t just another tool — it’s a cornerstone of modern software development. It’s where professional teams manage code, collaborate, track bugs, and launch updates.
In this lesson, Nolutando (your instructor) taught you:
- What Git and GitHub are (and how they’re different)
- How to create a repository and upload your app
- How to collaborate on code using branches, commits, and pull requests
- How to track changes, undo mistakes, and merge features safely
By the end, you weren’t just coding — you were coding like a pro.
🧰 Git vs GitHub: What’s the Difference?
Let’s clear this up first:
- Git: A version control tool you install locally. It tracks changes to files and allows you to go back in time. Think of it like “undo history” for developers.
- GitHub: A cloud platform where Git projects are hosted and shared. It’s where your code lives online, accessible to your team or future employers.
Analogy: Git is like email. GitHub is like Gmail.
📁 Key Terms You Learned
Here are the essentials every beginner should know:
| Term | What It Means |
|---|---|
| Repository (Repo) | A project folder where your code lives |
| Commit | A saved change with a short message explaining what you did |
| Branch | A copy of your main codebase where you can test ideas safely |
| Merge | Combining your branch back into the main codebase |
| Pull Request (PR) | A proposal to merge your changes, where teammates can review |
| Fork | Creating your own copy of someone else’s project to work on independently |
| README.md | A file that describes your project and how to use it |
👩💻 Step-by-Step: How to Upload Your First App
Here’s what you did in the practical demo:
1. Create a GitHub Account
- Visit github.com
- Sign up and remember your username and password
- Use the LMS video tutorial if you get stuck
2. Create a New Repository
- Open the GitHub Desktop app or Git CLI
- Name your repository (e.g.
my-ecommerce-store) - Add a description (optional)
- Choose a local folder path
3. Add Your App Files
- Copy your existing HTML, CSS, and image files into the folder Git created
- Confirm that files like
index.htmlandstyle.cssare present
4. Commit Your Changes
- Think of this as saving a version of your work
- Write a short message describing what you changed (e.g. “Added homepage”)
5. Publish to GitHub
- Click “Push to origin” or “Publish repository”
- This sends your local Git project to your online GitHub account
🌍 Collaborating with a Team Using Branches
Imagine five developers working on the same app. Chaos, right? That’s where branches come in.
Branches let each person work independently without touching the main code. Here’s how it works:
- Create a new branch (e.g.
login-page,style-update) - Make your changes on the branch
- Create a pull request when you’re ready to merge
- Teammates can review and comment
- If approved, merge into the main project
Branches = safe testing zones.
Merges = controlled updates.
🧪 Live Demo Highlights
Nolutando demonstrated:
- How to create a repo
- How to commit and push files
- How to create a branch
- How to make changes (like renaming a link)
- How to track, undo, and redo changes
- How to create a pull request and merge a branch into the main codebase
All of this was done using GitHub Desktop and VS Code — the same tools you should be using.
✅ Action Steps After This Lesson
Ready to apply what you learned?
- Sign up for GitHub if you haven’t already
- Upload your current app project to a new repository
- Commit and push your files
- Create a branch, make a small change, and push again
- Merge the branch into the main and verify it’s reflected online
If you’re working with a group, use GitHub to divide tasks safely and professionally.
💬 Final Thoughts from Your Instructor
Nolutando shared her own journey — starting from an under-resourced background, joining an IT learnership, and now working as a lead support instructor at IT Varsity. Her message was clear:
“Nothing is impossible. The word itself says ‘I’m possible.’”
By learning GitHub now, you’re not just following instructions — you’re stepping into a professional workflow used by top developers across the world.
Stick with it. Ask questions on the forum. And remember: every change you commit is another step forward.
Leave a Reply