Glove Studio :: Blog

If you’re a web designer or developer who works on a mac, there’s a good chance that you use Panic’s awesome Coda Software to do so. I’ve used Coda day in and day out, pretty much since it’s launch. It’s interface is second-to-none and I find it really aids my design-oriented mind to get around CSS and HTML with ease.

Anyway, you’ve probably wondered what all the fuss is about subversion integration in Coda. Subversion is an open source revision tracking software that can be installed on a web server, to help one or many programmers track changes on a website. To put it simply, it lets you attach comments to every single edit of a website, and roll back to previous versions easily.

The trouble is that Subversion is generally installed on a web server, and is installed using the command line. This may not be a problem for people who think in 1s and 0s, but for the design-minded, this can be a little daunting.

However, even if you’re only working locally, there’s a great benefit to using this software to track revisions to your code. Here’s a designer’s guide to installing subversion locally on a Mac, and getting it to play nice with Coda. Guide after the jump…

This guide assumes you’ve already installed Coda on your machine. If you don’t have it yet, get it here.

1 - Download and install Subversion & create a local subversion repo

Download the latest copy of Subversion and install it. There should now be a folder named “opt” in the root of your Mac’s Hard Drive. Now, open the terminal. (Don’t be scared, it won’t bite… hard)

Now that Subversion is installed, you need to create a local subversion repo. Before you do this, it’s a good idea to figure out where you want to keep your repo. I use a folder called “SVN” at the root of my local web folder (Where I keep local working copies of all my sites.)

In a terminal window type “svnadmin create [put path to your desired location for svn repo here. the name of the repo folder will be the final word]” Make sure to remove the “[ ]” from the above text after you pop in your path.

Now, go to the finder and see if it worked.

2 - Edit config files to give yourself access to the repo

There are three files you’ll need to edit. They’re all located in the “conf” folder of the repo you just created. Open up the three files named “authz”, “passwd”, and “svnserve.conf” in that folder

In the “authz” file, copy this text into the bottom of the file

[path to your repo]
* = r
“desired username” = rw

Replace the path to your repo with, well, the path to your repo! Replace the desired username with whatever you’d like to be your username, and remove the quotation marks.

Now, to set up a password for that username. In the “passwd” file, at the bottom, paste in this text.

"username" = "desired password"

Replace the “username” with the username you entered in the “authz” file and the “desired password” with whatever you’d like to be your password. Remove the quotation marks. Your username and password are now set up.

Finally, in the “snvserve.conf” file, uncomment lines 12, 13, 20, 27 and 32, by removing the 3 hashmarks at the beginning of those lines.

3 - Setting up Subversion in Coda

Okay, you’ve made it through the tough part. Now that your local Subversion repo is set up, you just need to set Coda up to point to it.

Open up the “Sites” window in Coda. If your site isn’t set up already, go ahead and do that. Coda’s help file is there if you’re unfamiliar with it, but if you’ve ever connected to an ftp client, you should be familiar with this. At the bottom of your site set up window, go to “Source Control” and click “Checkout Source…”

Here’s the payoff, when the below window pops up, put in the path to your local repo and the username and pass you created for your repo.

That’s it, you now have a working local copy of Subversion and can track changes in Coda.

Potential Issues

• If you had some difficulty with a repo and need to delete it to start over, Coda won’t let you unless you delete the invisible “.svn” in your local site folder and every directory underneath it.
• You may need to point Coda to your local copy of svn, although it should work by default. If it doesn’t, go to “Coda –>Preferences –>Files” and pop “/opt/subversion/bin/svn” into the “Subversion Tool Path” field and close the window. That should do the trick.

If you have any issues getting this working, chances are I had them too. Leave a comment if you need help.

Happy Coding!