Git Fundamentals

Learn Git workflow with text files and how to write meaningful commit messages from day one.

Introduction

Why Git Changes Everything

Real-world scenario: After finishing my studies at SWIC, I embarked on an internship project for the City of Columbia. At that time, I had no idea what I was doing, and there was little technical support available. I often found myself creating a new folder for each small feature I developed, leading to 40-50 different copies of the same project. When a feature broke, I had to manually compare files to identify what had changed.

It was only after this experience that I learned about Git. Unfortunately, it was never taught in my courses at SWIC, and I want to ensure that future students do not miss out on this essential tool. The positive feedback I receive from learners who find jobs due to their understanding of Git reinforces its importance, especially since many entry-level positions require this knowledge.

Learning Git not only helps prevent the chaos I experienced but also equips students with a vital skill that is highly valued in the job market.

The Cost of Not Using Git

Without Git, developers face:

  • Lost work: One wrong save can destroy hours of effort
  • Collaboration chaos: "final_v2_REALLY_FINAL_fixed.html"
  • No accountability: Who changed what? When? Why?
  • Fear of experimentation: Scared to try new things because you might break working code, or you have to make 50 copies of your project and then try to backtrack manually πŸ˜“

With Git, you gain:

  • Confidence: Every change is tracked and reversible
  • Professional credibility: Required skill for any programming job
  • Clear history: See exactly what changed and why
  • Safe experimentation: Try new features without breaking what works

What You'll Learn Today

  • What Git is and why developers can't live without it
  • How to set up Git with your identity
  • Basic Git workflow: add, commit, status, log
  • How to write commit messages that don't make your future self angry
  • Practicing with text files before moving to code

What Success Looks Like

By the end of this lesson, you'll have a Git repository with at least 5 commits, each with a clear message describing what changed. Your git log --oneline will tell a story of your learning progress, and you'll be able to navigate your project's history with confidence.

Core Concept Overview

What is Git?

Git is a Version Control System (VCS) - think of it like "Track Changes" in Microsoft Word or Google Docs version history, but with much more control and designed for any type of file.

Think of Git like:

  • Photo album: Each commit is a snapshot of your project at a point in time
  • Save game: You can always go back to any previous "save point"
  • Time machine: See what your project looked like days, weeks, or months ago

Key Git Concepts

Repository (Repo):

  • A folder that Git is tracking
  • Contains your files plus Git's tracking information
  • Can be local (on your computer) or remote (on GitHub)

Staging Area:

  • A "waiting room" for changes before they become commits
  • You choose which changes to include in each commit
  • Gives you control over what gets saved together

Commit:

  • A snapshot of your project at a specific moment
  • Like taking a photo of all your files at once
  • Includes a message describing what changed

Think of the staging area like packing a moving box. You don't throw everything into the box at once - you carefully select which items belong together. Maybe all kitchen items go in one box (one commit), while bedroom items go in another (separate commit). The staging area lets you organize related changes before permanently saving them.

The Basic Git Workflow

Working Directory β†’ Staging Area β†’ Repository
     (edit)          (git add)     (git commit)

This is what happens:

  1. You edit files in your working directory
  2. You select changes with git add β†’ moves to staging
  3. You save permanently with git commit β†’ stored in repository

Here's a concrete example with a todo.txt file:

Working Directory: todo.txt has "- [ ] Learn Git" β†’ "- [x] Learn Git"
                   (file is modified but Git hasn't been told)

Staging Area:      git add todo.txt
                   (change is staged, ready to commit)

Repository:        git commit -m "Check off Git learning goal"
                   (change is permanently saved in history)

This workflow becomes second nature after practice.

Important Understanding: Git is Local

Everything we're doing with Git right now is completely local to your computer. These commits exist only on your machine. GitHub (which we'll learn later) is where you'll share these commits with the world. Think of it like writing in a private journal (local Git) versus publishing a blog post (pushing to GitHub).

Hands-On Application

Step 1: Configure Git Identity

