Hello! My name is Dan Eden, and I recently updated my workflow to include Git and GitHub. It’s made my work more portable, my workflow more secure, and helped me learn more about the command line interface, thus making me look awesome.
But what’s the point in looking and acting smart if you can’t help the rest of the world look and act smart too? There isn’t one. So I made this short tutorial on how to get Git and GitHub integrated into your workflow.
This tutorial is going to assume a few things. Namely:
Got all that? Excellent. Let’s get started. In the examples below, we’ll be adjusting our FTP-based workflow on an existing site to integrate Git and GitHub.
First things first. We need repositories on our local environment, our GitHub account, and our remote website. The first two are easy.
Great - now you can make changes on your local copy and it’ll sync up to GitHub. But we’re still missing the clever part - getting those changes from GitHub to the remote server.
So our next step is setting up the repository on the remote server. Let’s do that now.
example.com/html/, so that's where we want our repo.
git remote add origin firstname.lastname@example.org:daneden/example.com.git
git add ., commit with
git commit -am "Initial commit"and push to GitHub with
git push -u origin master(Note the
-uflag which sets up tracking, meaning in future you'll only need to use
If you’ve gotten this far, well done. After you sync your local repo in GitHub for Mac one more time, you’ll have identical copies of your site on your local server, remote server, and on GitHub. Give yourself a high five.
I’m willing to bet that the files you now have three instances of combine to form some sort of database-driven web application. And I’m willing to bet you have a different database configuration on your local server than your remote. You want to tell Git to ignore your database configuration files so that you don’t end up with local database settings on the web, and vice versa.
Create a file called
.gitignore inside your repository. In there, you can make a list of all the files you want Git to ignore. For instance, in WordPress you’ll want to ignore
wp-config.php, so the contents of your
.gitignore file might simply be:
You can ignore files with a particular extension, and recognize files in previously ignored locations:
# Ignore these files and folders wp-config.php wp-content/uploads/* # Ignore data and junk files *.DS_Store *Thumbs.DB # Recognise these files in previously ignored locations !wp-content/uploads/.htaccess
Commit and sync the repo, and it’ll go on up to GitHub too. But wait a second, we’re still missing that final step - getting our code from GitHub to the remote server. Well, we need one more file for that.
Create a PHP file - the name doesn’t matter, just don’t make it easy to guess - with the following contents:
<?php `git pull`;
Commit, sync, then SSH back into your server and run
git pull inside your remote repository.
Once you’ve done that, go to the Admin section of your GitHub repository and click on “Service Hooks.” Click on “WebHook URLs” and enter the URL for the script you created a few minutes ago.
Take a deep breath, then click “Update Settings.” Congratulations. You are awesome. From now on, any changes that you make to your Git repository - locally, remotely (with
git push), or on GitHub.com will be pushed live to your site.
With any luck, this short guide has helped you to get Git and Github integrated in your workflow. But it was written by a designer (yuck! Am I right, developers?) who’s new to all this stuff. There are bound to be missing steps, typos, and downright stupidness in the information above.
Luckily, this entire guide is on GitHub, meaning that you can fork it and improve it for yourself and other people.