Article: Clean Architecture on Frontend

Here is a great article talking about Clean Architecture on the Frontend. It even has a sample repository demonstrating the concepts talked about. I have used some of these strategies in past workplaces with success, so highly recommend it.



There are tons of takeaways, here are a few I liked:

Designing is fundamentally about taking things apart... in such a way that they can be put back together. ...Separating things into things that can be composed that's what design is.

- Rich Hickey

Adapters are a great way to lower the coupling between our code and the code of third-party services. Low coupling reduces needs to change one module when others are changed.

Don't use inheritance, even if it's called “extension”. Even if it looks like the interface is really inherited. Even if it looks like “well, there's clearly a hierarchy here”. Just wait.

The code can be split in folders not “by layers” but “by features”. One feature would be a piece of the pie from the schematic below. This structure is even more preferable, because it allows you to deploy certain features separately, which is often useful.

There may be too many questions and too many answers, because neither the team nor the stakeholders know yet how the system should actually behave. If there are only assumptions, you can find yourself in an analysis paralysis.