Look Who it Was Random video

Styling a design system based on Bootstrap 4 and Web Components by Andres Galante

2,318 views · Published 20 April 2017 · 38:32 · Indexed 27 October 2026

Channel: Devoxx · 2017 · Science & Technology

Watch on YouTube

Based on a real-life example, this live coding session will take developers through the process of architecting and developing a large-scale open source framework based on Bootstrap 4 and Web Components. We will go through the shadowDOM v1 specs, cutting-edge CSS techniques, Brad Frost Atomic Design principles and how to create solid CSS guidelines.

You will also learn why modular CSS is good CSS, and how to structure a large CSS code base in to maximize modularity and maintainability. Also covered is a fast-paced introduction to Web Components and its four standards: HTML Templates, Shadow DOM, Custom elements and HTML Imports. Additionally, we’ll explore what the shadowDOM is and how to create and style it, as well as native CSS variables and mixings.

The audience will leave the room with useful tools that will help them take their front-end development projects to the next level.

Andrés Galante is UX designer and an expert CSS and HTML coder that has been crafting interfaces for more than 15 years.

He's currently part of the Red Hat User Experience Design Team working on the PatternFly Project as Designer and HTML/CSS lead.

More from this channel