Had to pick between atomic design and a component library for a SaaS rebuild

About 6 months ago I started rebuilding a project management tool for a small team. I had two paths: go full Brad Frost atomic design from scratch, or grab something like Material UI and customize it. I went with atomic design because the app had like 60 different page types with weird edge cases. First 3 weeks were brutal - I spent hours naming atoms and molecules. But after that, composition got way faster. My biggest win was when a new feature needed a custom date picker. I just mixed a button atom with a calendar molecule and it worked on the first try. The downside? New devs took about 2 weeks to get the hang of the naming conventions. Has anyone else had to make this call? What made you pick one over the other for your project?

3 comments

3 Comments

the_jason27d ago

Honestly, a custom date picker that worked on the first try? That's wild. I've never had anything like that happen with component libraries.

sullivan.john27d ago

What kind of component library was it? I ask because I've had totally different luck with the big ones depending on which one you pick. Some of them are absolutely broken out of the box and need a ton of tweaking. The ones that "just work" are usually the ones with the smallest feature set in my experience.

wadepalmer12d ago

Wait, you're telling me a custom date picker worked on the first try with atomic design? I've been doing this for years and that's basically unheard of in my book. Usually you get some weird state bug or a CSS issue that takes half a day to untangle. @sullivan.john is totally right about some libraries being broken out of the box too, I had one where the date picker component literally crashed the app on mobile. Your approach sounds like it paid off in a big way for that specific need, but I'm still shook that it just worked like that.