Fundamentals of Web Application Development · DRAFTFreeman

Preface

We are, right now, in an incredibly exciting time in the history of software development. The promise of the modern web is a platform which allows us to build rich, robust, accessible, and – hopefully – delightful applications that can reach users wherever they are, on whatever kind of device they’re using, with one codebase. A platform that lets developers update our applications in real-time, continually delivering the best new experiences without the impedance of any walled-garden app store. A platform that is flexible enough to handle complex enterprise needs, simple informational pages, or serve as a medium for cutting-edge experimental art forms.

Compared to even five or ten years ago, the web platform today presents a near-unified front to achieve this vision through setting and implementing standards that allow developers and publishers to reach users wherever they are and offer feature-rich experiences that rival apps native to a given operating system. Progress moves at an ever-increasing speed, and the developer experience along with its web community can be exciting, though quite volatile. For someone just starting to study web development, the noise can be overwhelming.

The nature of the web inherently lets one accomplish a surprising amount without really knowing what they’re doing. Online discussions, tutorials, and sample projects often focus on rote steps of installing helper tools, learning library and framework conventions, or offering drop-in, copy-and-paste patchwork solutions for your software requirements. With these and the corpus of StackOverflow at your fingertips, anyone can hack together a semi-working solution and then brute-force, trial-and-error their way past some of the more mysterious, quirkier parts that seem to cause trouble.

This isn’t inherently bad; on the contrary, the ease of access to building on the web is one of its greatest strengths. In the spirit of providing an open platform where anyone can publish, web browsers put a great deal of work into acting in a forgiving way, with mechanisms that can recover from some kinds of common mistakes – to a certain extent. As developers aspiring to build quality user experiences, we know that understanding the platform and the standards upon which it is built is an essential part of the process.


Fundamentals started in early 2016 as a few separate handouts which I prepared for a series of extracurricular workshops offered to students in my Senior Design classes. Since then, I have continued to iterate on the material and hold the workshop series each semester. It didn’t take long for the written material to grow much more in-depth than is possible to cover in a week of workshops, so I decided to compile all of the material here into one cohesive resource.

In this text we’re not going to focus on any particular libraries or frameworks. Our discussion might seem somewhat simplistic at times; especially when dealing with visual UI components and declarative syntaxes, it might not even feel like we’re “really programming” (depending on your own definition of “programming”). That’s perfectly ok. Many of the code samples we will explore are purposefully simple in order to clearly build up fundamental concepts.

Now, by no means am I telling you to not use frameworks; indeed, they can be great tools to increase productivity, assist in rapid prototyping, and help lay a foundation for consistency in design both visually and architecturally. But achieving proficiency in underlying web standards will allow you to authoritatively wield these tools as you develop rather than being at their mercy. This proficiency will outlive any fancy framework or hot trends that happen to be in vogue this season, and – even if your personal focus is not on the front-end specifically – a background and knowledge of web standards will set a foundation of understanding for the rest of your career.

I know that you have grandiose visions for your projects – lots of widgets and graphs and buttons, oh my! Envisioning the final product may seem daunting, even overwhelming…

You’ll get there. Don’t worry. Enjoy the journey!