Blocks & Triangles: Front-end Architecture in the Gutenberg Era

As WordPress moves towards a future where “everything is a block,” we must adopt more scalable, modular approaches to CSS, JavaScript, and HTML templates. In this talk, we will pair the concept of Gutenberg Blocks with a CSS methodology known as Inverted Triangle CSS (ITCSS) to create a workflow that emphasizes modularity, portability, and reuse. The result is a DRY code base capable of serving up shortcodes, widgets, and, of course, blocks wherever users need them. As a practitioner of ITCSS for several years, I have managed its implementation in several custom WordPress themes as a freelancer and most recently in my role as a plugin developer contributing to the WP Business Reviews and GiveWP plugins. I am also proud to have pitched an implementation of ITCSS to the team behind the Underscores starter theme, where it is currently under consideration. These experiences in custom theme and plugin development, as well as my ongoing involvement in WordPress community projects, will inform the overall approach to front-end architecture throughout this talk. While scalability and modularity have always been important concepts in WordPress, they are becoming even more significant on the road to WordPress 5.0. With a solid understanding of these “Blocks & Triangles,” attendees will leave WordCamp San Diego empowered to implement change in their own teams and software.

Speaker

WordCamp San Diego 2018 is over. Check out the next edition!