Web development environment

July 12, 2010 by Zoran

We all know that the need for external resources while doing our development is a pain. We all want the utopia of taking our laptops and sitting somewhere nice (forest, meadow, glacier, …) while developing Carpal tunnel syndrome. So let’s get a step closer to this image while doing our web thing. For this we need to build a completely self-sufficient development environment on our machine. It’s actually a lot easier than it sounds.

Disclaimer: The process i describe here was used on Ubuntu Linux 9.10 distribution, but it can be done on almost all modern OS-es with minor modifications.

So the first thing we need is a good text editor. I will not recommend any here because I do not want to start another chapter in the eternal editor wars ;) Any editor you feel comfortable with will do nicely. We will, of course, use our editor for spitting out HTML, CSS, PHP, Perl, JavaScript and all those sorts of goodies. Most OS-es come with at least one so we’re covered here.

Naturally, we would like to see the fruits of our labor as soon as possible so we will also need a web server. We could go with any of the modern web server implementations and go through the hoops of installing them, configuring, installing the needed modules, configuring. Then we would happily use our new installation until it suddenly hits us… we need a database. So back to the install, configure loop. Fortunately there is a much faster and simpler solution: XAMPP. It comes bundled with everything we need: web server with PHP and Perl modules, CGI and SSI included and MySQL server. There are even a few extras, such as an FTP server and phpMyAdmin component.

The setup is a snap. You just hit the WWW waves to the XAMPP site and download the version you require. It is a good idea to get a version bundled with the PHP and/or Perl versions you will be using on your production server so you get an environment as close as possible to the real one. After that you just enter tar xvfz xampp-linux-1.7.3a.tar.gz -C /opt (the version downloaded in this case is 1.7.3a) in the shell console. This will put LAMPP (XAMPP for Linux) in the /opt/lampp folder on your machine. All you need to do to start your new servers is enter sudo /opt/lampp/lampp start in the console and you’re good to go. Note that the default XAMPP installation configuration should not be used in the production environment but is more than adequate for our development needs. Installing a production web server needs a little more care after all ;) For the more simple web needs this is enough. If you want to work on several sites at the same time or your web apps have a little more complex requirements you will need to setup virtual hosts. All the intricacies of this setup are a little beyond this article and will be covered in a later post.

The final part is a browser for testing. All todays OS-es come with at least one browser already installed but you should test your work on all major browsers in use today. The list includes at least Firefox, Chrome, Opera, Safari and, yes, IE. Testing web sites on IE under Linux is a whole topic on its own and we will delve into it at another opportunity. For the majority of development process my favorite is currently Firefox with Firebug and Web Developer extensions installed. Covering all the capabilities of these extensions could make a small novel but let’s just say they are a great web debugging tools in your arsenal.

Now you got all it takes for a self-sufficient web development environment. We’ve done a quick run through the while process but covering every possibility and error that can happen during the setup process was not my intention in the first place. For the majority the setup will go in a snap. If you run into any problems during any of the steps don’t hesitate to let me know. I’ll be glad to help.

Also, let me know in the comment section if you know of a better setup.