Web development – Recommended OS X tools

Development applications & utilities surface with announcements and updates on a regular basis promising increased productivity, time-saving innovative features, and my all-time favorite – the ability to “deliver awesome standards-based sites in no time!” If only achieving the end results were so simple…

I have fielded a handful questions from contacts inquiring about applications used in my daily routine. The following are the applications & utilities which have proven their merit through the past few months of work. Applications which I have personally trusted / relied on and would happily endorse. I urge potential users to ignore claims promised in the first few introductory lines on a developers page opting instead to try each one out for them self.

Setting the local stage – MySQL, Apache, RoR

If you enjoy the idea of using valuable time setting up the necessary environments correctly in order to begin your personal web development projects, Google is littered with tutorials & How-to’s (e.g. install MySQL) on diving straight in downloading the necessary packages and spending a little time within the Terminal.

Personally, I grew tiresome of the tediousness of the entire process. Especially after having to move from various machines on multiple occasions within very short time spans. There is a much easier method of achieving the appropriate development environments, and they come in very simple drag ‘n drop installations. All-in-one solutions meaning everything needed is contained with a single directory which you can drop into your ‘Applications’ folder. Backups? Moving to a new machine? No messy exports needed. Simply drag your all-in-one environments to your new hardrive and continue where you left off.

Screenshot of MAMP and phpMyAdmin

MAMP – Macintosh, Apache, Mysql and PHP – The essentials conveniently packed into a single 214MB directory which can reside anywhere on your Mac. MAMP is completely self-contained meaning that the installation does not make any changes to any existing Apache installations that you may have installed on your machine. Furthermore, if and when the times comes that you decide to move your work, simply copy the entire directory to an external drive or thumbdrive and trash the local copy (leaving no trace of your previous work). All web documents to be served as web pages are stored in an ‘htdocs’ within the MAMP directory while both the Apache & MySQL server are controlled via a simple GUI interface or convenient Dashboard widget. Loathed the idea of manipulating your MySQL tables from within the Terminal? MAMP comes with phpMyAdmin making managing your MySQL tables.

Screenshot of Locomotive

Ruby on Rails development? Go Locomotive – Similar to MAMP, Locomotive is the complete solution for beginning and veteran RoR (Ruby on Rails) developers to make the best of their time. Gone are the days of hunting for necessary libraries or resolving incompatibilities. Like all things simple on OS X, Locomotive is a single utility to get up and running developing on rails.

TextMate – A single tool for all development needs

Screenshot of TextMate

Previously mentioned in the Top 10 apps to supplement blogging post, TextMate continues its reign as the single most used tool in my ‘Applications’ folder behind the default browser. The reason? The application comes stuffed to the brim with features and functionality rivaled by little else. Web development specific features include a slew of customizable auto-completion shortcuts & snippets, bundles [blogging anyone?], code preview, and my favorite inline W3C Validation. Additionally, TextMate allows users to create “projects” which may contain any number of directories or files (aliases). My Desktop is littered with these little projects – which when clicked – open all pertinent files required for editing a page / site.

ColourMod Dashboard – Simplify color selection

Screenshot of the ColourMod Dashboard widget

Previously, my hunt for colors was remedied with with the help of Photoshop. Extremely resource heavy, CS2 was replaced with a convenient Dashboard widget known as ColourMod Dashboard [previously: Recommended Dashboard Widgets]. Quite simply one of the most valuable color tools any OS X user can get their hands on without the extra weight of extraneous features.

Parallels & CrossOver – Who needs a Windows box?

Developing on OS X does not necessarily mean that Internet Explorer users must be ignored. One of the greatest values of Intel powered Apple hardware is the ability to run everyones favorite browser natively (incredible sarcasm). Although PPC variants are very much capable of emulating the Windows operating system [Virtual PC for Mac] in order to achieve the same testing environment, the results are sluggishly slow.

Parallels Desktop for Mac – A popular method of getting Windows running on OS X. Run the entire operating system at near native speed. I prefer the convenience of starting any Windows application without needing to reboot. I currently use Parallels for nothing else but to run multiple versions of Internet Explorer.

CodeWeavers CrossOver – Despite being in an active beta state, CrossOver shows incredible promise. Coupled with CrossOver, Intel powered Mac users can run Windows applications without the need to boot into the Windows OS using Boot Camp or Parallels. Although I have yet to experiment with any other applications aside from Internet Explorer 6 (no working method for getting Internet Explorer 7 working), I look forward to the progress made by the CodeWeavers team. Noticeable rendering bug is inaccurate font handling due to the fact that IE6 is unable to access correct fonts.

Transmit – Seamless file upload & download

Screenshot of Transmit

