Linting for product correctness
Inspired by this tweet thread by Rafael Mendiola, where he describes the idea of creating custom ESLint pliugin to enforce rules that help developers adhere to a design system.
It cuminates in an example
And here’s a good article on how to write custom ESLint plugins:
In this case, a “splash zone” refers to the parts of a system affected by a change to the system. If I edit a component, what other components are affected?
Some devs at Shopify have built a
yarn splash command that determines the splash zone of changes to their component library:
Introducing a new “observability” tool to the @Shopify Polaris React developer workflow: `yarn splash` 💦 (beta), a command-line utility that shows the splash zone of a change across the component library 👩💻— Kaelig (@kaelig) September 13, 2019
Next: looking into ways to integrate it with @github and @storybookjs. pic.twitter.com/Owpq1Ff7wr
Their tools is conveniently open sourced: