How Subversion Can Solve Your Development Nightmares – Part 2 of 3
In part one of this three part series, I explained what Subversion is, and why it is useful.
In this part we will setup a small project and then use TortoiseSVN to manage it for us. This will involve making minor changes to a vanilla version of osCommerce 2.2 MS2. We will not be installing or running the store, so there is no need to have a web server or mySQL installed to complete this tutorial.
The examples used have been geared towards osCommerce developers, but will still be useful to others.
Step 1 - Set up your development environment
To complete this tutorial, you will need the following.
- Tortoise SVN - http://tortoisesvn.net/downloads
- osCommerce 2.2 Milestone 2 - http://www.oscommerce.com/solutions/downloads
Install TortoiseSVN using the installer provided, accepting the default settings. You may need to restart your PC if asked.
Create a folder on your hard drive called svntutorial. I’m using C:\svntutorial. Within this folder, create a folder called myproject. Within the myproject folder, create three subfolders; trunk, branches and tags. I’ll explain what these are for in a little bit.
Extract the osCommerce catalog folder and place it inside the trunk folder.
Step 2 – Create a SVN repository
The repository is the very heart of the Subversion. It exists to keep a master copy of all your files, as well as track any changes made to those files. It deals with all the complex logic of remembering who changed what and when so you don’t have to.
The following steps will create a repository for our project.
Create a new folder called myrepository in the svntutorial folder.
Using Windows explorer, navigate into this folder, then right click. In the pop-up menu that appears, select TortoiseSVN -> Create repository here….

Leave the default value of Native filesystem (FSFS) selected and click OK.

You repository has now been created. If you look inside you will see several files and folders. From now on there is no need to go back into this folder. Everything can be done with the TortoiseSVN pop-up menu.
You should now have a file structure that looks like this:

Explaining the trunk, branches and tags folders
In part 1 of this series, the trunk and branches of Subversion were explained. In order to keep our repository structured, we have created separate folders for each of these areas, one for the trunk, one for branches and one for tags.
Tags should be thought of as branches, except they are used to hold project milestones. For example, if you have finished coding version 2 of your software, you would create a tag branch with this code.
Step 3 – Importing the project into the repository
The next step is to import our project into the repository. This only needs to be done once, at the beginning of every project you start.
In Windows explorer, right-click on the myproject folder and select TortoiseSVN -> Import….
Enter file:///C:/svntutorial/myrepository in the URL repository box. Then type a log message into the box labelled Import Message.

Click OK and watch as your project is imported.

Revision 1 of your project is now sitting on the trunk. Easy wasn’t it!
Step 4 – Checkout the project from the repository
Now we want to being work on our project, making the changes that will take our store to the next level!
In order to start, we have to let Subversion know that we intend to do some work by checking out R1 from the repository.
Create a new folder called mysandbox in C:\svntutorial. This is where we will checkout the project and do the editing.
Enter the mysandbox folder, right-click and select SVN Checkout from the pop-up menu.
In the URL of repository box enter file:///C:/svntutorial/myrepository/trunk. This is because we only want to checkout the trunk and not any branches. Make sure the value in the Checkout directory box is C:\svntutorial\mysandbox and leave all other settings.

Click OK, wait for the files to be checked out, then click OK again.
If you have a look in mysandbox you will see your project files (the osCommerce catalog folder). You will also notice a green tick on this folder. This means that the checked out version is the same as the repository version.
Because our project is now in the repository, it is not necessary to keep the myproject folder (C:\svntutorial\myproject) and it can be deleted.
Step 5 – Edit the checked out project
Lets make some changes to the default osCommerce code. We are going to make two changes. First we’ll remove the ‘What’s New’ box from the left of the store, then we’ll tell our store about a new spider.
Whilst these are only minor changes, it will give you a good understanding of how Subversion works.
Open catalog/includes/column_left.php. Remove the line that reads require(DIR_WS_BOXES . ‘whats_new.php’); (line 25). Save and close the file.
Open catalog/includes/spiders.txt. After muscatferret, add the line mynewspider. Save and close the file. Notice how the two files we’ve changes have a red exclamation mark by them. This means they are DIFFERENT to the version in the repository.
Step 6 – Commit the changes to the repository
We’ve made all the changes we need, and want them to become a permanent part of our software. It’s time to commit our changes to the repository.
Right-click on the mysandbox folder and select SVN Commit…. TortoiseSVN shows us the two files we have changed. Both files should be ticked because we want them to be commited. Enter a log message to help remind yourself about what you changed, and then click OK.

SVN sends your files to the repository and creates revision 2 on the trunk. Click OK to close this dialog.

If you want to see a visual representation of what just happened, right-click on the mysandbox folder and select TortoiseSVN -> Revision graph.

Step 7 – Reverting to working code
To prove a point we are going to make another change that breaks our code. We shall then roll our code back to R2 (which we know works). This is to illustrate installing a broken contribution, then having to remove it.
Open catalog/includes/footer.php. Delete some lines in the file at random. Go mad if you want. Remember, the repository has a backup copy of this file for just this reason. Save and close the file when you have finished your mini rampage.
Now pretend we load up the store and find for some reason it isn’t working.
I wonder if it’s something to do with all the code you deleted in footer.php! Whatever the cause, we need to revert our code quickly to a working version to get the client’s store running again.
To do this, right-click on the mysandbox folder and select TortoiseSVN -> Revert…. A dialog box will popup showing that the only file changes is footer.php.

Click OK and this file will be rolled back to revision 2.

This is only a trivial example, but imagine if you had accidentally deleted some files, or made hundreds of code changes. Reverting with Subversion is much quicker than doing it by hand.
Conclusion
Part 2 of this series is complete. I hope you found the Subversion walkthrough useful and you being using it for your own projects. It really can save you a lot of time.
In part 3, we will cover branches, merging and tags.
As always, feel free to leave any comments.
Enjoyed reading this post? Get more delivered directly to you.
Responses
Reply