Graduating from Bootstrap with help from Atomic Design

Fri 2:15 PM - Sagewood Room


Bootstrap defines itself as "... the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web." and it's not wrong. At 105,000 stars, and over 48,000 forks on GitHub, it comes in as the second most popular repository of all time. Bootstrap is an amazing tool, but it's not without it's problems. Have you ever found yourself overriding a default Bootstrap style? Including CSS or JS for components you don't use? Or maybe you're just tired of your website looking like everyone else's? We put up with this technical debt because of the wins Bootstrap provides, but what if we could keep the benefits without all of the headache? Enter Atomic Design.

In this discussion, we will start by exploring the problems Atomic design solves, how it promotes consistency/cohesion, easily traverses from abstract to concrete, and provides methodology for crafting an effective design system. Next we will get our hands dirty by digging into a concrete implementation of an Atomic Design based toolkit. Finally, we will go over resources for further education, how to begin the process of integrating Atomic Design into your process, and next steps. By the end of this talk you will be comfortable with Atomic Design basics and have the knowledge and resources necessary to create your own atomically driven comprehensive component library.