Join James Williamson for an in-depth discussion in this video What is GitHub?, part of GitHub for Web Designers.
Chances are, by now you've seen GitHub or at least visited it in some capacity or another. In fact, if you don't use GitHub, you might even feel like the only web designer left out there that doesn't. Still, if you've never really worked with it, you might not have a great idea of exactly what it is. You know, some people have referred to GitHub as a publishing tool. While others might refer to it as a version control system and still other people might describe it as a collaboration platform. Well, actually GitHub is all of those things in one form or another.
At its very core, GitHub is a web-based hosting platform for Git repositories. Git is a popular version control system that's widely used among programmers and developers for developing and maintaining code. A GitHub is built on top of Git, and it allows you to have both local and remote copies of your projects. So in that sense, it's very much a cloud based Git service. Now I know that, that sounds really boring but it's also a lot more than that though. So let's take a brief tour of GitHub and check out some of its important features.
So here we are at GitHub, and this is exactly what the website looks like if you visit it without first signing in. If you don't have an account already, one of the first things they want you to do is get an account. So they really want you to sign up. If you scroll down a little bit, they give you some reasons about why you'll love GitHub, some of the features that it has and, it talks a little bit about the desktop application as well that we'll be using a little bit later on. Now, if you go up to the very top of this, they've got a little sub menu up here. The first one is Features. And if you click on that, it'll go through in a little bit more detail. Some of the features that are just awesome about GitHub.
Now, some of these are more geared towards developers than designers, and some of them you'll read and go have no idea what they are talking about if you are not a developer or a programmer. However, some of these features are really, really cool and can help you out in your work flow. Now if you want to see what other people are doing on GitHub you can click explore. When you click explorer the very first thing that it shows you all these showcases. So things like text editors that people have put together, CSS pre processors is typically on here although I don't see it now. So this rotates. Oh there it is. See it says pre processors. They keep moving things around on me.
So these are showcases of different types of applications or projects that you can go check out. If you scroll down a little bit more, you have the trending repositories and repositories is just another name in this case for a project. So it's the page for that particular project. In this case, popcorn, guardian's scribe framework, and we also have the repositories that have been starred by the GitHub staff. So these are the ones that they think are really, really cool. Now, using this you can discover a lot of amazing projects. But if there's already a project that you want to check out, and you know what that project is, you can just search for it.
If you've watched any of my titles, you know that I'm a huge fan of Modernizr. So if I type in Modernizr, and search for that, I get a list of all of the different repos that have something to do with it. Maybe they've been forked, that sort of thing, but this is the main one. So if I click on Modernizr, it will take me directly to that project's repo or repository page. So here, we get to see GitHub in all its glory. And this is an interface that can look a little bit intimidating the first time you see it if you're thinking, I want to join this, but, I don't understand how all this stuff works.
So, let's just go over the big picture of what you're looking at here, and, how this all works together. Well, at the very top, we've got two little buttons, up here, that say, Star and Fork. Now, if I was signed in, there'd be another one up here, that called Watch. And, Watch would allow me, when I'm signed in, to watch this repository and, when changes are made, it'll update me, and say, hey, they've changed this. And, that way, I can track a project, and see what kind of changes have been made on it. Star means I love this thing. You can see, modernizr is well loved, it has almost 12 thousand stars, and fork mean, I want to make a copy of this and I want to start working on it myself.
So, if you have an account and you wanted to take modernizr and maybe add some functionality to it or create a different version of it based on what they're doing, you could fork this and just start working on it yourself, totally independent of this, which is really, really cool. If I scroll down a little bit, there's a readme file involved in this project that tells you a little bit more about it. It's almost like documentation but it's sort of a big overview of what modernizr is and kind of how it works. There's also on the side here a Wiki. So you can create wikis for your projects so they have like frequently asked questions, and maybe a little bit more documentation, that sort of thing.
And then right up top here, we have the code. Now this is where all the files for this project live in this particular repository. So if I scroll down a little bit, you can see all the elements that make up modernizr, and all the elements you would copy locally if you were to fork this for example. And what's really neat is even if you don't have a GitHub account, And you want to take this and do something with it, or even use it. Notice that you have this Download ZIP link right here that allows you to download all of the files inside this repository locally, which is really neat.
We also have Issues. So if you click on Issues, a project like modernizr is a big project with a lot of collaborators. So in order to keep track of what everybody's doing, or, just if you have a bug that you want them to research, you can open up an issue. And they'll look at that issue, determine what action needs to be taken on it, who it needs to be assigned to, and then they'll close at once the issue has been taken care of. You can also set milestones for your projects, and have your collaborators pass milestones based upon the issues that they clear, so there's a lot of collaboration tools available directly here in GitHub as well.
So there are three things that GitHub is really really good for. One is versioning projects and having version control, and that means of course that your work as you go through your project are going to be sort of saved in these snapshots, so that you can revert back to them or look back through the history of the project if you need to. So it's good for keeping your code clean and well maintained. The other thing that it's great for is publishing projects, just like this. Modernizr is published to GitHub, I as a user can download it and do what I want to do with it, install it, work with it, even customize it myself if I want to.
So it's really good for publishing projects that you want to make available open source or to the public. And it's really good for collaborating with teams. If you have a project page like this and you have developers or designers that are working on it with you. Even if they're not local let's say they're all over the world, they can use this as sort of a hub, if you will, to work with and contribute to your project. So, that, of course, is a really powerful feature. All right, so now that we know a little bit more about what GitHub can do, let's set up an account and install it.
- Creating an account
- Installing GitHub
- Git basics
- Adding files to Git
- Checking differences
- Creating, switching, and updating branches
- Creating a new GitHub repository
- Managing files with the GitHub client
- Working with collaborators
Skill Level Intermediate
Q: Why can't I create a .nojekyll file?
A: Depending upon your operating system and platform, you may have certain restrictions which make it impossible to create a .nojekyll file through Finder or Windows Explorer. Usually you’ll receive an error message that informs you that files starting with a “.” are system files and that you lack the permissions necessary to create one. If that’s the case, you’ll need to create the file through a Terminal window or bash prompt. Here’s how you do it:
1. Open a Terminal window if you’re on a Mac, or the bash prompt from the Github client if you’re on Windows.2. Navigate to the repository’s root directory.3. Type the following at the prompt: $ touch .nojekyll4. That’s it! The next time you make a commit and push to the master branch you should see your new .nojekyll file.