DEV Community

Cover image for VIPER Architecture
Sazardev
Sazardev

Posted on

VIPER Architecture

¿You're getting struggle writing your code for Mobile Applications? Let me present you with the VIPER Architecture, and why this is the BEST for mobile development.

V -> View
I -> Interactor
P -> Presenter
E -> Entity
R -> Router

View

The view layer handles everything related to what the user sees on his screen. This must be something like the Screen or the componentes in your application.

Interactor

Here is where you got the bussines logic of your application. Acts like a mediator between the controller of the screens that see our users and the data from an API, Database. But what is bussines logic? Here is EVERIYTHING related from the usability of our applications, this includes Data Transformation, Data Handling, Session Handling, and a large etc.

Just keep in mind that in the interactor you will put everything that includes an ACTION from the user, and you need to do the logic to correctly present the expected response to the user.

Presenter

We already got the bussines logic from the Interactor, so, what's Presenter? The presenter also has bussines logic, but he is the MEDIATOR between the View and Interactor, this was explained in the Interactor, but this layer is the responsibly to communicate with the UI. The classic flow from the Presenter is something like:

(View) User tap to "Posts" screen
(Presenter) Receive the action and start charging the loading component to the View, also start requesting to the Interactor for the data requested.
(Interactor) Talk to the data source and send it back to the Presenter.
(Presenter) Receive and clean the data and send it to the View
(View) The user is happy to see Karen posts.

Entity

Entities are the data models that stand for the application bussines object, can be something like User, Post, Comments. Here is where we represent the object data that will be used for every process in our VIPER Architecture. Also, it is important to keep in mind to not do anything too robust and too flexible, Entity is the core of our app, but like everything, our core needs to be adaptative to every situation.

Router

For some people this is not the most important, but for the user is MUST HAVE because they want a really powerful system of navigation, they want to have a powerful share and they friend go to the exact path they share, in mobile is a MUST you can't ignore this layer because you need to have to give an excellent experience.

But well, too much presentation, but what do the Router Layer? The router manages navigation between screens or modules, also manages the presentation and dismissing views or errors in the view, also this layer protects routes if is required (Like auth session), check the parameters routers. And most important, this is the most decoupled layer but the most responsable for the other layers.

Conclusion

And that is everything about VIPER Architecture, in personal I LOVE this architecture because I am and Flutter/Android developer, if you are a mobile developer consider using this Architecture above the Clean Architecture because is most simple, intuitive, and adaptable for the most Mobile Development cases.

Hope you enjoy reading and learn something new, please tell me what do you think about this architecture and why you will use it or not use it.

Thanks for reading!

Top comments (0)