You may have heard of CitizenLab, a Brussels based company focused on digitalizing governance by including residents early and often.
Founded in 2015, they feature survey and polling, participatory budgeting, and idea collection — all things that would allow governments to engage residents in decision making, create collaborative communication, and build trust within the community.
And the next step in this vision was to create an open source version of the product.
Creating an open source product
This was a hard problem to solve because the business needed to support different licensing options which required the ability to combine specific modules to enable more functionality. To do this, a unique technical solution was needed. The backend team of CitizenLab had a plan, but the front-end solution was less clear. Enter madewithlove.
Over a period of six months, our staff engineer guided the team through a complex restructuring which led to an easy-to-implement modular system. To start, several proofs of concept were created to validate the proposed approach, from UI components to lifecycle methods to licensing requirements.
The team fairly quickly jumped from the proof of concept to implementation by creating a list of the modules that needed to be created, ordering the list of modules from most difficult to easiest, and then adapting the solution along the way in an iterative way.
Once the most difficult set of modules was created, the CitizenLab front-end team was ready to join. They were able to become effective quickly, since they were involved in the discussions and planning from the beginning.
Together, we built up the confidence of the CitizenLab front-end engineers via pragmatic experience. Steadily, the team took on more responsibility and it was time for us to switch to coaching mode, helping the team achieve their goal.
The final approach features an ingenious architecture that groups configuration and code into one folder to represent a single module.
Since each module is loosely coupled, the system allows each module to provide specific routes, inject UI elements through outlets, register pages, and run code on lifecycle methods — without polluting the core codebase. And all of this occurs without any hard dependencies.
The introduced techniques are the core of the new system — and it's been open sourced. With our help, the team met their deadline and shipped a solution which will live on for years to come.
The team has the understanding to apply this approach for all new functionality and it has been used for all modules created since April 2021.