Nathan Koch Chicago web developer

My experience with JavaScript

Background

I've been dabbling in the technologies of the Web since '97, so I've been aware of JavaScript and the concept of client-side scripting for a very long time. Like a lot of developers, I didn't really take it seriously until the advent of Ajax as a technology and buzzword. In 2007 I renewed my efforts to seriously learn JavaScript, and since then, as a front-end developer at Arc Worldwide, I've been using it extensively on every project.

Spring 2008 - Purina dog breed selector

In early 2008 I began on a project that pushed my then-still-limited JavaScript skills far out of my comfort zone. The Purina dog breed selector was a tool to allow users to see the dog breeds that fit them the best, based on a set of criteria on the left.

The breed selector used a set of form inputs on the left to drive a list of dogs appearing on the right in real time. Whenever those fields changed, I gathered together all the data from the form, serialized it, and sent JSON over the wire as a GET request to the "partial" (.NET Webforms doesn't really has partials as they're known by modern frameworks) on the left.

That core functionality was my first exposure to JSON, or to building my own "dictionary" as an object literal in JavaScript. There were a lot of ancillary JavaScript driven features floating around as well, including various tooltips, pop-up windows, and hide-show functionality.

Fall 2008 - Ajax Experience and Amana Color

Later that year my emerging interesting in being Arc's "JavaScript guy" let to a series of scripting related projects. I was involved in consulting on a number of projects involving tooltips, slideshows, and modal windows - all presentational, but still new to a team that was accustomed to flat, brochure-style sites.

That fall I went attended the Ajax Experience in Boston, and upon returning pushed to amend our standards and move our shop from Prototype and Scriptaculous to jQuery and jQuery UI.

Several months later we launched Amana Color, a microsite allowing users to drag and drop their preferred prospective fridge designs in any order. I worked with jQuery UI extensively to handle tracking fridge positions and sending an array of fridge ID's to the back-end.

Spring and Summer 2009 - Beneful WagWorld

By 2009 I had some of the strongest JavaScript skills in the building, so it was no suprise that when WagWorld came along, a heavy-duty Google Maps driven web application, I was involved in the project. In order to aid in maintenance, I used a series of classes to wrap up functionality and data into discrete packages using John Resig's Class.js library. I also created a custom client-side validation scheme that was used site-wide. This architecture still required a lot of cross communication, so I used jQuery custom events to allow these objects to communicate with each other. WagWorld was a massive project, and I alternated between writing the majority of the functional/data driven JS, delegating the presentation scripting code, and managing a team of front-end developers focusing on the static build-out.

Late 2009 and 2010 - Arc's internal JavaScript consultant

Still at Arc, my role only continued to shift toward JavaScript. For more than I year I've consulted on or took charge of dozens of projects, lending my expertise in scripting and back-end integration. I wrote a number of custom internal jQuery plugins, worked with back-end developers on JSON input and output, and mentored a series of front-end developers in JavaScript best practices (and, that there is JavaScript outside of jQuery!)

Increasingly, from all of these different approaches, I believe that the best way to write JavaScript is leveraging its own object-oriented nature. It took me a little while to get my head around prototypal inheritance, but now I work, as much as possible, with "virtual" datastructures in code, and save jQuery for my purely view code.