🥽Virtual Lab: Git Flow

Virtual Lab: Git Flow

This virtual lab lets you run the four most common Git commands and watch what they actually do. There is one file, hello.txt, and you move it through four stages:

• Working Directory — where you edit files on your computer.
• Staging Area — a holding area for changes you’ve marked as ready to commit.
• Local Repo — your personal commit history (HEAD points to the newest commit).
• Remote Repo — the shared copy on a server, e.g. GitHub.

What the commands do:

• Edit hello.txt in the text area. The file card turns modified.
• git add copies the working-directory version of the file into the staging area.
• git commit type a message, then click this command. The staged version is recorded as a new commit on the local repo.
• git push uploads local commits to the remote.
• git pull downloads remote commits to the local repo. There is a simulated remote developer to make this realistic.

Try this sequence: (1) Edit hello.txt with some text. (2) git add → git commit (with a message) → git push. (3) Click 👥 Teammate pushes to simulate someone else committing to the remote. (4) Use git pull to bring their changes down to your local repo, and (5) Edit the file again, commit, and try git push before pulling and you’ll see the real “Push rejected — pull first” error. Run git pull, then push again.

Git Workflow Lab

Click commands to move hello.txt through the four stages and watch how add, commit, push and pull actually behave.

derekmolloy.ie

Local Repository

Remote

Working Directory

edit files here

hello.txt

clean

Hello, world!

Edit fileHello, world!

Staging Area

the index

Nothing staged.
Edit the file, then run git add.

Local Repo

HEAD → main

HEAD

49536c2

Initial commit

“Hello, world!”

Remote Repo

origin/main

HEAD

49536c2

Initial commit

“Hello, world!”

Commands

git add

git commit

git pushgit pull

👥 Teammate pushes↻ Reset

local =remote =

What happenedlast 1 entry

Repo initialised. Working directory, staging area and local repo all match the remote.

Try this sequence: edit → git add → git commit → git push. Then click 👥 Teammate pushes and try git pull.

Some notes on the operation of this component:

• This is a simulation, so it is not perfect, as there are a lot of combinations!
• Buttons grey out when there’s nothing to do (e.g., git add when nothing has changed). Hover for the reason.
• The What happened panel narrates every command in plain English. Read it after each click.
• The dots near the bottom show whether your local or remote is ahead.
• Click ↻ Reset to start over.

Knowledge Check

Concept Match

Match the Four Stages of Git

derekmolloy.ie

Drag each definition into its matching concept slot, then click Submit. Tap × to return a placed card to the pool.

Working Directory

drag a definition here…

Staging Area

drag a definition here…

Local Repo

drag a definition here…

Remote Repo

drag a definition here…

Definition Pool

A 'holding area' where you pick and choose which changes to include in the next commit.

The shared copy of the project hosted on a server like GitLab or GitHub.

Your personal database of project history, containing all your local commits.

The local folder on your computer where you directly edit your files.

Submit

Knowledge Check

Which command moves changes from the Working Directory into the Staging Area?

derekmolloy.ie

Knowledge Check

What is the result of running 'git commit'?

derekmolloy.ie

Knowledge Check

When would you see a 'Push rejected — pull first' error?

derekmolloy.ie

Knowledge Check

Which command downloads new work from a teammate on the Remote Repo into your Local Repo?

derekmolloy.ie