Frontend Architecture for Design Systems. A modern blueprint for scalable and sustainable websites

Summer. 5 I read this book with the intriguing title Frontend Architecture for Design Systems and expected a lot from it. The book is written by Micah Godbolt based on his many years of experience as a frontender on a variety of projects. One of the latest projects was to remake RedHat.com, which was famous for learning how to make money from open source solutions, but had not seen much progress on the frontend before. What’s especially gratifying about the book is that the author doesn’t slip into choosing one of the libraries and frameworks and declare him/her a silver bullet, for example, saying that Angular/React/Vue will help you solve all the problems:) In fact, the author is fighting for front-end architecture to be a first-class resident in a software development project. For this purpose, the author highlights 4 The pillar, namely:

• Code. (Sweet trio html, css, javascript)
• Processes (Tools and processes to create effective workflow)
• Testing (Sustainable solutions)
• Documentation.

In the first part of the book, namely in the introduction, the author raises an interesting question of how we got to the current situation, from the emergence of www to the emergence of the concept of front-end architecture. Further, he considers the components of this concept, namely:

• Design ("By designing a system all frontend developers are going to work within, the architect sets a clear vision of what the end product, the code, will look like")
• Planning
• Oversight ("Frontend architecture is never a “set it and forget it” proposition ... A key talent of a frontend architect is the ability to continually make needed adjustments")

The introductory part concludes with a thought on the role of the front-line architect: “Without the early input of a frontend architect, projects run the risk of having to choose between reworking designs, platform, or infra‐ structure and telling the frontend developers to make do"

The second part contains chapters on how to structure code, namely write html, css and javascript. But it's funny that this is the first time I've ever seen an exposition of the principle of sole responsibility. (Single Responsibility Principle) in the shift to the front, namely in the chapter where the rules for working with CSS were considered:) The following part relates to process. It’s about old and new workflow. CI/CD in general and asset assembly in particular are also discussed. In chapter 10, where the Red Hat process is discussed, where the schema-driven design system is disclosed, which includes: JSON schema - Component scheme Template file - component template Sass partial - component styles Visual regression tests for visual regression Testing data - test data Documentation - documentation of the component Documentation data - data for documentation In general, this schema-driven design system approach is painfully familiar to me:) And from experience, I can say that it works much better than the alternatives.

In the part relating to testing considered:

• Unit tests
• performance tests
• visual regress testing Integration of all this into the Red Hat testing process:)

The documentation part focuses on how to organize a modular system design set of components available for reuse. Brad Frost's Atomic Design Principles (It's a poor name for the standard component approach from an author who doesn't understand chemistry or biology.).

As a result, the book is really good and well reveals the approach to rendering front-facing display seven years ago:) But the book clearly falls short of telling you about the architecture of the entire application and if you make an isomorphic application, you're also responsible for backend. (finely)This book is not enough for you.

#Architecture #Software #SoftwareArchitecture #SoftwareDevelopment #Engineering