« Previous Tutorial Next Tutorial »

Hello again! Let’s talk about version control. For those of you who’ve worked with git and GitHub before, we’re probably going to cover a lot of stuff you already know. For those of you new to git or to version control in general, let’s start with the basics: what it is, and why you want to use it, even if you’re the only person working on a project.

Version control, at its simplest, is the equivalent of an application-wide undo button. It allows you to save your code in a certain state, and return to that state at any time. This means if you catastrophically break something by, for example, accidentally deleting several files, it’s possible to roll back your code to the last version you saved, and restore those files.

Obviously, this is an overly simplistic explanation that glosses over a LOT of what version control can do, but it’s enough to get started on. The reason why you should use version control even if you’re the only person developing the project is clear: because we’re all human, and humans make mistakes, and mitigating those mistakes is extremely useful and important.

So today we’re going to set up the git repository we’ll use to contain our app, which I’m calling MusicList since I’ve owned that domain for like twenty years now and want to finally put something up there. You can call it whatever you’d like.

First things first, you need to have git installed on your machine. There are GUIs for git, including GitHub’s own editor, but I find the command line is the fastest and easiest way to work, and also gives you the best understanding of what git is doing, so we’re going to focus on that.

If you’re on a Mac, open a terminal window, type


and hit enter. If stuff happens, then congratulations, you got git. If it prompts you to install git, then simply say yes and let it do its thing. I’d show you screenshots of this part, but I already went through it, and frankly I’m not sure how to remove it without removing a ton of other stuff.

If you’re on Windows, just hit git-scm.com and click the “downloads for Windows” button in the right sidebar. It’ll auto-open a download dialogue. Save the file, run the installer, and you’re good.

All right, now we’re switching to the web, where we’re going to create a GitHub repo. Head for github.com and sign up. You don’t need to spend any money, here – you can create unlimited public repositories with a basic account, and since all of the code for Five Minute React is going to be public anyway, there’s no harm in your repo being accessible as well.

Once you have an account and are logged in, click the bright green “New Repository” button in the right sidebar. This will—wait for it—take you to the new repository screen. Here you can name and describe your repo. Go ahead and click “initialize this repository with a README” while you’re at it. We’ll explain why in a minute. Let’s also click the “Add .gitignore” box and choose “Node,” which will start our repository with a file that tells git to ignore certain files that you don’t want to keep there, like for example our node_modules folder, which is a) gigantic and b) not something you want to pass around via version control for a variety of reasons, which we will cover in a later tutorial.

You can add a license if you like, but it’s not really necessary right now. As we covered in tutorial five, licenses explicitly explain appropriate and inappropriate use of your code. They can run the ground from “you’re not allowed to modify or distribute this in any way” to “hey, whatever, do what you like.” If you want to attach a license, I won’t stop you, but please note that MusicList’s code will be licensed with a basic “you can modify this or copy it, but you have to give attribution” license.

Anyway, click Create Repository, and then bask in the shining glory of your newly created git repo. You can see that there’s some text here already – this was auto-added to your README file when the repo was initialized. GitHub automatically displays any README file it encounters in a given folder, which means you can put useful information, links, and similar into the file and have it displayed to users visiting your repository.

Congratulations, you’re halfway to using version control. The other half is initializing the repo on your machine and getting comfortable with a few basic git commands. We’ll tackle that in the next tutorial. See you then!

« Previous Tutorial Next Tutorial »