Many small projects grow organically, which can later cause architectural headaches. I came across such a headache when building the icon package in a UI library. Let me show you how SVG's use, em units, and import.meta can help you manage your icons.
Improve your relationship with your designers by automating your Storybook admin. We'll run through how to automatically catalog all the icons used in your frontend codebase.
We'll take off the training wheels and build a rule for a real-life web component. Doing so will help consumers remember the best ways to use the component, and better contribute to an accesssible web.
Build ESLint rules to ensure consumers of your design system adhere to your design system's (and the web's) best practices.
Learn how ESLint rules can help enforce your design system's best practices by understanding how ESLint parses your JS into an AST and traverses it using the Visitor pattern.
Error messaging plays an important role in making your user-facing products as delightful as possible. Having useful error messages can go a long way toward making a frustrating scenario for an end-user as pleasant as possible.
So you've created your UI library and shared it with the big wide world. What's next? This article wraps up our journey and offers some tips on where to go from here. I hope you've enjoyed the ride!
Good documentation is a cornerstone of great developer experience, and great developer experience will encourage developers to stick with your library. This article offers different documentation options (from the very simple, to the more involved) to help you get your library well-documented and set up for success.
Versioning and publishing can feel intimidating. At least it does for me. Getting it right means you deliver well-communicated updates that work with your end-users workflow. Getting it wrong can lead to developer headache and a loss of end-user trust. This article presents some questions for you to help you pick your versioning strategy, along with some tools to help you publish confidently.
Your component library is taking shape and you're getting close to publishing! Can you confidently say that you won't ship broken behaviour and that your components work across browsers? If you said no, it's time to consider your testing strategy. If you said yes, then it's still time to consider your testing strategy. Don't add testing only when you need to.
If you haven't chosen a starter kit, you'll need to get your development environment up and running. This article will present a handful of common setups to help you quickly develop, (maybe) build, and (maybe) bundle your component library.
Choosing a library for building web components can help you deliver quickly. It's just... there are a few dozen libraries to pick from. Don't worry, this article will help you think critically about which library (if any) is most appropriate for your UI library.
Finding the right tools to manage your monorepo isn't a new problem, but it's still important to pick the right ones. This article runs through a handful of different tools, to help you pick the ones you need to make your development experience a pleasant one.
Understanding how you expect your end-users to consume your library can influence how your structure your repo. This article presents some questions to get you considering how best to scaffold your repo.
When creating your UI library, you'll be faced with tough dilemmas at every step of the journey. This article series will help you navigate the many choices you'll need to make. These choices cover areas like repo scaffolding, choosing a framework, testing, versioning, publishing, and documentation. By the end, you'll have set the foundations for a robust, and accessible, UI component library.
Get notified whenever I post and get it sent straight to your inbox
I promise I won't send spam 😇. You can unsubscribe at any time.