Tried and true, Panic’s Transmit FTP client is among the best that I have ever toyed with. As with an OS X application, there are always alternative that users will offer up in defense. Personally, the simplicity of the interface, connection options – FTP/SFTP, Bonjour, Favorites, iDisk support are all convincing enough to retain Transmit the FTP client of choice.

Open source alternatives?

Although some may balk at the fact that most of the aforementioned applications and tools require registration fees, those interested in open source alternative list may enjoy the version listed below:

Discuss - 73 Comments

  1. Sam says:

    Great article! I think I really ought to change my text editor, I’ve been using TextWrangler for so long now and all it does is color code and tab nicely. I’ll give Smultron and TextMate a try.
    I also never knew of the ColourMod Dashboard, this should save me from opening Photoshop lots 🙂

  2. RyanB says:

    I am quite surprised that Dreamweaver didn’t get a mention like others have said, seeing that a lot of circles say it’s one of the most powerful and professional editors out there. Of course, you pay for it.

  3. Simone Chiaretta says:

    I’m a .NET developer, and I’m going to buy a new MacBook since it can run Windows OS, too…
    So, I would like to include also the Apple BootCamp, and Parallel for Mac, in order to run Windopws on Mac

  4. Derek says:

    [quote comment=”15443″]I am quite surprised that Dreamweaver didn’t get a mention like others have said, seeing that a lot of circles say it’s one of the most powerful and professional editors out there. Of course, you pay for it.[/quote]

    I see no need to run a full feature bloated application like Dreamweaver. There are more affordable and resource-light utilities out there. If you prefer the WYSIWYG route, definitely add that app to your list.

  5. Jose Cardoso says:

    Or if you want to enable PHP outside of the MAMP environment try this:


  6. RyanB says:

    I would be much in favor disbanding the wysiwyg portion of it, I would kind of hope that the people that are professional web designers/developers don’t even touch it. I only do when something is annoying me, and something like a space was throwing everything off…

  7. Great article, I found it very useful!

    Thank you for putting the time into creating such an amazing website!

  8. […] Create & manage screenshots on OS X Creating & managing screenshots on OS X may not garner the same type of attention had the topic been something more along the lines of creating a web development environment on OS X, cloning a hardrive, or improving your iChat experience. Regardless, those that do collect and amass a large collection of images can attest to the fact that such collections can 1) be tedious, 2) get quite unorganized, or 3) utilize more disk space than they should. All of these issues are easily resolved with a few simple techniques. […]

  9. daniel gona says:

    you might want to check out firebug, a fantanstic debuging plugin for fx…

  10. […] OS X may not garner the same type of attention had the topic been something more along the lines of creating a web development environment on OS X, cloning a hardrive, or improving your iChat experience. Regardless, those that do collect and […]

  11. […] bug hunting. Five ways to save time developing on OS X. Open source alternatives included as well.read more | digg story […]

  12. Chris says:

    Good read, well put. One more shout out though for CSSedit 2.0. I can’t imagine not using it – blows my mind. Sliders, arrow key margin/padding adjustment – instant visual feedback, sweet validation. You just can’t compare it to hand coding: save, update, preview – its really no contest. Has made CSS a whole hell of a lot more enjoyable. Simply put with CSSedit you’re not just writing CSS you’re designing it. $30 – no sweat – would pay more easily.

    Now stepping down from soap box

  13. […] OS X users see Living-e AG’s MAMP (MySQL, Apache, and PHP) previously mentioned here. […]

  14. Derek says:

    I guess the only real drawback which prevents me from using a separate application for CSS files is just that, using (opening) another application for handling a task which is no more difficult than hand-coding HTML or PHP. With the tabbed projects offered in TextMate, I find it hard to enjoy bouncing between different applications to complete one unified task.

    Now, if CSSedit decided to support syntax highlighting or the like for general web development, I’m all over that one.

  15. I also find CSS Edit 2.0 to be utterly amazing.

    I’ve played with the demo and finally bought it up this morning; and I would have easily paid more than the $30 for it… quite the steal.

  16. […] the way I like it I found exactly what I had been missing the whole time. An article here: http://5thirtyone.com/archives/707 pointing me to 2 great projects that would have saved me an entire […]

  17. VN says:

    I am using Eclipse for HTML/PHP developments. Eclipse does a good job in formating php only codes, however, for html/php code it gets confused and it makes a mess where one can’t follow the code anymore. I am open for suggestion for editors that can understand and format mixed HTML/PHP.

    Also, are you guys aware of an editor where you can drag and move text and not worry about what happens with the CSS?

    Your Career Search Ends With Us!
    Private, Government & Academic jobs.

  18. nikola says:

    Great article! I think I really ought to change my text editor.
    Thnx for share…