A geek hotline!

31 Tools Every Web Developer Should Know About

[A book review of "Web Development Recipes" by Hogan et al. The Pragmatic Programmers. 2012. 321 pp.]

This terrific compilation of recipes (42 recipes in 300 pages) is akin to having 24/7 access to a bunch of super-geeks who have found the time you wish you had to explore every promising new web development technology out there. Moreover, the authors have prepared a nice little recipe (generally under 5 pages) for each idea that is worthy of further attention.

For the most part, you can skim through the book in any sequence. And you can either read or try out the recipes. I actually tried a few on my web sites (e.g. recipe #3) and they do work! And there's good thoughtful cross-referencing between recipes, pointing out prerequisites and ideas for further exploration.

Even if you're not motivated enough to try out all of the book's recipes, skimming through this book is the best way I can think of to develop a meaningful understanding of cutting-edge web development technology trends.

Of particular value is the "progressive enhancement" approach the authors evangelize and display while building their recipes. Start by laying down a pure HTML foundation. Then add JavaScript interactivity. Add CSS for styling. This results in a decoupled system which work even when JavaScript isn't available or up-to-date on the user's client.

Here's a comprehensive list of the cutting edge, proven web development technologies this book will introduce you to.

• HTML5 and CSS3. The latest techniques for constructing and styling your web pages. (Multiple recipes.)
• CSS3 Transformations. To animate without using Flash so you're iOS compatible.
• jQuery, jQuery UI, jQuery Theme. The most popular of the JavaScript libraries. (Multiple recipes.)
• Mustache. A tool for creating HTML templates (a cleaner approach relative to generating HTML directly from JavaScript).
• AJAX. A JavaScript technique for server requests for portions of an HTML page without having to request a complete page update.
• QEDServer. A standalone web application with a product catalog database and a RESTLike API that allows developers to focus on front-end proof-of-concepts without having to worry about setting up a back-end to run against.
• History. A JavaScript library for providing graceful fallbacks for older browsers without the History API.
• Google Maps. Use the Google Maps API to integrate with it on your pages.
• Highcharts. A JavaScript library for creating interactive charts and graphs.
• Knockout. A JavaScript library for generating dynamic UI widgets using the Model-View-View Model (MVVM) pattern.
• Backbone. Use the MVC pattern in JavaScript. Also introduces readers to Underscore and JSON2.
• JSONP. JSON with Padding, to get around the "same origin policy" and load data from a server in another domain.
• CouchDB's CouchApps. Easy to use document database and a framework for building and deploying HTML and JavaScripts apps for CouchDB.
• jQuery Mobile. Create one application that'll work on all mobile platforms (iOS, Android, etc.).
• Jekyll. A tool for creating simple blog sites.
• Sass. Extends CSS, provides variables and the ability to reuse code.
• CoffeeScript. A new dialect for writing JavaScript that produces clean, compliant results.
• Git. The version control system of choice for open source systems today. Allows developers to work on multiple versions in parallel.
• Ubuntu. A version of Linux.
• Firebug Lite. For creating a JavaScript debugging console in older browsers. Also, handy for inspecting the rendered HTML, CSS, and the DOM.
• ClickHeat. A PHP script for generating heatmaps to show which parts of your pages are being clicked most often.
• Selenium IDE. A Firefox plug-in for recording and playing back keystrokes and mouse clicks in order to capture UI test cases.
• Cucumber. A tool to extend Selenium tests to non-Firefox browsers and multiple browser versions. Tests are written in text, which promotes behavior-driven development (BDD) and increased stakeholder involvement.
• Jasmine. A JavaScript testing framework that promotes BDD.
• Dropbox. Cloud-based utility for syncing and sharing files across multiple devices.
• VirtualBox. An open source option for creating virtual environments with the ability to save and share environment snapshots.
• Vim. A powerful text editor.
• Apache. The industry's most popular open source web server. The authors explore configuration, setup of Secure Sockets Layer (SSL/HTTPS) and URL rewriting to preserve links.
• Jammit. Combines and compresses JavaScript and CSS files for asset packaging and easy automated deployment.
• Guard. Combines with Jammit to rebuild packaged assets when underlying files are changed.
• Rake. A command-line tool written in Ruby for creating automated tasks. (Many of the recipes require a Ruby environment and the book shows you how to set one up.)

Share this post