Before using Git, you need to tell it who you are. This information appears in every commit you make.

  1. Open Warp Terminal:

    • Press Cmd + Space (Mac) or Windows key, type "Warp", press Enter
  2. Set your name:

    git config --global user.name "Your Full Name"
    

    Replace "Your Full Name" with your actual name in quotes.

  3. Set your email:

    git config --global user.email "your.school@email.edu"
    

    Use your school email address - this unlocks GitHub education benefits.

    Note: You can add multiple emails to your GitHub account later, or change this with the same command using a different email.

  4. Important: Set VS Code as your default editor (this prevents VIM from opening):

    git config --global core.editor "code --wait"
    

    This ensures Git uses VS Code instead of VIM for any text editing needs.

  5. Verify your settings:

    git config --global --list
    

    You should see your name, email, and editor settings in the output.

Note about VIM: If you ever accidentally end up in VIM (you'll see a scary text editor with ~ symbols), don't panic (OK, maybe just a little)! Press Esc then type :q! and press Enter to exit without saving. But with the VS Code setting above, this shouldn't happen.

πŸ’‘ Pro Tip: Using your school email gives you access to the GitHub Student Developer Pack with free tools worth hundreds of dollars, including GitHub Copilot. You can always add personal emails to your GitHub account or update your Git config later when you graduate.

Step 2: Create Your First Git Repository

We'll start with text files to learn Git concepts before moving to code.

  1. Navigate to your Code folder:

    cd ~/Code        # Mac
    
  2. Create a new folder for Git practice:

    mkdir git-practice
    cd git-practice
    
  3. Initialize Git repository:

    git init
    

    You should see: "Initialized empty Git repository"

    Note: Ordinarily, we will not be starting with a Git repository from scratch. You would normally clone an existing repository, but that comes later.

  4. Check the status (you'll use this command constantly):

    git status
    

    This shows what Git sees in your folder.

    Why git status matters: Running git status is like checking your GPS while driving - it tells you exactly where you are and what your next move should be. Professional developers run this command obsessively because it prevents mistakes before they happen.

Step 3: Practice with Text Files

Let's learn Git with simple text files first.

  1. Create a README MarkDown file:

    You can do this with the touch command: touch README.md. Alternatively, you can open up VS Code with code . and create the file there.

    Create the file in VS Code with this content:

    My First Git Repository
    
    This is where I'm learning Git fundamentals.
    

    Remember to open VS Code with code . from your 'git-practice' folder.

  2. Check Git status:

    git status
    

    You'll see README.txt listed as "untracked file"

  3. Add the file to staging area:

    git add README.md
    
  4. Check status again:

    git status
    

    Now README.txt shows as "Changes to be committed"

  5. Make your first commit:

    git commit -m "Add README file with project description"
    

Congratulations! You've made your first Git commit.

Step 4: Practice the Git Workflow

Let's practice the add-commit cycle with more changes.

  1. Create a to-do list file (todo.txt):

    My Learning Goals:
    - [ ] Learn Git basics
    - [ ] Practice meaningful commit messages
    - [ ] Set up first repository
    - [ ] Understand staging area
    
  2. Add and commit the new file:

    git add todo.txt
    git commit -m "Add learning goals todo list"
    
  3. Update your todo list - check off completed items:

    My Learning Goals:
    - [x] Learn Git basics
    - [x] Practice meaningful commit messages
    - [x] Set up first repository
    - [x] Understand staging area
    
  4. Stage and commit the changes:

    git add todo.txt
    git commit -m "Mark completed learning goals as done"
    
  5. View your commit history:

    git log --oneline
    

    You'll see all your commits with their messages. Fun fact: I just learned about --oneline!

Step 5: Writing Good Commit Messages

In professional settings, your Git history becomes your development diary. Colleagues read your commit messages to understand what changed and why. Good Git habits now mean smoother code reviews and faster onboarding at your first job.

Bad commit messages:

  • "fix"
  • "update"
  • "changes"
  • "asdfgh"

Good commit messages:

  • "Add user authentication to login form"
  • "Fix navigation menu not closing on mobile"
  • "Update README with installation instructions"
  • "Remove unused CSS styles from homepage"

Commit Message Formula

Format: [Action] [what you did]

Use present tense imperative mood (like giving a command):

  • βœ… "Add contact form"
  • ❌ "Added contact form"
  • ❌ "Adding contact form"

Examples:

  • Add contact form to homepage
  • Fix broken link in navigation menu
  • Update Node.js version requirements
  • Remove deprecated API calls

Practice Scenario: The Breaking Change

Let's see how Git saves you from disaster:

  1. Create a file called important.txt:

    This is very important information.
    Do not lose this data!
    It took hours to write.
    
  2. Commit it:

    git add important.txt
    git commit -m "Add important documentation"
    

    If you see "nothing to commit," make sure you saved the file first!

  3. "Accidentally" mess up the file - edit important.txt to just say:

    oops
    

    ⚠️ IMPORTANT: Save the file!

    • In VS Code: Press Cmd+S (Mac) or Ctrl+S (Windows)
    • Or use File β†’ Save from the menu
    • You'll know it's saved when the white dot next to the filename disappears
  4. See what you broke:

    git diff
    

    You should see red lines (deleted text) and green lines (added text) showing your changes.

    Not seeing anything? Make sure you:

    • Saved the file after changing it
    • Are in the right directory (pwd to check)
    • Actually changed the content (not just opened and closed the file)
  5. Restore the file (this is the magic!):

    git restore important.txt
    

    This command restores the file to its last committed state.

    Note: You might see older tutorials use git checkout -- important.txt - this does the same thing, but git restore is the modern, clearer command designed specifically for restoring files.

  6. Verify it's restored:

    cat important.txt
    

    You should see your original three lines of text back!

You just saved yourself from a fake disaster! Now imagine this was 100 lines of carefully crafted code that took you three hours to write. Without Git, you'd be frantically trying to remember what you typed. With Git, recovery takes seconds. This scenario happens more often than you'd think - maybe you delete the wrong section, your cat walks across your keyboard, or you accidentally paste something over your work.

Troubleshooting This Exercise

  • git diff shows nothing: You need to save the file after editing! The file must be saved for Git to see changes.
  • git restore didn't work: Make sure the file was committed first (step 2) and that you saved your "oops" change.
  • Can't see file contents: Use cat important.txt in Warp Terminal to display the file contents. If it says "No such file or directory," double-check your spelling and current directory.

Terminal Tips for Git with Warp

  • Use Warp AI: Type # followed by what you want to do
    • Example: #how do I see what files changed
  • Don't memorize: Use git status constantly to see what's happening
  • Tab completion: Type first few letters, press Tab
  • Arrow keys: Press ↑ to repeat previous commands
  • Clear screen: Type clear when terminal gets cluttered

Common Beginner Issues

"Nothing to commit" message

git status
# Shows if you have changes to commit
# If clean, make some changes first!

Forgot to add files before committing

If you forgot to include a file in your last commit, don't worry - just add it to your next commit. Each commit tells part of the story, and it's perfectly fine to have multiple small commits.

Want to see what changed

git diff              # See unstaged changes
git diff --staged     # See staged changes
git show              # See last commit changes

Accidentally in VIM editor

If you ever see a screen full of ~ symbols:

  1. Press Esc
  2. Type :q!
  3. Press Enter
  4. Run git config --global core.editor "code --wait" to prevent this

Windows Git Issues

If Windows says Git isn't recognized as a command, refer back to the Windows Setup Guide for troubleshooting steps.

Git Myths - Don't Believe These!

  • Myth: "Git will delete my files" - Git never deletes files unless you explicitly tell it to
  • Myth: "You can break Git by committing too much" - More commits are better than fewer
  • Myth: "Professional developers memorize all Git commands" - Everyone googles Git commands, even senior developers
  • Myth: "Git is only for team projects" - Solo developers benefit just as much from version control

Best Practices for Git

Commit frequency:

  • Commit often: Multiple times per coding session
  • Logical chunks: Group related changes
  • Working state: Don't commit broken code
  • Before breaks: Always commit before stopping work

Fun Fact: I learned Git from Dave McFarland. He said to, "Commit early! Commit often!"

Essential commands to master:

git status          # Check current state (use constantly!)
git add [file]      # Stage specific file
git add .           # Stage all changes (use carefully)
git commit -m "msg" # Commit with message
git log --oneline   # View commit history
git diff            # See what changed

Understanding Git vs. GitHub

What is Git?

Git is a distributed version control system that allows developers to track changes in their code, collaborate with others, and manage project history. It operates locally on your machine, enabling you to work offline and commit changes without needing an internet connection.

What is GitHub?

GitHub is a cloud-based platform that hosts Git repositories. It provides a web interface for managing Git repositories, facilitating collaboration among developers, and offering features like issue tracking, pull requests, and project management tools. GitHub allows you to share your Git repositories with others and collaborate on projects.

In practice, GitHub also feels like a "social layer" for code: developers have profiles, can follow each other, star repositories, and discover projects. This is why you'll sometimes hear it described informally as "social media for programmers," even though its core purpose is hosting Git repositories and enabling collaboration.

Relationship Between Git and GitHub

  • Git is the tool that manages version control.
  • GitHub is a service that hosts Git repositories and provides additional collaboration features.
  • You can use Git without GitHub, but GitHub enhances the collaborative experience by allowing multiple developers to work together seamlessly.

Git Integration into VS Code

Visual Studio Code (VS Code) has built-in support for Git, making it easy to manage your repositories directly from the editor. Here’s how Git integrates into VS Code:

  1. Source Control View: Access the Source Control view by clicking on the Source Control icon in the Activity Bar. This view shows your changes, staged files, and commit history.

  2. Staging Changes: You can stage changes by clicking the "+" icon next to modified files or using the context menu.

  3. Committing Changes: Enter a commit message in the input box at the top of the Source Control view and click the checkmark icon to commit your changes.

  4. Viewing History: Use the built-in Git history feature to view your commit history and see changes over time.

  5. Branch Management: Create, switch, and manage branches directly from VS Code, allowing you to work on features or fixes in isolation.

  6. Extensions: Enhance your Git experience with extensions like GitLens, which provides additional insights into your repository's history and contributions.

By integrating Git into VS Code, you can streamline your development workflow and manage version control without leaving your coding environment.

Wrap-Up & Assessment

Key Takeaways

  1. Git tracks every change you make to your files
  2. Staging area gives control over what goes in each commit
  3. Good commit messages help your future self and teammates
  4. Commit frequently with logical, working chunks
  5. Git is essential for any programming career

HW: Three-Stage Git Practice

Stage 1: Interactive Learning

A visual overview of Git
You only need to do number 1️⃣ here.

Stage 2: Local Practice

  • Create a new folder called git-journal
  • Initialize it as a Git repository
  • Create at least 5 commits with different types of changes:
    • Add a new file
    • Modify an existing file
    • Add multiple files in one commit
    • Make multiple changes to the same file across different commits
  • Each commit message must follow the imperative format
  • Submit screenshot of git log --oneline showing your commit history

Stage 3: Reflection

  • Write a paragraph about what clicked for you with Git
  • Identify one thing that's still confusing
  • Describe how you might use Git for a personal project

Success Criteria:

  • [ ] All commands execute without errors
  • [ ] Commit messages follow the imperative format
  • [ ] Screenshots clearly show terminal output
  • [ ] Demonstrate understanding of staging vs committing
  • [ ] Show progression through multiple commits

HW: Quick Assessment Reflection πŸͺž

Review this quiz. Then, open up any text editor and write down your thoughts on each question. Expand on the correct answers and reflect on your own learning process. Explain why the other answers are wrong. Add in any personal analogies or insights from your own learning journey.

Test your understanding:

  1. What's the difference between staging and committing?

    • Answer: Staging selects changes for the next commit; committing saves those changes permanently
  2. Which is a better commit message?

    • a) "Fixed stuff"
    • b) "Fix login button not responding on mobile"
    • Answer: b) - it's specific and uses imperative mood
  3. When should you run git status?

    • Answer: Constantly! Before and after every Git operation to understand what's happening

Command Quick Reference

# Setup (one time)
git config --global user.name "Your Name"
git config --global user.email "your.school@email.edu"
git config --global core.editor "code --wait"

# Daily workflow
git status                  # Check current state
git add [file]              # Stage specific file
git add .                   # Stage all changes
git commit -m "message"     # Commit staged changes
git log --oneline           # View commit history

# Seeing changes
git diff                    # Unstaged changes
git diff --staged           # Staged changes
git show                    # Last commit details

# Restoring files (modern commands)
git restore [file]          # Restore file to last committed state
git restore --staged [file] # Unstage file (move from staging back to working)

# Legacy commands (you might see in older tutorials)
git checkout -- [file]     # Old way to restore (use git restore instead)
git reset HEAD [file]      # Old way to unstage (use git restore --staged instead)

# Emergency exit from VIM
# Press Esc, then type :q! and press Enter