Track Changes Workshop

Practice the complete workflow of staging, reviewing, and committing changes. You'll also set up a proper .gitignore file.

Setup

Use an existing repository or create a new one:

bash
1$ mkdir tracking-practice && cd tracking-practice
2$ git init
3$ echo "# Tracking Practice" > README.md
4$ git add README.md
5$ git commit -m "docs: add README"

Exercise 1: Create and Review Changes

Create a File

bash
1$ cat <<'EOF' > app.js
2function greet(name) {
3  return `Hello, ${name}!`;
4}
5
6console.log(greet('World'));
7EOF

Check Status

bash
1$ git status -sb
2## main
3?? app.js

The ?? indicates an untracked file.

Stage and Review

bash
1$ git add app.js
2
3$ git status -sb
4## main
5A  app.js
6
7$ git diff --cached
8diff --git a/app.js b/app.js
9new file mode 100644
10index 0000000..a1b2c3d
11--- /dev/null
12+++ b/app.js
13@@ -0,0 +1,5 @@
14+function greet(name) {
15+  return `Hello, ${name}!`;
16+}
17+
18+console.log(greet('World'));

Commit

bash
1$ git commit -m "feat: add greeting function"
2[main 2a3b4c5] feat: add greeting function
3 1 file changed, 5 insertions(+)
4 create mode 100644 app.js

Exercise 2: Set Up .gitignore

Create Common Ignores

bash
1$ cat <<'EOF' > .gitignore
2# Dependencies
3node_modules/
4
5# Build output
6dist/
7
8# Environment
9.env
10.env.local
11
12# Editor
13.vscode/
14.idea/
15
16# OS
17.DS_Store
18EOF

Test That It Works

Create files that should be ignored:

bash
1$ mkdir node_modules
2$ echo "fake dependency" > node_modules/test.txt
3$ echo "SECRET_KEY=abc123" > .env
4
5$ git status -sb
6## main
7?? .gitignore

Notice node_modules/ and .env don't appear—they're ignored!

Commit .gitignore

bash
1$ git add .gitignore
2$ git commit -m "chore: add gitignore"
3[main 3b4c5d6] chore: add gitignore
4 1 file changed, 15 insertions(+)
5 create mode 100644 .gitignore

Exercise 3: Selective Staging with git add -p

Make Multiple Changes

bash
1$ cat <<'EOF' > app.js
2function greet(name) {
3  return `Hello, ${name}!`;
4}
5
6function farewell(name) {
7  return `Goodbye, ${name}!`;
8}
9
10console.log(greet('World'));
11console.log(farewell('World'));
12EOF

Use Interactive Staging

bash
1$ git add -p app.js

Git will show each hunk (change) and ask what to do:

1@@ -2,6 +2,10 @@ function greet(name) {
2   return `Hello, ${name}!`;
3 }
4
5+function farewell(name) {
6+  return `Goodbye, ${name}!`;
7+}
8+
9 console.log(greet('World'));
10Stage this hunk [y,n,q,a,d,s,e,?]?

• Press y to stage this hunk
• Press n to skip it
• Press s to split into smaller hunks

For this exercise, press y to stage everything.

Commit

bash
1$ git commit -m "feat: add farewell function"
2[main 4c5d6e7] feat: add farewell function
3 1 file changed, 5 insertions(+)

Exercise 4: Inspect History

View Commit Log

bash
1$ git log --oneline
24c5d6e7 (HEAD -> main) feat: add farewell function
33b4c5d6 chore: add gitignore
42a3b4c5 feat: add greeting function
51a2b3c4 docs: add README

View with Graph

bash
1$ git log --oneline --graph --decorate
2* 4c5d6e7 (HEAD -> main) feat: add farewell function
3* 3b4c5d6 chore: add gitignore
4* 2a3b4c5 feat: add greeting function
5* 1a2b3c4 docs: add README

View Specific Commit

bash
1$ git show 2a3b4c5
2commit 2a3b4c5...
3Author: Your Name <you@example.com>
4Date:   Sun Nov 30 10:30:00 2025 +0000
5
6    feat: add greeting function
7
8diff --git a/app.js b/app.js
9new file mode 100644
10...

Exercise 5: Modify and Review

Edit the README

bash
1$ cat <<'EOF' >> README.md
2
3## About
4
5This is a practice repository for learning Git tracking.
6
7## Usage
8
9```bash
10node app.js

EOF

1
2### Review Unstaged Changes
3
4```bash
5$ git diff
6diff --git a/README.md b/README.md
7index 1234567..abcdefg 100644
8--- a/README.md
9+++ b/README.md
10@@ -1 +1,11 @@
11 # Tracking Practice
12+
13+## About
14+
15+This is a practice repository for learning Git tracking.
16+
17+## Usage
18+
19+```bash
20+node app.js
21+```

Stage and Review Staged

bash
1$ git add README.md
2$ git diff --cached

Commit

bash
1$ git commit -m "docs: add about and usage sections"
2[main 5d6e7f8] docs: add about and usage sections
3 1 file changed, 10 insertions(+)

Final Check

Review your complete history:

bash
1$ git log --oneline
25d6e7f8 (HEAD -> main) docs: add about and usage sections
34c5d6e7 feat: add farewell function
43b4c5d6 chore: add gitignore
52a3b4c5 feat: add greeting function
61a2b3c4 docs: add README

Verify ignored files:

bash
1$ git status --ignored --short
2!! .env
3!! node_modules/

Checklist

• Created and committed multiple files
• .gitignore is working (ignoring node_modules/ and .env)
• Used git add -p for selective staging
• Reviewed changes with git diff and git diff --cached
• History shows clean, descriptive commits

Cleanup

bash
1$ cd ..
2$ rm -rf tracking-practice

Key Takeaway

You've practiced the core Git workflow: status → add → diff → commit → log. This cycle repeats throughout your development work. Make it second nature.