Click here to Skip to main content
15,881,898 members
Articles / Web Development / ASP.NET

Using MVC to Understand ASP.NET, iOS, Android and Hybrid Development

Rate me:
Please Sign up or sign in to vote.
4.27/5 (5 votes)
20 Nov 2013CPOL4 min read 30.4K   24   2
Using MVC to understand ASP.NET, iOS, Android and Hybrid Development

Introduction

Model–view–controller (MVC) is a software architecture pattern which separates the representation of information from the user's interaction with it.[1][2] The model consists of application data, business rules, logic, and functions. A view can be any output representation of data, such as a chart or a diagram. Multiple views of the same data are possible, such as a bar chart for management and a tabular view for accountants. The controller mediates input, converting it to commands for the model or view.

Image 1

MVC Design Rules

I am using RGB to present MVC. Different colors have different meaning or design rules for the different element.

  • Blue stands for intelligence, which means the controller should be very smart.
  • Red stands for critical, which means Model is the kernel of the system.
  • Green stands for friendly, which means View should be friendly to users.
Image 2

ASP.NET and MVC

First of all, we know there is a term ‘Web Form’ we should mention and it looks like:

Image 3

Web Forms are using the PostBack to handle the data directly and not central controller.

So, we introduce the MVC to handle all the interaction with users.

Image 4

From the above graph, we can see the View has been showed to the customer. There is something special for the Website system. At a specific moment, there are two copies of views: one is at the server side and the other is located at the client side.

Image 5

Yes, maybe we can do something at the client side, as we have the View. Let’s make some magic with AJAX. We are using the AJAX to build a controller to bridge the data at the server side and View we have.

Image 6

With this role, the server has changed it from a webpage server to Web Service and the difference is that it provides the data not the page now.

Although the controller and content of view are in the same file, they can be identified with different content. The controller is enclosed by <script></script> and the content is by the html definition, like <body></body>.

One thing I would like to mention is that there is the other way to isolate the View from the Model, which is MVVM (knockoutJS is a typical one). So, what the difference is Controller knows everything of the View, while ViewModel knows nothing about the View and it just provides the objects and methods to wait for the View to bind.

Image 7

Nevertheless, MVVM is a really good idea for the markup language style View, like .xaml for the WPF.

WPF and MVVM

Based on previous analysis, we can easily get the architecture of WPF with Web Service which is as follows:

Image 8

And a pure local one looks like below:

Image 9

Model Evolution

At the very beginning, in ASP.NET, we used DataSet to keep the data we retrieved from the SQL Server by Query and then we encapsulated the DataSet into an object.

Image 10

To simply this, we invent the ORM (Object Relational Mapping) and we have Entity Framework which maps the data in database to the object directly.

Image 11

Furthermore, we can design the Model first, or Database first, even the code first with the Entity Framework.

MVC and Hybrid Application

Let’s go a little back to the MVVM and WPF. In that case, the View and ViewModel are in the client side. With similar condition, when the View and Controller are in client side, specifically the client side of a mobile device, we call it the Hybrid Application. We can use Phonegap to develop the cross-platform hybrid application. But the kernel of it is still the markup language style view and JavaScript Controller. Another thing different is that it doesn’t use the browser and it is using the webkit instead.

Image 12

Controller Evolution – Soap Style vs. REST Style

  • Soap Style – Request is one whole word and it is an action
  • REST Style – GET, PUT, POST, DELETE have the different real meaning.
    • GET: Query
    • PUT: Create
    • POST: Update
    • Delete: Delete

Request has changed to a resource.

Image 13

iOS and MVC

iOS is a very typical MVC implementation which looks like below. In iOS development, we should make sure Model and View are 100 percent isolated.

Image 14

Android and MVC

There is not a clear definition of activity, I would like to treat it as a big controller and it contains a number of controllers, here are adapters when it comes to the data. One typical adapter is the cursor adapter when we load the data from a db for a listview.

Image 15

In brief, MVC is a cutting-edge term and it links the ASP.NET, iOS, Android and Hybrid development together, which makes me easily shift from one developer role to the other. All in all, I hope this paper can help you.

If you have any questions, feel free to contact me by email at maxchen666@gmail.com.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer
Australia Australia
an ASP.NET, iOS, Android and Hybrid Developer

Comments and Discussions

 
QuestionHai Pin
sheik Md8-Dec-13 17:43
sheik Md8-Dec-13 17:43 
QuestionSequel(s) to this article? Pin
thatraja3-Dec-13 23:01
professionalthatraja3-Dec-13 23:01 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.