Is Espresso Your Cup of Web Design Coffee?

I’m a fairly recent Mac switcher and, as a web developer, I started wondering which coding environment I would choose. I spotted two main apps that seemed to stand out from the crowd: Coda and Espresso. Although we’ve covered Espresso in the past, I thought it was worth taking another look at this fantastic web development app today.

When Espresso was reviewed here for the first time, it was still in beta. Though we could see what the app would look like and some of the features it would include, the app wasn’t complete. Since Espresso came out of beta, lots of things have been added to the product. Features such as a project manager and better publishing options have really helped Espresso become an all-round better candidate.

Espresso has some superb features, but also a few aspects that could be improved. And how does it stand up to Panic’s Coda? In today’s review, we’ll put Espresso through its paces.

Features I Like

The Interface

Espresso’s interface is beautiful. It’s simplistic look actually turns out to be a big time-saver; rather than trying out all the different features, you get down to coding. The interface is divided into three main sections: the sidebar, the editor and the tools sidebar.

The Espresso Interface

The Espresso Interface

Managing Open Files

Workspace

Workspace

The developers of Espresso innovated in this domain. Rather than just implementing tabs (like in TextMate or Coda), MacRabbit implemented the “workspace”. According to Espresso’s official website, the workspace area “combines the best of both worlds [sidebar and tabs]. Space efficient, organized and convenient like a sidebar; dynamic and flexible like tabs.”

The Project Manager

Added since we last reviewed Espresso, the project manager is a welcome addition. It shows you all the projects you have created in Espresso, fully searchable to easily find what you’re looking for as your project list grows.

Project Manager

Project Manager

You can set a color and an image for each website, making them very easily identifiable. The information concerning your project is stored in a file called Name of project.esproj, found in the folder containing your site’s files.

Viewing a Project File

Viewing a Project File

The Tools Sidebar

Tools Sidebar

Tools Sidebar

Espresso’s right sidebar is very complete. It is made of three sections: the code navigator, the quick publish area, and snippets. I enjoy all three of these “widgets” but some areas could be improved.

The Code Navigator

This feature gets particularly useful when working on larger sites. It shows you all the elements in the page you are currently coding. You can also replace elements from this “widget” with drag and drop. The elements are collapsible, making it easy to hide or show certain parts of code.

Espresso is probably the only editor that offers a code navigator that is so complete.

Quick Publish

When doing some “quick and dirty” editing on a webpage, this feature is invaluable. It’s functionality is quite simple: when saving a file, it also uploads it to the server of your choice.

Though this feature is very practical, it would be great if it could alert us once the file upload is complete (with a Growl notification, for example).

Snippets

The snippets functionality in Espresso is actually very smart. It has a few standard snippets built in, and you can add your own (just like in many code editors). The clever thing is that Espresso changes the snippets shown based on the language you are coding in at the moment. For example, if you are coding in HTML, the standard snippets provided will mostly be HTML tags and page templates. If you are coding in PHP, you’ll be shown relevant PHP functions.

One thing helpful addition would be the possibility to organize our snippets into folders to make them easier to find. For the moment though, this isn’t directly integrated into the snippets manager.

Powerful Publishing

Powerful Publishing

Advanced Publishing Features

Espresso gives you many ways to publish your files to your server: quick publish (which we saw above), right clicking on “Publish”, or (my favourite) the Advanced Sync Tools.

These haven’t changed since the last time we reviewed Espresso. You can choose between Update, Merge or Mirror, and Espresso will detect missing/outdated files and add, update or delete them. Once you get the hang of using it, you wonder how you ever managed without.

Version Control?

So many developers use version control today, it really feels like something that should definitely be integrated into Espresso. Whether it’s Subversion (SVN) or Git, a solution built directly into Espresso would be a huge benefit, and would certainly give it the crown of being an “all-in-one web development solution”. This is already supported in Espresso’s competitor, Coda.

Final Thoughts

In short, I really like Espresso. Before switching to a Mac, I had heard a lot about Coda and Espresso and couldn’t wait to try them both. It’s actually quite ironic that I wanted to try these two applications. One seems to be trying to pack everything in (Coda) and the other one seems to want to streamline the whole web development process (Espresso). Advanced publishing features and the code navigator in Espresso are very useful to me, but there are still a few things that need to be fixed.

To be very honest, both Coda’s and Espresso’s icons sit on my dock ready to be used. It depends on how I feel that day and the type of project I am working on. If I am working on a smaller, static site, I’ll probably use Espresso because it has a live preview, and because it doesn’t pack plenty of options I won’t necessarily need. On the other hand, if I work on a bigger project where I constantly need to preview dynamic files, I’ll probably end up using Coda.

The truth is, choosing a web development editor is a very personal thing. Take a look at the features you need the most, and decide which interface you’re the most comfortable with!


Leave a Reply

Your email address will not be published. Required fields are marked *