Mannequin is an open source tool that lets you work on your website's templates in an isolated way. In practice, that means that Mannequin provides a live development server to show you the output of one template at a time, and a way to pump data (variables) into that template so you can see how it will look in the "real world". Mannequin currently supports using HTML files, Twig templates, and Drupal Twig templates as components, but we would love to extend support to other frameworks and content management systems in the future.
Where it came from
In 2016, we (Last Call Media) started moving toward component theming as a way to improve the overall quality of the sites we build. You can read all about our journey here, but the things we wanted to achieve were:
- Promote reuse and organization within our projects
- Separate the frontend work from the backend, so we could do both at once
- Simplify our workflow so we could codify and repeat it
When we investigated the tools available for component theming in Drupal, a lot of them checked the first two boxes, but all of them fell a little short on the "simplicity" requirement. So Mannequin was born as a way to bring simplicity to the component theming workflow. You can read more about our reasoning in this blog post.
Mannequin's Philosophy
Mannequin is not an opinionated tool. It is intended to work with your templates wherever they are, in a way that more or less mirrors how your production application will use them. It doesn't care what CSS methodology you use, where your templates live, or what terminology you use to group them.
There is a downside to being unopinionated; it's harder to give people a prescriptive, step by step workflow to follow when they're getting started. We've tried hard to write documentation that makes sense and suggests a way to work, but if you run into any questions or trouble along the way, feel free to reach out in the issue queue.
Credits
We would be remiss if we didn't mention Pattern Lab as our primary influence. Pattern Lab, along with Brad Frost's incredible Atomic Design book, paved the way for tools like Mannequin, and helped form the practice of component theming in the industry.