9 Mar 2013

Using Subversion in Dreamweaver

When I started out, creating a few hobby sites, I came across subversioning (or something like it) and read that it was a great tool for teams working on the same files. So, not for me then, a lone coder, with limited skills. As time went on, and I started creating more complicated sites, using new technologies (well, new to me anyway), I found my workflow becoming chaotic, with loads of open files on CSS, php, js, XML etc, etc. I needed structure - especially when it came to overwriting files that bust my new shiny site, which I then had to fix by hitting the undo button 20 times, or in a worse case scenario, re-write as I'd already closed the offending file. So, Subversion to the rescue. Er, well not quite that simple. I occasionally use Dreamweaver (CS5) to develop some sites, so I was looking at it to perform as a client, only to find that it doesn't have full client capabilities, but on further reading, this isn't such a handicap as it simplifies matters considerably. In order to get Subversion up and running on my system, I first had to get a server version (msi) from here: http://www.visualsvn.com/server/download/. Then I installed it - which took a long time! - and ran it. It gave a typical installation window, which requires some parameters for setup. The main one being location. I didn't fancy placing the repositories in my root folder, so I chose a folder in my XAMPP installation. The port options available to me were 443 and 8443. Once setup, VisualSVNServer then provides you with an https url for use with your client (Dreamweaver in my case) and browser view, in the format:
https://computername:port/svn/.

You won't be able to use this until you set up an user account, so, to do that, right-click on the 'User' folder in the left panel and 'Create User'. You should then see a dialog box asking you to provide details. This will be used for client access later on in Dreamweaver.

The next step is to create a new repository for your site, simply by right-clicking on 'Repositories' and choosing 'Create New Repository...'. You'll see a dialog box asking for the repository name - so give it a name - and you have the option of setting up additional structure such as branches etc. You may not need this, so feel free to not tick the check box at this point. You can always go back and add structure later on.
Right, that should do it for the server bit. Now on to adding Subversion (SVN) server details to our site in Dreamweaver. So, get into your site setup and enter the details similar to below (the scratched out entry is just the computername from the Subversion server url - without the 'https://' bit). Also ensure that you enter the correct port.

To avoid confusion 'diafol' in the 'Repository Path' is the name of the Repository I set up earlier - nothing to do with the username. Okay, once you've filled out the details, try testing it, and once saved, away you go!
The first thing you'll notice is the little '+' icons next to all your files and directories in the 'FILES' panel. In addition, you'll now have a 'Repository View' in the Servers View dropdown:

So how to get it to work?

Simply use the Check In and Check Out options from the shortcut menu when you right-click on a file or folder in 'Local view'. When you want to save a version to the repository, use Check In. You should then get a dialog asking you for the action required:

Once you've made your choice, press the 'Commit' button. The little '+' icon next to the file or folder should then disappear. If you now make changes to a file and save it and then 'Check In', you can check whether you have various revisions, either from 'Local view' or 'Repository view'. If you go to 'Repository view' and right-click on the file in question (common.php in this case), you'll get a shortcut menu.

Select 'Show revisions...' and you should see a list of revisions for that file:

You can then view a revision, or usefully, make a previous version the current one. This can then roll back your local version to the selected one on 'Check Out'.
I hope you found this post useful and that using SVN / Subversion is not as scary as it might first appear. Obviously, I've only scratched the surface and be aware that other alternatives to SVN exist. However, for day-to-day stuff for the average DIY hobbyist, this pretty much covers most of my needs.

1 comment:

  1. It’s full of insightful information and entertaining descriptions!

    ReplyDelete