If you’re new to version control it can be a little overwhelming to wrap your head around. Coming from a visual design background I like to visualize complex concepts in my head. I thought I’d share some of my mental notes on the basics of Git and GitHub as a resource for other visual designers trying to delve deeper into the web developer spectrum.
So what is version control?
Basically it’s a backup system.
If you’re a one person team you can simply use it as a place (or repository) for storing your project files. It’s even useful for storing graphic files. But the real value of version control comes into play when you collaborate with other designers and developers. A version controlled project can be thought of as a tree trunk. Members of the team download (or pull) a clone of the trunk (or master branch) from the repository on a server. Then they can create a branch where they can experiment and do their work without effecting the main project files. When they’re ready to share their additions or revisions with the team, they upload (or push) their branch up to the repo leaving the master branch untouched. When the new branch is approved, normally by an admin or group of admins on the team, the branch can be merged into the master branch.
Example
Let’s say we’ve decided to add a hamburger menu element to a project named “responsive website”. First, we clone a copy of the project from the repo onto our local workstation:
Next, we create a local branch called “hamburger-menu” from the master branch:
When we’re ready to share our work for the team to review, we publish the branch by pushing it up to the repo:
Once the additions in the new branch are approved, the “hamburger-menu” branch can be merged down into the master branch and then deleted. Since the “hamburger-menu” includes changes that aren’t yet on master, it’s referred to as being ahead of master and by merging it into master we’re advancing or growing the trunk:
Finally, we pull the master branch down to advance our local copy in order to stay in sync with the repo:
Basic Terms
- Fetch: Check to see if anyone has added any revisions to your current branch on the repo.
- Pull: Download and integrate the revisions to your current branch from the repo into your local copy.
- Push: Upload the revisions from your current branch on your local copy to the repo.
Conflict Resolution
When contributors are collaborating on a project it’s common that the same set of files will be modified (or touched) by different users on separate branches. And when those branches are merged together conflicts can arise that will prevent the merge from completing. When this happens Git will prompt you with an error and highlight the section of the file that contains the conflict. The best part is you can always revert back to a point in time before the conflict happened because Git records everything!
Git Clients
Purists only use the command line tool but there are a number of GUI clients available including GitHub for Mac and Tower.