Wheelroom

Modelberry is the successor of Wheelroom. The original Wheelroom repository is still online as is an archived copy.

Evolving models

Wheelroom was founded in 2018 with the idea that content models evolve as a code base evolves and that models should be kept in the same repository as the code base.

React UI library

Early 2020 a React UI library was developed around the Wheelroom command line utility. The Wheelroom boilerplate based on GatsbyJs combined content from Contentful with the React UI library into a marketing website on Netlify in a matter of minutes.

Success

Setting up a new site in a matter of minutes together with easy customization and universal UI library made a marketing site based on Wheelroom an easy sell.

Where the Wheelroom command line utility was solid, the UI library had a number of drawbacks.

UI library drawbacks

The UI library was build around a React clone of styled system. This design system served well for a while but eventually evolved into the Any Element.

The biggest problem with the way styled system was used were the style trees. A style tree was a Wheelroom concept which allowed styling a tree of components.

First of all it was hard to maintain the tree typings. Extending them with new functionality was too complicated. The second problem was that the trees were not as intuitive as they could be. Over time it became hard to remember which style was defined where.

New UI library

In 2021 a new UI library was developed with the lessons learned. This library uses clear component scopes and a component interface that prevents breaking changes. The library was separated from the command line utility.

Command line utility

The Wheelroom command line utility uses a javascript object for defining the content models. The content models could be pushed to Contentful and were used to generate typescript definitions and graphql queries.

This worked well (as it still does), but there was a better way.

Modelberry factory

Instead of generating typescript from a javascript object that defined the content models, typescript now is at the core.

A new command line utility was born and was named 'Modelberry factory'.

Content models are defined in typescript. TSDoc annotations are used to add additional details to the models. This way models can be pushed to Contentful. The other way around appeared easy as well. Pushing and pulling content was an obvious next step.