Stage & Commit Files

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.

1. 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).

2. Open the Source Control panel on the left of the window.

3. 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 = deleted

   NOTE: 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:

1. 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”.

2. 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).