The portable web development toolkit

Web developers are sometimes forced to travel. Unfortunately, lugging a big, bulky laptop around with all their programs is the only way to develop on the road. After all, using another computer is out of the question since it doesn’t hold all of your favorite programs. Luckily, there is a best of both worlds. Thanks to John T. Haller, the Apache Friends, evolt.org, winPenPack.com, and a host of others, you can carry an Apache server, a MySQL (and SQLite) install, a PHP install, a Perl install, a mail server, an FTP server, two popular web browsers, an FTP client, an HTML editor, an image editor, and a vector graphics editor on a 512MB flash drive to be used with any Windows computer. All using free software.

What is a portable app?

Today, you can get a 512MB flash drive for as low as $7.99. It’s hard to fill up 512MB with just documents. That’s where portable applications come in. A portable application is an application that doesn’t write settings to the registry or Application Data folder (for a more formal definition, visit the What is a portable app? page at PortableApps.com). And that’s what we’re going to use to set up our portable web development kit.

XAMPP: All-in-one server

XAMPP is an Apache friends project to create an easy, all-in-one testing development for web developers. Running on Windows 98, NT, 2000, 2003, XP and Vista, it features an Apache server, MySQL and SQLite, PHP (4 and 5), Perl, OpenSSL, phpMyAdmin, Webalizer, Mercury Mail Transport System, Ming, FileZilla FTP Server, WEB-DAV, and much more. You can add more languages and features using the XAMPP Addons (installation guide at the XAMPP for Windows page). Just download the Windows .zip, extract it to the root of the thumb drive (so the xampp folder would be E:\xampp), run xampp-control.exe, and start the services. Put the web content in \xampp\htdocs. There’s a list of where the software executables are on the XAMPP for Windows page.

Nvu Portable: What You See Is What You Get

Nvu is one of the most popular WYSIWYG (What You See Is What You Get) HTML editors. Besides its rich text capabilities, it has basic FTP capabilites, tabs, forms, and much more. John T. Haller was one of the people who liked it. In fact, he liked it so much that he created a portable version called Nvu Portable.

Notepad++: All purpose programming editor

There are tons of replacements for the Windows Notepad (Notepad2, SciTE, and NoteTab come to mind), but my favorite is Notepad++ (in fact, that’s what I’m using right now to write this blog entry). It’s got code collapsing, syntax highlighting, auto completion, macros, and much more. Best of all, it is portable out of the box.

ESWAT web project framework: Quickstart your web development

Unlike the other things on our USB drive, this isn’t a program. It’s a skeleton design containing folders for CSS, images, flash, JavaScripts, designs, and docs, all laid out in a neat order. It also includes (X)HTML and CSS templates, some PSDs, and more. Use it to quickstart your web development.

Firefox Portable and Opera@USB: Cross platform testing

The most important thing for a web developer to do is to make sure that his site works in the four major browsers: Firefox, Opera, IE6, and IE7. Luckily, two of these browsers have unofficial portable builds: Firefox Portable and Opera@USB (IE isn’t as neccessary since most computers have either 6 or 7 installed).

FileZilla Portable: FTP Uploading

Every good web developer’s toolkit is never complete without an FTP client (yes, Windows Explorer will act as an FTP client, but it doesn’t support many features that real FTP clients support). FileZilla is my personal favorite. However, it’s not portable. That’s why John T. Haller created FileZilla Portable, which lets your run FZ off of your USB drive.

GIMP Portable: Image editing on the go

All web developers need an image editor. And what (free) editor is better than the GIMP? After all, it supports almost every image type, has tons of brushes, filters, scripts, and much more. However, it isn’t portable. That’s why John T. Haller created GIMP Portable. For GIMPshop users, who prefer the Photoshop-feel, there exists a program called X-GimpShop.

X-Inkscape: Vector graphics editing

While GIMP is useful for editing images, you’ll need a vector graphics editor as well. The best one is Inkscape: it’s free software, works like a charm, uses standards, supports CC metadata, imports all the popular image formats, and works almost as well as commercial apps do. And of course, there’s a portable version called X-Inkscape (if there wasn’t, I wouldn’t be talking about Inkscape, would I?).

Wrapping it all up

Our web development thumb drive is now done. We have a server, some editors, an FTP client, an image editor, and a vector graphics editor. All free software. Everything that a web developer could possibly need is there. If you don’t like some options, many alternatives abound. The Portable Freeware Collection and the List of portable software at Wikipedia are some good places to start.

License

Verbatim copying and distribution of this entire article are permitted worldwide, without royalty, in any medium, provided this notice is preserved.