Learn JavaScript by Backwards Design

The focus on learning syntax of a programming language is one of my fundamental problems with the method that programming is often taught. I’m going to talk about an approach that works backwards from the desired result. This approach describes how to structure a course based not on the content you want to cover but on understanding the big questions and concepts behind the content. It’s called backwards design and is deeply explained in the book Understanding by Design.

The process starts by identifying what’s most worth understanding in the topic. That word–understanding–is loaded with meaning but also with ambiguity. In backwards design, you ask, “What does it mean to understand something?”, “What are the big ideas?”, “What are the essential questions?”.

Clarifying the answers to these questions uncover the key aspects, i.e., the blocks that serve as a foundation for building more knowledge on your own.

With technology, it seems that it’s always changing every day. Well, the specific implementations, the specific tools that we use do change very quickly. But the core components are quite solid.

One of the big differences, supposedly, of formal institutional-based education and an online course developed by someone on the Internet is the method of assessing the level of understanding. A lot of online courses give you the material and you’re own your own, often stuck in tutorial hell without feedback or further guidance. But I’m very curious as to how online courses can develop more engagement with students, more feedback, and more assessment that helps the students learn. Ultimately, that leads to more credibility for online learning and, perhaps, eventually, can resolve the biggest difference between institutional-based education and ad hoc individualized learning: credentials. Literally, the degree: the documentation that certifies you have learned something (supposedly).

Quality assessment is not about knowing syntax and facts but for you to demonstrate that you can apply what you have learned in a new situation. Can you go from the step-by-step instructions of a tutorial, and then implement variations of those concepts in a project of your own?

Actually, a person’s portfolio is the true measure of what one has learned.

A portfolio may not be only a series of projects but also a range of multimodal explanations that demonstrate you have absorbed the material and possess the capacity to remix it in creative ways. This multimodal material in a portfolio could be videos where you are explaining technology, could be websites that showcase your work, audio tracks that feature you discussing the concepts in a podcast, slides from a presentation, an essay exploring the limitations or effectiveness of a protocol. Your portfolio gathers selected artifacts of the knowledge you have constructed.

Too often in teaching, we have our learning outcomes, then set those aside and start figuring out how to slot copious amounts of content into those outcomes. With backwards design, you stay focused not on content but what leads to transferrable skills and what learning activities engages the student in demonstrating those skills.

For instance, a student learning JavaScript does not necessarily need to know how to flatMap an array. That comes later when the student realizes the need for it in a project. A student needs to have a solid grasp of foundational concepts like arrays and functions before struggling with more specific tasks. If the foundational concepts are solid, then the student should be able to figure out how to apply more complex features. Or, maybe the student will need to take a more advanced course, but you got to have a solid foundation before you start on the foundation of the next level.

The lens through which I view web technologies is always through storytelling.

It could be storytelling proper, as through interactive fiction, or it could be through data visualization, or branding, or ebooks, or interactive documentaries, or online games, or even through user experience. For me, personally, storytelling is a process that excites me. It’s my motivation for coding. So, when I teach beginning JavaScript, I teach it in the style of JavaScript for Interactive Storytelling. And I always put it in the context of the web.

That’s just me. That’s my thing. Other teachers take different approaches and that’s okay.

As an overarching structure, one can fall back to the reliable questions: who? what? where? when? why? and how?

I often teach journalism students, so that’s a familiar organizing principle to them. But I rearrange the order and expand the questions:

  • Why does the web exist?
  • Where does it come from? Where is it going?
  • Who created the web? Who develops websites? Who determines the future of the web?
  • When was the web created? When did it evolve into what it is today? When will the next major change take place on the web?
  • What will the web be like in 10 years, in 20 years, in 30 years? What was it like 10, 20, 30 years ago?

And wrapping it all together comes the how:

  • How do you create a website?
  • How do you create an interactive documentary on the web?
  • How do you create an online business?
  • How did this whole Internet thing all come about?

Unpacking all those questions is the life work of many people. These are the big ideas, the essential questions that drive web development at a conceptual level. There’s an entire other set of big ideas and questions that drive web development at a technical level. In a beginning course, students get a taste of those technical issues, and they gather enough skills to start their journey through technology by taking whatever path they want to further explore after the course.

For each of those questions, I’m going to breakdown the forms of understanding that identifies and prioritizes the type of content, exercises, and assignments needed in a course on web programming for beginners.