The Problem with Traditional Approaches
The traditional workflow to create web applications using a framework like Drupal is to start with site building and back-end work, then implement the theme on a markup. This workflow is not as simple and clean as it could be, which complicates the front-end work and maintenance.
This approach makes it difficult for back-end and front-end teams to work in parallel from the start, since front-end developers must wait for the feature to be built before drilling down into the sea of divs to target the right elements often with custom selectors, making it difficult to keep it DRY. Styles are not isolated, so the risk of some overriding others is high and continues to get more complicated over time. This is even more likely if the team doesn’t carefully follow a methodology like BEM (Block, Element, Modifier).
Another difficulty with this approach is that project managers, clients, and QA members are forced to wait until the project is getting very close to completion to start their reviews. Such a delay puts unnecessary stress on every member of the team and the client.
The Solution: Component-Driven Development
Component-driven development helps solve these problems, allowing every part of a web application to be defined and designed independently. Therefore, teams are generating a style guide from the very beginning.
Additionally, this approach provides a good experience for back-end developers. They know exactly what markup structure is needed to generate to bring each component to life, and they can immediately view modifications made to features.
A component-driven development approach is becoming more recognized as a best practice among development teams. On the client-side, clients will love to see and interact with a living style guide early in the initiative that can be consistently modified and improved. Implementing a component-driven development workflow can bring significant improvements to all aspects of your development lifecycle.