Git Commits and Tracking Changes

# CHAPTER 3

Git Commits and Tracking Changes #

1. Introduction #

2. Learning Objectives #

• Use git status to monitor the state of your files.

• Move files from the Working Directory to the Staging Area using git add.

• Permanently save snapshots using git commit.

• Write clear, professional commit messages.

• Use git diff to see exact line-by-line changes.

3. Beginner Explanation #

1. 1. The Bedroom (Working Directory): You have clothes scattered all over your bed.

1. 2. The Suitcase (Staging Area): You pick up a shirt and put it into the suitcase. You pick up pants and put them in. They aren't traveling yet; you are just organizing what *will* go. (This is git add).

1. 3. Zipping the Suitcase (The Commit): You close the suitcase, zip it up, and slap a label on it that says "Hawaii Trip 2024". The bag is now locked and ready. (This is git commit).

If you forget to git add a file, it gets left on the bed and doesn't get packed in the snapshot.

4. The Core Git Workflow #

1. 1. Check Status: Always ask Git what is happening.

   git status
   ```
   *(Git will list files in red if they are modified but not staged).*

2. **Stage the Files:** Move the files to the Staging Area.
   ```bash
   # Add a specific file
   git add index.html 
   
   # Or, add ALL changed files in the folder at once (The period means "everything here")
   git add .
   ```

3. **Commit the Files:** Take the permanent snapshot. You MUST include a message (`-m`) explaining what you changed.
   ```bash
   git commit -m "Add login button to homepage"
   ```

### 5. Writing Good Commit Messages
A commit message is a note to your future self and your teammates explaining *why* a change was made.
- **Bad:** `git commit -m "fixed stuff"`
- **Bad:** `git commit -m "update"`
- **Good:** `git commit -m "Fix typo in navigation menu"`
- **Good:** `git commit -m "Add responsive CSS to header"`

*Professional Rule: Write commit messages in the imperative mood, as if you are giving a command (e.g., "Add feature" instead of "Added feature").*

### 6. Mini Project: Track Changes in Project Files
Let's create a file, stage it, and commit it.

**Step-by-Step Walkthrough:**
1. Ensure you are inside your Git repository (`cd website`).
2. Create a new file: `echo "<h1>Hello World</h1>" > index.html`
3. Run `git status`. You will see `index.html` is listed in red as "Untracked files".
4. Add it to the staging area: `git add index.html`
5. Run `git status` again. `index.html` is now green ("Changes to be committed").
6. Take the snapshot: `git commit -m "Create initial index.html file"`
7. Run `git status` one last time. It will say "nothing to commit, working tree clean." You have successfully saved your history!

### 7. Seeing What Changed (`git diff`)
If you open `index.html` tomorrow, delete "Hello World", and type "Hello Universe", Git will notice.
Before you `git add` the file, you might want to double-check exactly what you changed.

bash git diff `` Git will output the exact code changes in green (additions) and red (deletions), allowing you to review your code before committing.

• Forgetting to Add: Beginners often edit a file, skip the git add command, and immediately type git commit. Git will say "no changes added to commit". You *must* move the files to the Staging Area first. (Alternatively, you can use the shortcut git commit -am "message" to add and commit tracked files simultaneously).

1. 1. What is the purpose of the Staging Area? Why doesn't git commit just save everything in the folder automatically?

13. Next Chapter Recommendation #