rubemfsv / clean-react-app

Set up a modern web app with clean architecture by running one command.
Other
112 stars 35 forks source link

[FEATURE] Separate presentation layer from user interfaces layer #18

Open rubemfsv opened 1 year ago

rubemfsv commented 1 year ago

Description

To enhance the architectural modularity, a clear separation between the presentation and user interfaces is imperative. The presentation layer should encompass all business logic, while the user interface should solely consist of passive screens. An exemplary illustration of this approach can be observed in the following Flutter project: link. The ultimate goal here is to establish a foundational structure that can be extended to other JavaScript frameworks such as Angular and Vue.

Expected Behavior

Today we only have the presentation layer and the expected behavior is to have the system working as expected, but with a more decoupled architecture. image

Additional Information

For a comprehensive understanding of how to implement this project's architectural division, please refer to the following link: Project Architecture.

ayan-joshi commented 1 year ago

Please assign this issue to me I can work on it @rubemfsv

rubemfsv commented 1 year ago

@ayan-joshi sure! Don't forget to ensure commit messages are following the conventional commits and the architecture rules 😄

ayan-joshi commented 1 year ago

@rubemfsv so the main aim of this issue is structuring ?

rubemfsv commented 1 year ago

@ayan-joshi it's not to rename the folder, it's to destructure the presentation layer into two layers, following the principles of clean architecture, as I did in this project: https://github.com/rubemfsv/ForDevApp-Flutter-Clean- Architecture/tree/main/lib

ayan-joshi commented 1 year ago

@ayan-joshi it's not to rename the folder, it's to destructure the presentation layer into two layers, following the principles of clean architecture, as I did in this project: https://github.com/rubemfsv/ForDevApp-Flutter-Clean- Architecture/tree/main/lib

yes I got it and create a pull request have look at it , I took reference from the that flutter - clean repo

rubemfsv commented 1 year ago

@ayan-joshi you just renamed the presentation folder to ui, there is all of the other things missing.

ayan-joshi commented 1 year ago

@ayan-joshi you just renamed the presentation folder to ui, there is all of the other things missing.

@rubemfsv sir I also changed the files as well which should be present in the presentation I kept them there and others were sent to the ui < took referrence from the given repository, for example of dashboard was a part of presentation but login and signup were added to ui

rubemfsv commented 12 months ago

@ayan-joshi I think you didn't understand... The UI layer should have all the files its aready in the presentation layer. And you should create a presentation layer with the business rules, as the flutter approach I put in the description. You should decouple all the rules from the UI, and put them in a presentation, and then injects the business rules in the interface. It's a really big task that needs an understand about design patterns and clean architecture... I recommend you to study the flutter approach to have a clue about it, in that project has a login and signup presentation and UI, that is connected by a presenter. Check if this task makes sense to you, due to its complexity.