Learning by Building, Version by Version
Back in November and December of last year, I had an awesome opportunity to host a two-part Web Development workshop with Emily Serven, sponsored by the UConn Stamford Digital Media & Design Club.
The workshop was designed to be an intro to the fundamentals of website design and development for relative novices (with a basic understanding of web and design but no coding background or applied work).
In the weeks before the first workshop, we had the chance to really take an introspective deep dive on our own web journey, from the early days of HTML-only personal sites built with tables (🤮) to our latest work on full-fledged enterprise SaaS applications.
It struck me then that I hadn't learned the core concepts of web at all, and especially not via the route of traditional educational strategy. And almost all developers I know are in the same boat.
There were no "Fundamentals of Web Design 101" classes, or "Core Concepts of HTML, CSS, & Javascript" seminars. What I do remember, however, are the specific projects that I completed along the way and, in particular, the "features" that each of these projects showcased, which became invaluable building blocks for future endeavours.
These features that were added with each new project or each new version were the driving force of our learning experience. The education was achieved through the completion of a goal, and not through the comprehension of underlying theory with little real-world application.
Each project began with an idea, a vision for what we wanted to build. We almost always didn't fully know how to do it, but we knew what we wanted. And that goal or vision was the motivation for our education and exploration.
The best and fastest way to learn anything seems to be to simply (or not-so) learn by building, and using the multitude of awesome resources online to slowly work towards creating your vision, version by version.
It was with this introspection and realization that Emily and I formulated the two-part workshop. The goal was to give our attendees the catalyst to build, and the framework for which to learn by versioning (and achieving design or feature goals while learning along the way).
The first day of the workshop was Version 1: a "Hello World" index page with an unordered list, three block images, linked stylesheets, and proper site file structure setup.
It didn't look pretty, but it got the job done. When Version 1 was complete, attendees were able to grasp the core fundamentals of a website without ever being taught the core fundamentals of a website. They had a goal (to build a site to the specs of Version 1), and were guided through the steps involved in achieving that goal.
The second day followed a similar pattern with Version 2. This time, the specs of Version 2 were a horizontal navigation menu (from Version 1's unordered list), an inline, fully responsive image gallery (from Version 1's block images), and general style updates to make the site look great.
In similar fashion, attendees worked through the process of building out their next version of their site, all while gaining a greater understanding of web development and troubleshooting as a whole.
At the end of the workshop, attendees were left with their own website Version 2.0, on which they could continue to learn by experimentation.
Not only did it provide fundamental baseline understanding of website development, but it also served as a primer for real-world agile software development (in which application versions or features are built and delivered frequently, and with continuous iteration).
All this is nothing new. It's been clear for years that traditional education models don't work quite the same in the software development world as they do in Science, Medical, or Law tracks.
In learning web development, it's much faster to learn by building your vision, version by version, for what you want to create. It's incredibly frustrating at times, but almost always extraordinarily rewarding. And when in doubt, just Google it.