loading...
Cover image for Modular Front-end development
Blue Turtle

Modular Front-end development

islam profile image Islam Sayed ・1 min read

πŸŽ™ I am making a research for an article about modular approach in Front-end development πŸ’». I'd be thankful if anyone could help me with good resources. πŸ’š

Blue Turtle

Web Development Blog

Discussion

pic
Editor guide
 

Not exactly Modular in terms of making project-independent modules, but possibly some thoughts could be helpful in your research: hackernoon.com/fractal-a-react-app...

 

Thank you, Martin ❀️

 

I don't know about your state management or tech stack but this is the approach we took for a really big react-redux application: dev.to/jovidecroock/modular-redux-...

Essentially when evaluating an approach you have to aim at achieving a good level of cohesion and close to no coupling between modules (except your normal commons like your Button abstraction,...).

Logical cohesion is what we strived for in the article I mentioned earlier, at the moment we group everything for example like this:

Our project has objective so we have a folder "project" with a few submodules and one of those is objectives.

This makes it so that we can lazy load modules and their data requirements, this also implies that for example an npm module we only use in module x won't be required initially until we load in module x.

 
 

This calls for WebComponents!
=> webcomponents.org

 

If you're looking for standard (ie zero dependency) Web Components written in vanilla JS, check out.

github.com/vanillawc