You've probably heard the name GitHub tossed around in various corners of the internet. With the rise in access to free programming resources across the web, you likely know what GitHub is and may have an account. But beyond the base service that GitHub offers is an array of functionality that can improve your experience on the site and the experience of others that come to your repository. If you want to improve your experience while coding, check out these Chromebooks.

What is GitHub?

At the most basic level, GitHub is an online service for managing different versions of files using an open source program called Git (developed by the creator of the Linux kernel, Linus Torvalds). Git is a software development tool that was created so that numerous programmers could work on different parts of the same project while allowing their changes to be tracked and compartmentalized until they could be properly vetted.

Due to it being a repository for source code, GitHub has also morphed into a social media network for programmers. You can follow other users or their open source projects to keep abreast of any updates or changes they make, and you can customize your landing pages to be more appealing to visitors who find their way to your projects.

Use GitHub as a web host

If you're a programmer or a creative professional, it's becoming more important to have an online portfolio of your work that's easy to access and share. Traditionally, that meant having a personalized website which could cost up to $100 per year between hosting and domain fees, but GitHub Pages lets you do it for free.

How to make a website for your GitHub account

GitHub has a simple guide to get your page set up if you want to get into the details, but if you've worked with HTML and GitHub before, it's a simple process.

  1. Create a new repository and give it username.github.io as a name. For example, if your username is AndroidPolice, name your new repo AndroidPolice.github.io.
  2. Upload your new web page with the name index.html.

It really is that easy. The name you gave to the GitHub repository (in our example AndroidPolice.github.io) is now the URL for your new website. You can only have one web page per user account. On the other hand, you can have one site per repo and unlimited repos.

How to make a website for your GitHub repo

The process for making a page for your repo is a bit different from making one for your account.

  1. Navigate to the Settings menu of your repo toward the upper-right corner.
    GitHub repo main page with the Settings option highlighted
  2. Select Pages from the sidebar menu on the left.
    GitHub Settings menu with the Pages link highlighted
  3. From the drop-down menu under Branch, select main.
    GitHub Pages menu
  4. Click Save.

By default, web pages for your repos display an index.html file if you have one. If not, it falls back to README.md. The URL for your repo page will be username.github.io/repo-name.

Even though GitHub was made for programmers first, there are no restrictions on what types of files you can upload, so don't hold yourself back from making a repository just because you're not a coder.

Use GitHub to make a wiki

This one is really easy, but it's not something that's often talked about. You can have one wiki for every repo you create. It's a place to lay out the documentation for your project, but in reality, you can use it for anything you want.

  1. From the primary page of your repo, select Wiki from the ribbon menu under your repo name or use the keyboard shortcut g w.
    GitHub repo main page highlighting the Wiki link
  2. Click Create the first page.
    GitHub Wiki Create first page screen
  3. Once you're happy with your page, select Save page in the lower-right corner of the window.
    GitHub Wiki edit page screen highlighting the Save page button

Learn markdown to make your repo stand out

For many people, GitHub is a means to find new projects they can use or contribute to. To that end, they don't spend time looking at websites or wikis. Rather, they're looking at your public repository, which means your README.md file is the first thing they see. If you want people to engage with your projects, you must make it easy for them to understand them, which means you'll need to make it look nice with a little bit of formatting.

Use the <kbd> tag

If your project has keyboard shortcuts, documentation is the best way to let your users know. The <kbd> tag removes any ambiguity that you're talking about pressing a key and didn't just make a typo. To use it, just put the shortcut key between <kbd> and </kbd>.

GitHub <kbd> tag

Use <details> to create collapsible content

The <details> tag is the perfect tool for when you have information you want to be seen, but it's not so important that it clutters up your repo page. If you're familiar with how <details> works in HTML, you'll be happy to know it works the same way here.

Organize your information with tables

Sometimes when you have a lot of information, the best way to share it is with a table. However, unlike the <kbd> and <details> tags, which were borrowed from HTML, tables in GitHub markdown must be formatted in a particular way. You could go through the GitHub documentation learning the intricacies of making tables in markdown, or you could use this awesome open source tool for creating and converting tables, table-magic.

If you use GitHub as a repository for your programming projects, you'll likely want to link directly to the source code at some point in your project. That's all good, but files can often be hundreds if not thousands of lines long, making it a chore to scroll through it until a particular line can be found. Thankfully, with GitHub, you can link directly to a line or lines of a file.

  1. Select a file from your repo.
    GitHub repo Code screen highlighting the files
  2. When you've found the code to which you'd like to link, click on the line number on the left.
  3. Click the ... icon that appears to the left of the line number.
    GitHub fileview highlighting the ... icon
  4. Select Copy permalink from the pop-up menu.
    GitHub fileview 3-dot menu highlighting the Copy permalink option

You can create a link to a range of lines by clicking on the first line in your range, then holding down Shift and selecting the last line.

GitHub fileview with multiple lines selected

Using a direct link to a line of code can be useful for a real-world example of code on your JavaScript tutorial on Medium and to give more context to your pull requests. Be aware that links generated this way link to the same line even if you update your source code.

Become a pro at using the command line interface

If you delve deep enough into the programming rabbit hole, you'll eventually engage with the most rudimentary interface available, the command line interface, or CLI. The days of DOS supremacy are long gone, but power users know that the CLI still has a lot to offer, especially if you use Git.

Save time with aliases

You can create a shortened version of the Git commands you often use to save time on the keyboard. For instance, you could change the commit command to ct by typing git config --global alias.ct commit. This same formula applies to any command you like.

Use flags to improve blame

Git blame is a command used to see who is responsible for which changes in a file. Although, not all changes carry as much weight as others. You can add flags to blame to ignore certain changes.

  • git blame -w ignores white space changes.
  • git blame -M ignores when text is moved.
  • git blame -C ignores when text is moved into another file.

Go forth and code

Wrapping your head around everything GitHub has to offer is no small task, but you can incorporate some of these GitHub tips into your workflow. And, if you have no idea what we're talking about, check out our introduction to Github.com.