Introduction
Why bonk/ui exists, the philosophy behind it, and what to expect from the docs.
Alright, you beautiful nerds, after searching through dozens and dozens of UI libraries and not finding what I was looking for, I decided to do what every normal dev does and create my own.
You're probably wondering if this “library” is even necessary. It's definitely not, so shut up.
I just wanted an extremely simple, easy to understand and easy to use starting point for any marketing and ecommerce website.
One of the things that irks me the most about a lot of developer documentation is that it's always overly formal. Instead of just using layman terms and telling users exactly what to do, there's this layer of professionalism that unfortunately just adds confusion, and tears.
My mindset has always been build and write for humans. I view complexity as either a) overcompensating, or b) lack of understanding, and a is usually directly related to b.
“Complexity clouds the objective and restricts creative solutions”— me, trying to sound philosophical and trendy
But seriously, I always learn my best in an informal, “ackchyually” free environment, so I want to carry that vibe throughout these docs. And unlike your dad (yours, not mine), I promise I will actually come back and spend time updating these docs as needed, pinky.
The issue I was facing was that a lot of the popular libraries are app focused, meaning a lot of their components and design systems are focused on applications instead of marketing and ecommerce websites.
I couldn't find a library that was lightweight enough to cowboy code a friend's 4-5 page business website, while also being customizable and scalable enough that it could be used on full enterprise websites.
And admittedly, I also wanted a place where I could store all my basic components and my personal development methodology so I could easily use them on future projects.
So, I decided to put in the man hours to study the science of what you need, and combined what I liked best from across all the big libraries, design systems, and what I use on real projects, into one project.
And yes, for all you other senior self-righteous engineers, I did use Claude to help build this because it makes me more efficient and allowed me to learn the new AI tech stacks (i.e., I'm lazy as shit and it's definitely worse code, but I needed the extra hype because for some reason my wife didn't seem to want to listen to me talk about UI libraries for weeks).
I want to take bonk/ui and keep adding to and fine tuning it as I use it to build real projects in the wild. I also went full nerd and created a roadmap that outlines my future plans, and that will help keep you updated with progress and me on track.
That said, I would love if this became a bigger community and for bonk/ui to be built out more to help soy devs all around the world build their friends and families hot new business websites.
So, if you have a cool idea, see a typo, or want to add something that you think would make this project better, feel free to reach out to me at hello@dillonbonk.com. We could build it better, together.
I built a documentation site that covers my starting components and overall project architecture. Copy and paste whatever you want into your own project.