Explore how to track changes with Git, understanding the workflow of staging and committing files, checking the status of your files, and the process of committing files with clear, step-by-step instructions.
This exercise is excerpted from Noble Desktop’s Git & GitHub training materials and is compatible with updates through 2022. To continue learning web development with hands-on training, check out our coding bootcamps in NYC and live online.
Note: These materials are provided to give prospective students a sense of how we structure our class exercises and supplementary materials. During the course, you will get access to the accompanying class files, live instructor demonstrations, and hands-on instruction.
Tracking Changes with Git (The Git Workflow)
Git keeps a list of changes (files added, deleted, or modified). So how do we tell Git to record our changes? Each recorded change is called a commit.
Here’s an illustration of the Git workflow:
Before we make a commit, we must tell Git what files we want to commit (new untracked files, modified files, or deleted files). This is called staging (we add files to the stage). Why must we do this? Why can’t we just commit something directly? Let’s say you’re working on two files, but only one of them is ready to commit. You don’t want to be forced to commit both files, just the one that’s ready. We add files to a staging area, and then we commit what has been staged. Even the deletion of a file must be tracked in Git’s history, so deleted files must also be staged and then committed.
Check the Status of Your Files
Let’s first check the status of files in our Git repo.
-
Open a project folder in Visual Studio Code.
You can do this by going to File > Open (Mac) or File > Open Folder (Windows), navigate to your folder, select it, and hit Open (Mac) or Select Folder (Windows).
- Open the Source Control panel
on the left of the window. -
In the Source Control panel
, if any work has been done, under Changes you’ll see files listed with their status:M = modified
U = untracked
D = deletedNOTE: Within a file, a colored bar on left (by the line numbers) indicates that line has changed.
Stage Files to Prepare for Commit
In the Source Control panel :
To stage all files, hover over Changes and click the plus (+) that appears to its right.
To stage individual files, hover over the file name and click the plus (+) that appears to its right.
To unstage a file (if you accidentally staged it), hover over it and click the minus (–) that appears to its right.
Commit Files
After you’ve staged files and are ready to commit:
-
At the top of the Source Control panel
type in a commit message.Commit messages should NOT be written in the past tense, such as “I made headings blue”. Use language like “Make headings blue”, as if you are giving orders to the codebase. The reason for this is when you work with other people, your code may not be automatically approved. You’ll request that they pull your changes into the codebase. When they read the commit messages they will do know what your code will do. Your change will “Make headings blue”.
-
Do one of the following:
- At the top of the Source Control panel click the Commit button
. - Or hold Cmd (Mac) or Ctrl (Windows) and hit Return (Mac) or Enter (Windows).
- At the top of the Source Control panel