Version control is a must for any professional web developer, frontend or backend. I had the privelege of speaking this year at WordCamp KC on the topic of Version Control Using Git.

There are many ways to setup Git, but in my talk, the aim was to cover the simplest approach possible so folks could get set up quickly.

This tutorial-style post is meant to provide more detail on how to start using Git on your local environment.

The slides used for this presentation can be seen at: http://www.slideshare.net/fjarrett/wordcamp-kc-2014-version-control-using-git

Basic Tools To Get Started

This article assumes you are using a POSIX-compatible operating system, like Mac OS X or Linux.

If you are a Mac user, this is all you will need to download and install.

  1. OS X Mavericks – Found in the Mac App Store
  2. XcodeGit is included! Also found in the Mac App Store
  3. iTerm2 – A free and feature-rich alternative to the default Terminal on OS X

Basic CLI Commands

Using your terminal might seem intimidating, but don’t let the fear of leaving your mouse behind deter you from giving it a try!

You can become a terminal power user today simply by memorizing a half-dozen commands:

  1. Change directories: cd wp-content/themes
  2. Shortcut to your home directory: cd ~
  3. Go up one directory: cd ..
  4. List: ls or ls -la
  5. Create a file: touch filename.txt
  6. Edit a file: nano filename.txt
  7. Clean up our terminal view: clear

Basic Git Commands

Git is extremely powerful. There are a multitude of commands and options within commands that can take you a while to learn.

But that doesn’t mean you can’t start using Git today!

All you really need to know are a few commands and you can start making Git commits to a remote repository and enjoying the power of version control on all of your projects.

  1. Copy a repo from GitHub.com to your computer: git clone [email protected]_url_dot_git
  2. See your changed files: git status
  3. Queue up files: git add -A
  4. Make a commit: git commit -m ‘Fixed a broken footer link’
  5. Push our commits to GitHub.com: git push
  6. Pull down the latest from GitHub.com: git pull
  7. Switch branches: git checkout branchname

Customizing Your Bash Profile

There is a hidden file on your Mac inside your user “home” directory named .bash_profile.

Before Terminal loads your shell environment, the .bash_profile is loaded (or “sourced”). Inside this file, you can have custom preferences for the way you want your command line interface to look and operate – like changing your terminal prompt, the colors of your text, adding aliases (shortcuts) to commands and functions you use most often, and more.

Here’s a quick tutorial on how to customize this file:

  1. Navigate to your home directory: cd ~
  2. List hidden files to see if the .bash_profile already exists: ls -ld .*
  3. If it does exist go to the next step, if it does not exist, then create it: touch .bash_profile
  4. Open up the file for editing: nano .bash_profile
  5. After entering your customizations, save the file: Ctrl + x then y
  6. Now we now need to “source” it in the terminal: source .bash_profile
  7. Quit and restart your terminal.

Here’s a gist of my .bash_profile file to get you started: https://gist.github.com/fjarrett/d089fbcfe0a8c22ca8a3

Setting Your Global Git Config

GitHub uses the email address you set in your local Git configuration to associate commits with your GitHub account.

GitHub has an easy tutorial on how to add your email to the global Git config on our computer.

Configuring SSH

SSH stands for “Secure Shell” and it’s the preferred way to securely transmit commits to and from your computer and the remote repo.

  1. Generate an SSH key on your computer
  2. Add your SSH key to your GitHub account profile

Clone a repo onto our computer using SSH

The first thing to do is create a new public repo on your GitHub.com account. Also be sure to give it a “README” file by default.

After your repo is created, it will have it’s very own URL which can be used to clone this repo to your computer.

GitHub has a simple example of how to do this, however, instead of using HTTPS, you’ll want to use SSH.

Commit and push changes back to GitHub.com

Now that you have a repo from GitHub cloned onto your computer, you can start adding files to it locally, committing those files and pushing them back to GitHub.

  1. Create a new file, like: style.css
  2. Put something in this file and save it
  3. In terminal, do: git status
  4. Now we’re going to “queue up” our change: git add -A
  5. Now we can commit this file: git commit -m 'My first commit!'
  6. Now we can “push” this commit to our remote repo at GitHub: git push
  7. Go to your repo at GitHub.com and see your new file has been added!

Next Steps

Now that you’ve jumped into the shallow end of Git, you’ll want to continue learning and exploring all of its amazing possibilities, such as, ignoring files, viewing diffs and stats, merging, tagging, stashing, rebasing, and more!

Here are a few helpful links to continue your Git learning:

How to ignore files – This is an important next step to learn about if you don’t want everything in your project to be under version control.

GitRef.org – Consider this your “Git Bible” for learning more about Git commands.

git ready – Don’t let the punny name fool you. This site has excellent “how-to” style tutorials on using Git.

Was this helpful? See a problem? Please let me know in the comments!