You must own this product to watch this lesson.
You must own this product to watch this lesson.
Setting Up Git
00:00 Welcome back. What we’re going to do now is we’re going to install Git. Git is a really popular open-source version control system and it’s kind of the gold standard now for version control.
00:11 It’s a really good skill to have and a really good tool to know how to work with. What I want to show you in this lesson is how to, first of all, install Git and get that set up and then to integrate that into your workflow so that it works well with Sublime Text.
00:30 And I’m going to show you the really lightweight Git integration with Sublime Text that I use in my personal setup and I’ve kind of fine tuned over the years and that I’m very happy with.
00:38 If you’re not using Git at all and you don’t have a real need for integrating it into your workflow, then you might want to skip this chapter or skip this lesson.
00:46 But if you’re interested in setting this up—and I highly recommend that you familiarize yourself with Git—then let’s go ahead and actually set that up. The first thing we need to do here is to install the latest version of Git.
00:59
The great news here is that we can just install Git through Homebrew. We want to go brew install and then go brew install git and hit Return. And that’s going to install Git for us and we don’t have to do anything else.
01:13 This is just going to run through the installation real quick. Okay, so this completed. Now we can just confirm that Git was actually installed correctly.
01:20
I ran git and I got a bunch of outputs, so that means the git command works. Now before we move on, we need to configure some basic settings in Git so that you can start committing files and working with Git repositories.
01:33
What we need to do here is we need to use the git config command to set a couple of global settings. The first one is user.email, so you want to go git config --global user.email and then plunk in your email address—for example, the one that you use on your GitHub profile. So in my case, I’m just going to go with a fake one for now.
01:56
And then also you want to set your name. That kind of follows the same pattern. We’re going to go user.name.
02:04
And of course you want to replace that with your real name. All right! So, now we’ve made those config changes and we can actually make sure this was set correctly, again with a git config command.
02:15
We’re just going to go git config --global --list. This should show you the same information that we just configured. All right, so once you get that result, then we can move on and install the first plugin that starts integrating Git with Sublime Text. So again, you want to go back to Sublime Text and then open the Command Palette, find the Install Package command. And once it opens up, you want to search for the GitGutter plugin. Hit Return to install that. My approach to integrating Git with your Sublime Text setup won’t really turn Sublime Text into a full-featured Git client.
02:56 It’s a more low-key approach because, personally, I really like to use the Git command line tools as much as possible because they’re really effective. But at the same time, there’s a lot of valuable information stored in a Git repository that I would like to see as I’m working with my files. For example, I want to see, like, “Hey, what happened to this line? Like, did I modify that? Or did I leave that alone?
03:16 Or did I delete a bunch of code here?” And now GitGutter, which we just installed, is actually the perfect tool for this philosophy because it does exactly that, right?
03:26
It helps us figure out if we’re accidentally going to commit an unwanted change like a debug print or, you know, a pdb import or something like that that we don’t actually want in our code.
03:37
And so what it does is it runs a git diff and then shows us the lines that were changed compared to the latest version in Git. Before I can give you a demo of GitGutter, we’re going to just download a bunch of code from a real Git repository.
03:52 All right, we’re just going to clone an existing Git repository so that we have something to look at and play with. If you don’t have a Git repository in mind that you want to use for that, you’re free to use your own code obviously. Or you can just go ahead and clone one of my open-source repositories, and you’re going to find that at github.com/dbader/schedule.
04:14
We’re just going to clone that real quick. Then we’re going to go back to Sublime Text and open that schedule/ folder that we just cloned. You can just select the whole folder and it’s going to pop up this sidebar here,
04:29 and this will list all of the files here in this folder, so this can be really handy with working with a whole folder structure. Okay, and we’re just going to open some Python code here. All right, so we’ve got everything set up. Now the last step we need to take is we need to go to Preferences > Package Settings > GitGutter and then you want to go to Settings - User.
04:52
And now, in this case, we need to tell GitGutter where our git binary lives. And again, we can find that out by doing a which git and then just copy this path.
05:03
And again, if you installed that through Homebrew, it will be the exact same path under /usr/local/bin/. Let’s go back to the settings here and we’re just going to add this new
05:14
setting here that’s called "git_binary",
05:19 and we’re just pointing that to the right path. All right, and then you want to hit Command + S to save that. And actually, now we can close that again. And of course, we need to restart Sublime Text for that to kick in, but now everything should be ready and all prepped for us. All right, so you probably haven’t noticed a difference yet, but let’s actually go ahead and make some modifications here.
05:39
I’m just going to delete a bunch of lines here, add a couple of lines. Let’s just say # hello world and then, what else could we do? Add one more and make a modification here.
05:51 What you can see now is that we get these little symbols pop up on the left here, and these are actually Git diff symbols. So it tells us that, “Hey! We modified this line here,” with this little square, or “We added these two new lines here and we deleted a bunch of lines up here.
06:07 And also down here, we added a couple of newlines.” So, this is really helpful for seeing at a glance how we modified the file. And this also shows up here in the minimap on the side.
06:18 It’s probably kind of hard to see in the video but you can see here that it’s coloring those lines as well. Another really cool feature here is that we can just hover over these icons and we get this little popup that shows us what was actually deleted here.
06:32 I could also go in and click the undo button, and that would restore just this change. And then again, I could of course use the undo functionality to undo that again and remove it again. Or it’s the same thing down here with the modified line.
06:45 I could just compare that. You know, I can see here what was changed and then I could just roll that change back if I wanted to, and with Command + Z, I could just apply it again.
06:54
So this is a really cool feature because it keeps you more aware of how you’re modifying your code compared to the latest version in Git. The next feature I want to show you how to set up is how you can write your Git commit messages with Sublime Text. And like I said, I’m a big fan of using the Git command line tools to interact with Git. One of the things that caused me some grief was that every time I wanted to make a new commit with the git commit command, it would actually pop me into Vim or it would pop me into some other command line based or terminal based editor.
07:26 And I just wanted to use Sublime Text because that’s my editor of choice and that’s what I’m the most comfortable with. So I want to show you how you can integrate this Git commit functionality with your Sublime Text editor. And before we dive into that, I just want to create a quick test repository for us so that we have something to play with. Let’s create that repository and we’re just going to create a little file here as well. Of course, you could also do that with an editor directly but it’s just easier to do that.
07:59 So, what I did here is I created a new file in this folder and now I’m going to add this file to the Git staging area.
08:10
And what you can see now is that when we do a git status, it actually picked up this new file, and now I’m going to trigger a new Git commit. And what this is going to do, this is going to bounce me to VI, which is not really my preferred editing environment. So let’s change that so it actually takes us to Sublime Text instead.
08:30
To quit VI you want to hit Escape, hit the colon key (:) and then type q and hit Return. All right. See how much nicer Sublime Text is? No, just kidding.
08:41 Of course, I love everyone who’s using VI. It’s a great editor and I’ve had some really amazing coworkers who had really, really impressive VI setups. I don’t really believe in the editor wars, but yeah, that’s just a side note. Okay!
08:55
Let’s swap out VI for Sublime Text, and the way we’re going to do that is with another git config command. We’re going to change that global setting and this time it’s called core.editor.
09:04
And now, this is a little bit hairy to get right, so you want to make sure you’ve got your quotes correctly. What you want there is you want this whole thing in double quotes (") and then you want to add an extra single quote (') here and then start typing out the path where we installed Sublime Text earlier. So in our case, this is going to be sitting at /Applications/Sublime Text.app/, and then inside Sublime Text.app/, there’s a folder called Contents/ and then under that there’s one called SharedSupport/, and then there’s a bin/ folder, and then the command is called subl.
09:43
And so you want to wrap this whole thing in double quotes and then this path here in single quotes, right? Because we have spaces here inside this path, so otherwise it’s not going to work. And then you want to put a space character after that and put --wait --new-window, and then close the whole thing with these double quotes.
10:06 This is a little bit tricky to get right, but once you’ve picked the right path and kind of made sure you’re following this structure, then it’s going to work. All right, so we made that setting.
10:17 Let’s just make sure it actually works here. I’m going to trigger another commit and what this does now, this bounces me—instead of sending me to VI, this actually bounces me over to Sublime Text, and I can now go and edit my commit message here, which is kind of nice because now I can do all of my editing with my favorite editor, and I remember all the keyboard shortcuts, and this is really sweet.
10:40 Now one downside to this is that it doesn’t look that great, right? We’re not getting any syntax highlighting. It’s kind of, sort of, not that amazing. So let’s make that look a little bit better.
10:50 What we’re going to do again, is open the Command Palette, find the Install Package command, and then install the Git Commit Message Syntax plugin.
11:01 You can find that here, Syntax Highlighting for Sublime Text / Text Mate, and just install that. And now we’re just going to cancel this commit.
11:09
If you don’t save that commit message, it’s going to cancel the commit and it’s going to bounce you back to the command line. It says here Aborting commit due to empty commit message. All right, so let’s trigger another commit.
11:25 And this time we’re actually getting the syntax highlighting here, which is just a lot nicer. And then we can type out our commit message. There’s one more change I want to make here to just make it a little bit easier to write proper and well-formatted Git commit messages.
11:40 And one way to do that is by adding a bunch of rulers here on the side that will tell us how much space we have available, because there’s a best practice for writing Git commit messages that says limit your first line to 50 characters or less and then the remaining lines should be below 72 characters.
11:57 And this is kind of hard to measure or guesstimate because you pretty much have to highlight the line and then see how many characters you’ve selected or look down there and then you’ll see, “Okay, we’re at column 35, so I have a couple more characters here.” We’re going to fix this now. You want to keep that commit message open—this is really important—and then you want to go to Preferences and then go to your syntax specific settings here.
12:23 This is going to open a settings file that will be specific to commit messages, which means we’re not going to clutter up your other files by changing this setting.
12:34
What you want to do here is you want to add this new "rulers" setting, and this is a list of the column numbers where we want to place these rulers.
12:42
I’m going to go with 50 and 72 characters here. I’m going to save that. We can close this window again. And now when we’re back in the Git commit message, you can already see that now we know exactly how much space we have here for the first line, and then the lines after that, they can go a little bit longer.
13:00 And it’s just these little visual tweaks that make your life a lot easier when you’re working with commit messages. Clean that up a bit and trigger that commit.
13:09
What you need to do that is to just hit Command + S to save the message and then close the window, and you’re getting bounced back to the command line and it will actually say, “Hey, I created your commit!” And then when you do a git log, that commit will also show up here with your right author information and your commit message. Now, there’s one more thing I want to point you to, and that is a tutorial where you can learn more about these Git commit best practices.
13:35 And the one that I would recommend lives at chris.beams.io/posts/git-commit/. Chris wrote a really nice, comprehensive tutorial on all these best practices—you know, how your Git commit messages should be formatted and how you should structure them.
13:54 I found that that was a really good read and just a quick way to get up to speed with these best practices, so I highly recommend that at chris.beams.io.
14:03 I really like to use command line tools in my development workflow and I want to show you a couple of ways you can interact with Sublime Text from the command line and how you can use Sublime Text directly from the command line.
14:14
And actually, this subl command that we used previously to integrate Sublime Text with Git—there’s a way to make that available in the whole system.
14:26
When you try that out right now and go subl, it’s not going to do anything, right? So, this should trigger Sublime Text and open up a Sublime Text window, but it’s just going to tell you command not found.
14:36 What we need to do here is we need to take that command from the application bundle for Sublime Text and link it up with a location that we can actually access in our account.
14:47
So what we need to do here is we’re going to create a link from that subl command inside the /Applications/ folder to the /usr/local/bin/ folder that is on our path so we can use it here from the command line. So let’s do that now.
15:03
You’re just going to do ln -s and then again we need to type out that path. And actually, the shell autocompletion is going to work here, so it should be a little bit quicker to do that.
15:16
You’ve just got to make sure it doesn’t add extra quotes here. You want Contents/ again, SharedSupport/. This might actually work with the extra quotes, I’m not sure.
15:27
I just want to make sure we’ve got the right path here. All right, so you want this guy here, subl. You want this one, right? "/Applications/Sublime Text.app/Contents/SharedSupport/bin/subl".
15:38
And then we’re going to link that to /usr/local/bin/subl.
15:45
All right! Now when we go subl, this is going to bounce us into Sublime Text. It’s going to open a new window for us. Now, there are a couple of really useful things you can do with this command, because it’s not only there for opening a blank new window. I mean, of course you can do that, but it can do a bunch of interesting things too.
16:04
For example, I can use the subl command to directly open a file that already exists. That’s going to open this file directly in Sublime Text, which is nice.
16:15
Or I could also create a new file with this. I could go new-file.py, and then that’s going to send me to Sublime Text as well. And it’s already setting the right syntax highlighting and I can start typing out my Python file right away.
16:27
And then when I hit Command + S it’s going to save that file and it’s going to actually create that new file with the contents we had in there. Another useful thing you can do with the subl command is you can actually open a whole folder with it. So I can go subl schedule, and that’s a folder from a repository we cloned earlier, and that’s going to bounce me back into Sublime Text again and it’s going to load up that folder for me so I can start browsing the folder.
16:54 This is really nice because it populates the sidebar directly, so this is really a really useful way to work with Sublime Text. You can also use the open folder functionality from within that directory.
17:06
Imagine I’m inside this test-repo/ folder here, and you can just go subl and then use subl . , hit Return, and it’s going to open the current folder again in Sublime Text.
17:20 So, this is really handy—just a couple of shortcuts to interact with Sublime Text directly from the command line. So, a quick recap of what we did in this lesson. We set up Git on your macOS install and then started integrating that with Sublime Text.
17:33 So now you have your Git diff integrated into Sublime Text and can exactly see what lines of code you change and you can roll them back and roll them forward.
17:41 And now you can also create Git commit messages with Sublime Text. You can edit them in your favorite editor and we made a couple of tweaks so that you have really nice syntax highlighting and it made it a little bit easier for you to follow the best practices for Git commit messages in terms of formatting.
17:56
And the last thing I showed you was how you can use Sublime Text from the command line using the subl command line command.
Lee Crampton on March 5, 2020
Thanks to the sublime forums, this link resolves matters: gitgutter : correcting the missing icons https://jisaacks.github.io/GitGutter/troubleshooting/#gitgutter-doesnt-add-gutter-icons-any-more
In essence, in settings: “mini_diff”: false,
There are caveats regarding conflicts (to do with this setting) if you want to use other packages but it’s all detailed in the linked page.
amirrastkhadiv on Jan. 2, 2021
Hi Dan, How to fix git commit? I have a problem when committing a file in macOS terminal. The Sublime Text window does not open up.
$ git config --global core.editor "'/Applications/Sublime Text.app/Contents/SharedSupport/bin/subl' --wait --new-window"
$ git commit
hint: Waiting for your editor to close the file... error: cannot run path: No such file or directory
error: unable to start editor 'path'
Please supply the message using either -m or -F option.
Bartosz Zaczyński RP Team on Jan. 4, 2021
@amirrastkhadiv Is the Sublime Text editor accessible via the provided path in the command line? While it talks about VSCode, maybe this Stack Overflow answer will steer you in the right direction?
amirrastkhadiv on Jan. 5, 2021
Bartosz, thank you for your reply. When I type Sublime Text in the terminal it exutes the Sublime Text editor. FYI, following is the version:
$ Sublime Text --version
Sublime Text Build 3211
I went through the above comment but the problem has not been sorted out yet. If you’d show me another way to sort out that issue, I’d be grateful.
Bartosz Zaczyński RP Team on Jan. 7, 2021
@amirrastkhadiv We don’t do technical support here, but you’re more than welcome to ask for help on the community Slack. By the way, I’d encourage you to include more details about your problem. It might not be easy to diagnose it without knowing them.
Kurt Klein on Feb. 16, 2022
I typically only use the editor for squashing commits and when rebasing. I use git commit -m for all other commit messages. But I’m almost done reading the site Dan mentioned in this video, cbea.ms/git-commit/, and now I understand. I don’t know if I’ve ever seen a body in a commit message, so learning this was pretty cool!
You must own this product to join the conversation.
Lee Crampton on March 4, 2020
Sublime Text 3.2.2 (3221) with GitGutter doesn’t appear to be a happy match. My iMac is running Catalina 10.15.3 and my git binary path differs from the video but is nevertheless correct as:
“git_binary”: “/usr/bin/git”,
I had installed the GitSavvy package but removed it just to make sure there were no clashes but still no joy.
The project I created to test is a clone of one of my development repos and is now local on my Mac. GitKraken opens the local repo just fine so I am somewhat lost as to why the package appears to be asleep.
The only other thing I can think of is that I made the custom look and feel and productivity tweaks before the git gutter package install but that shouldn’t really make any difference (or should it?).
Hmmm…