(learning to write) Beautiful Code

Kathy Sierra of Creating Passionate Users (good reading on sociological aspects of the web, design and programming) just wrote a good article on code beauty and elegance, and by a few pleasant coincidences, I recently happened upon a most excellent example of this: FireBug. It's not just the great and beautiful tool webside javascript programming has been aching for since the dawn of the DOM and XMLHttpRequest, it is also an excellent piece of engineering beauty under the hood.

Initial note: it's not strictly necessary any more to dig in the code to take in the full feature set of the tool or to understand what to do how, as the FireBug homepage now sports lots of screenshots, some docs, a good, short FAQ and a forum. But it's worth doing anyway, to learn about how to write beautiful code, and that Firefox extensions do not have to be a contract between RDF, XUL, XML and javascript written in blood on stained pieces of crumbling parchment. (I admit my first encounter with extension writing for Firefox did not leave me itching for more of the same, but with Greasemonkey, I have fortunately never since felt the need to. :-)

Anyway, let's have that peek under the hood -- unzip the xpi (first changing the extension to "zip" if you need to), unzip chrome/firebug.jar (ditto), and browse through its content/firebug directory, taking in the code. Well structured, easily readable, accentuating logical code units with empty lines here and there, and always following javascript idioms. Code written to be read and maintained by humans.

For instance, it's probably not a coincidence that FireBug does not contain a single switch() block -- if statements make code readable locally, never breaking up the logic flow into half a comparison a page up and the other half dangling on its own by the case statement.

Learning how to write readable and maintainable code is not something you are likely to pick up on from books or by churning away code on your own, unless you are really lucky and give it endless amounts of time and practice. Paying attention to what your elders do, observing their good habits, noting what works well and why remains the best school to quickly get into good habits yourself and getting more attuned to good style and inclined to follow it yourself, short of working together with them side by side on the same code base. If you don't socialize much with elder peers and their code, occasionally do take your time to at least browse elegant code to pick up on good ideas and development patterns. It's well worth the time investment.

Be curious, yet aware that most familiar names in the skies are busy people who rarely have the time to explain their code to you. Build a network of peers, share and discuss the things you learn among yourselves, perhaps even publicly, or just per instant messenger. And skim whatever good resources you find on subject matter that speaks to you, in the blog world and elsewhere. Seek out people and projects who do good things and track their progress; most of the best resources are neither A nor B list bloggers.

Categories:

• code
• beauty
• design
• learning