@dan_abramov and here I am in the real world, looking at all these solutions, and thinking "Man, 7 years from now is gonna be nice"

The real world is not like that. For us, building businesses is the important part, not building technologies. We’re building technology in the service of business innovation.

Unless it’s a weekend hack project, or a fun toy for the soul, we don’t get to throw everything away and re-engineer from scratch every 6 months when new libraries become available. We don’t even get to do it every year.

If you can’t make a business case for it, it doesn’t happen.

But we do what we can. We evolve rather than rewrite. Baby step after baby step, our tech stacks become better and more fun to use. They are driven by business needs rather than creature comforts.

We’re highly paid professionals, after all. You wouldn’t expect a race car driver to only drive cars with air conditioning, would you? (Hint: There’s no such thing as AC in race cars. It’s too heavy.)

All that to say that if you’re still using Backbone, you too can use ES6 classes!

/giphy partyhard

Here’s How You Do It

Let’s take a basic Backbone View. It renders as a div element, uses a template, and responds to user events. A click counter, for example.

Cool, huh? Don’t worry if you don’t know what any of that means; you’re just not the target audience for this article.

The quick explanation is that we create a View backed by an anonymous Model. The model holds a count value, we listen for click events on the button element, and we increase the count when they happen. And we listen for change events on the model to decide when to re-render.

If this sounds similar to React, that’s because it is. Backbone was, and still is, very close to React in its core ideas. React just happens to implement them better and make it easier to better architect your app.

We used constructor instead of initialize, and we moved all of the properties into that function. We also used ES6 template strings instead of Handlebars for templating, and we didn’t have to write function even once.

It’s the same amount of code, the same amount of logic, a marginal improvement in styling, and the dubious usefulness of subclassing. Big whoop.

Every other part of your codebase, new or old, can use this View the same as a traditional ES5 Backbone View. Or it can subclass. That part is easier.