MVC Architecture – Explained in simple terms
SAPUI5 Applications are designed on MVC Architecture. In current times, It is prominently used in all web technologies.
M = Model
Model contains business data coming from SAP system
V = View
A view represents your Page. For Each page in your applications, design separate View
C = Controller
Events handling is captured here. Clicking on Button, mouse hover etc. are events.
For each View, a separate controller is to be coded. Both View and Controller usually have the same name to easily identify the pair.
Above the screen is a Page or ‘View’, which has many elements like Headers, search bar, buttons etc. The data is coming from the model, while events will be handled by Controller.
SAPUI5 supports following languages to code Views:
- XML (<viewname>.view.xml)
- HTML (<viewname>.view.html)
- JSON (<viewname>.view.json)
And Finally, Model are of four types
- ODATA Model
It is used to consume OData Services
It is used when data coming from Source System in XML format
3. JSON Model
It is used when data coming from Source System in JSON format. Also, Mock-server is also based on this model
4. Resource Model
It is used to make your application in multiple languages.
We will come across all the models in detail in upcoming tutorials
Default Structure Required Structure
Default Structure, will be available whenever you create a new project. You have to manually create subfolders within “Web Content” and place all respective files. Please note that views and controllers are placed in separate folders, though they have the same name. Keep ‘CSS’ & ‘Model’ folders empty as of now, we will put required files in them in later tutorials.
Share this Tutorial with your colleagues using following Social Platforms and comment below with your question, thoughts and suggestions.