This blog post is worth reading. I wonder how your guys deal with live components and where they are placed in the atomic design?

Thanks @zhangzhen!

I wonder how your guys deal with live components and where they are placed in the atomic design?

Great question - we don’t use live components yet. Assuming they are more complex than the “static” ones, I would create them as organisms with the prefix live_.

I’m glad this resurfaced.

I loved the defdelegate approach to avoid cluttering up the Organism.

Will implement this in my own project, that is just starting out.

Have you considered using Storybook?

I am bit scared of business logic seeping into the components over time, so I was thinking of separating components as well as adding storybook to avoid those pitfalls.

Plus whenever we have to change something in a component, we won’t have to jump through our UI to make it happen.

Thanks @derpycoder!

I’m not a big fan of storybook (the react one), so I didn’t consider using phoenix_storybook. I prefere https://patternlab.io/ instead. Thanks for the suggestion, maybe I’ll test it in the future and try to connect everything.

Function components are implemented in the form of functions that take the assigns param, which means one module defines multiple function components. Live components are implemented in the form of modules, which means one module defines only one live component. Can you give some details about how you create them as organisms? It would be better if you could give me one example.