Branches with Brackets-Git | PracticalSeries: Brackets-Git and GitHub

6.5 Branches

To demonstrate branches, I’m going to add another page to the website project. This will be an introduction page called 01-intro.html.

This new page will be added to the project on a new branch. Currently we only have the master branch and everything we’ve done so far has been done on this master branch.

6.5.1 Adding a branch in Brackets

This is easy. Just click the small arrow to the right of the master branch in the left hand file tree and select create new branch (Figure 6.44):

Figure 6.44 - Brackets—create new branch

This opens the Create new branch dialogue box:

Figure 6.45 - Brackets—create new branch

If we had more than one branch, we could choose which branch to split from (origin branch). In our case we only have the master branch and that’s all we can choose.

Enter the name for the new branch; call it d-01-intro.

Brackets will automatically switch to the new branch (Figure 6.46).

I’ve highlighted the new branch in the file tree (highlighted in orange). Notice also, that although we are on a new branch, nothing has changed, Brackets is still reporting Nothing to commit, working directory clean.

The workflow diagram now has a branch—woohoo (These diagrams are now reminding me of the opening sequence to Dad’s Army):

Figure 6.47 - Workflow with the d-01-intro branch

6.5.2 Making a commit on a new branch

Make sure the new branch is selected (d-01-intro is showing as the active branch in the file tree).

Now add a new file (just as we did before in § 6.2). Right click the file tree select new file and rename the file 01-intro.html.

Add the following code to it.

01-intro.html

<html lang="en">                     <!-- Declare language -->
    <head>                           <!-- Start of head section -->
        <meta charset="utf-8">       <!-- Use Unicode character set  -->

<link rel="stylesheet" type="text/css" href="11-resources/01-css/style.css">

        <title>PracticalSeries: Git Lab - Introduction</title>
    </head>

    <body>
        <h1>A Practical Series Website</h1>

        <h3>Introduction</h3>

<p>This page is an introduction to the website and how to use it.</p>

    </body>
</html>

Code 6.6 d-01-intro branch—01-intro.html new file

a

This will show as untracked in the Git pane. Tick the box, click commit and enter the following commit message:

D: Incremental Build - 01-intro page
01-intro.html added.

I get commit [e14911e].

Give the commit the tag d-P01-01.01 and we’re done.

This is what I have in Brackets (commit history view):

Figure 6.48 - First commit on the new branch

And the workflow is now: