There is no question that the Frontend space has exploded in the past decade, having gone from the seemingly novice aspect of web development to a first-class citizen to deeper specialization. At the smaller agency level, being a Frontend engineer typically involves a balancing act between this general and specific knowledge. This makes it all the more important for agency Frontend teams to take a step back and determine some shared principles. We at Four Kitchens did this through late summer and into fall, and here's what we came up with:
Even within Four Kitchens, we build websites and applications using a variety of backend languages and database structures, and this is only a microcosm of the massive diversity in modern web development. Our Frontend team strives to choose and build tools that are portable between backend systems. Not only is this a smart goal internally but also an important deliverable for our clients as well.
It seems to me the Frontend community has spent the past few years trying to find ways to incorporate best practices that have a rich history in backend programming languages. We've realized we too need to be able to build code structures that can scale without brittleness or bloat. For this reason, the Four Kitchens Frontend team has rallied around component-based theming and approaches like BEM syntax. Put simply, we want the UI pieces we build to be as portable as the structure itself - flexible, removable, DRY.
Because we are aiming to build tools that aren't married to backend systems and are modular, this in turn can make them much more approachable. We want to build tools that help a Frontend engineer who works in any language to quickly build logically organized component-based prototypes quickly and with little ramp-up.
Four Kitchens has been devoted to the culture of open source software from the beginning, and we as a Frontend team want to continue that commitment to leveraging and building tools that do the same.
Knowing all this, we are proud to introduce Emulsify - a Pattern Lab prototyping tool and Drupal 8 starterkit theme. Wait - Drupal 8 starterkit you say? What happened to backend agnostic? Well, we still build a lot in Drupal, and the overhead of it being a starterkit theme is tiny and unintrusive to the prototyping process. More on this in the next post.
With these shared values, we knew we had enough of a foundation to build a tool that would both hold us accountable to these values and help instill them as we grow and onboard new developers. We also are excited about the flexibility that this opens up in our process by having a prototyping tool that allows any Frontend engineer with knowledge in any backend system (or none) to focus on building a great UI for a project.
Next in the series, we'll go through the basics of Emulsify - the out-of-the-box strengths to get you prototyping in Pattern Lab and/or creating a Drupal 8 theme quickly.