DEV Community


Discussion on: How to organize your components using the Atomic Design

floede profile image
Janus Hasseriis

I'm sorry, but I don't think your example makes sense.

Of course, reusable components are useful. Very much so.
But you are talking about making an entire component only for text elements.

In your post, you describe making a molecule that combines a label with an input. That's fine.
But you gain nothing from having the label as a generic text component with type=label over just writing <label class="input-field__label"/>.
Everything you said about changing the label in one place still applies.

And if you want to have consistent <p>'s you put a standard style for paragraphs in your stylesheet.

Your long example of five different classes implies that a <span> could have other classes. That would be exactly the same with a text component type=span.
So again, it's not actually simpler.

But of course, you should write your code however you see fit :-)