Here’s a walkthrough for what I did to get set up, starting from square one. This is literally everything I did and installed from when I was first able to access the desktop after a fresh install.

Web Browsers

1. Install Firefox. Seriously, do I even have to mention this?
2. Install Chrome. I use Chrome for using CMS’s since I feel it’s a bit faster than Firefox. Administrating Joomla sites, for instance.
3. Install Safari. Safari Win has a somewhat different set of rendering bugs than it’s neighbor on the Mac, but there is enough of an overlap that I use it to spot-check.
4. Install Opera. It isn’t that widely used but I like to check out my sites in it.

Development Tools and Useful Apps

1. Install SciTE with extensions. It’s a kick-ass text editor with code coloring for a support for a multitude of languages.
2. Install Aptana Studio. One of the best full-featured development environments around. Based on Eclipse so it can be a resource hog, and prone to some unusual behavior, but it’s still on a level beyond costly web dev IDEs like Dreamweaver.
3. Install XAMPP. This is a bundle that includes the Apache web server, MySQL database and support for PHP and Perl. It comes with lots of goodies like a web interface with quick links to all of the administrative areas, e.g. pre-installed phpMyAdmin for administrating the MySQL database. Note: make sure you install this to a folder without spaces, e.g. c:\xampp. For more information, read our article on setting up XAMPP.
4. Install TortoiseSVN.
5. Install 7-Zip.
6. Install DAMN NFO Viewer.
7. Install the MagicISO Virtual Drive.

Customizing Firefox

I like the clean up Firefox and streamline it a bit. Here are some of the things I do after a fresh install.

1. Delete the links in the bookmark toolbar (“Recent Headlines” and “Getting Started”) by right-clicking the bookmark and hitting ‘D’ on the keyboard. You can keep “Most Visited” if you like since it is actually useful.
2. Right-click on the navigation buttons and choose ‘Customize’ to streamline the icons. If you plan on using navigation icons, check the ‘Use small icons’ box so they are at least small. Remove the ‘Home’ link by dragging it away from the navbar.
3. Drag and the search box and the addressbar to the top area. Also, you can optionally drag the back/forward and stop/refresh buttons to the top, on the left of the addressbar. I personally remove the navigation in favor of keycommands. Instead of clicking back and forward buttons I just use the Alt+Left and Alt+Right keyboard shortcuts, respectively. I also remove the loading spinner on the top right of the page to save space. No need for a stop button when you can hit Esc, and why click the refresh button when you can hit CTRL+R? Obviously this is personal preference, but that’s how I roll!
4. Once you’re finished customizing it, hit ‘Done’ and then right-click on the navigation again and click on ‘Navigation Toolbar’ to hide it. We’ve just provided that much more screen real estate for what’s important, the web sites.

Firefox Extensions

1. Firebug
2. ColorZilla
3. MeasureIt
4. Web Developer
5. FireFTP
6. Delicious Bookmarks
7. ScribeFire
8. Flash Plugin
9. DivX Plugin

After installing the extensions and restarting, I add a few small icons to the top (on the left side of the addressbar). I add the icons for “Inspect Element” (Firebug), toggle the Web Developer Toolbar on and off, and tagging pages in Delicious.

Firefox Search Engines

You can install Firefox search engine plugins by visiting the MyCroft Project homepage. There are some nifty ones like Google Code Search. Also, you can install the MyCroft Project search plugin which actually searches available search plugins. How meta!

That’s it for now. I’m sure I left out a lot of great apps so I’ll have to write a follow-up. But, this is a pretty good start to getting up and running with a development environment.

It’s time consuming setting up web development environments and any seasoned developer will have most likely spent countless hours debugging obscure configuration issues. Also, with the plethora of options available, some newer developers can have a hard time locating and choosing what to install.

It turns out that most dynamic websites use a fairly common setup known as LAMP, short for Linux, Apache, MySQL and PHP/Perl.

With this in mind, the developers at Apache Friends have released XAMPP, the X being an operating system of your choice. It comes with Apache, MySQL, PHP and Perl (along with a grab-bag of other goodies), and you can choose the package built for your OS.

Although I’m a sometime Ubuntu user, my current development environment is primarily on a Vista laptop. I grabbed the Windows XAMPP package and was amazed at how easy the “no-config” install was.

It includes:

• Apache
• MySQL
• PHP + PEAR
• Perl
• OpenSSL
• phpMyAdmin
• Webalizer
• Mercury Mail Transport System
• Ming
• JpGraph
• FileZilla FTP Server
• mcrypt
• eAccelerator
• SQLite, and
• WEB-DAV + mod_auth_mysql.

Whew! They threw in everything and the kitchen sink. But, luckily the installation is painless and you don’t have to worry about the stuff you might not use, plus it’s nice to know it’s there if you need it. phpMyAdmin makes managing the database a breeze and above all, everything just works.

After downloading and installing the package to C:\xampp (they recommend against placing it in Program Files on Vista due to file permissions issues), I took it for a spin by visiting http://localhost in my browser. The user is presented with a handy control panel, with links pointing to all of the various parts of the XAMPP bundle.

Note: I chose to run Apache and MySQL as services, meaning they will always start when the computer boots up, but you may choose to run them as standalone programs if you don’t use them much. If you didn’t choose to install it as a service and are not getting a response from http://localhost, make sure you’re running Apache and MySQL.
You can control which parts of XAMPP are running under Start / Programs / XAMPP. This is where you can start/stop servers as well as toggle them as services.

The XAMPP control panel for start/stop Apache, MySQL, FilaZilla & Mercury

Assuming everything is working correctly, visiting http://localhost should result in the following screen:

If you need more options, such as Java/JSP support or Python, check out the add-ons available:

• Perl Addon with Mod_Perl and a selection important Perl Modules
• Tomcat Addon (Requirement: SUN J2SE SDK must already be installed)
• Cocoon for Tomcat Addon (Requirement: Tomcat Addon must already be installed)
• Python Addon

A final note: This is for development purposes only, so it has absolutely no security. Don’t even think about using this set up in a live environment. You’ve been warned. Don’t believe me? Here’s the list of security holes:

Here a list of missing security precautions in XAMPP:

* The MySQL administrator (root) has no password.
* The MySQL daemon is accessible via network.
* PhpMyAdmin is accessible via network.
* Examples are accessible via network.
* The user of Mercury and FileZilla are known.

Even in development, it’s a good idea to set passwords and disable unused services. You can do so by changing the settings at http://localhost/security in a web browser.

For more info on XAMPP, visit the site the FAQ:

http://www.apachefriends.org/en/faq-xampp-windows.html

Or the forum:

http://www.apachefriends.org/f/

Happy XAMPPin’!