Categories > UML



How simple can create a Data-Driven Application by using ASP.NET MVC?

Posted on October 17th, 2013 By Danial Javanmardi


There have been many different ways to organize the code for a software application. This code could be in C#, PHP, Objective-C, JavaScript, CSS and HTML. MVC is a three layer architecture. In simple words, an architecture defines the structure and interactions among structural elements. Three layer architecture splits up to user interface, Process logic, and data storage.

Model View Controller (MVC)

MVC is the abbreviation of Model View Controller. The View is the user interface, the Model is the data storage, and the Controller is the process logic of the application. The Model and View never talk to each other directly. The Controller manages any interaction between them. It is as simple as this.

MVC Invention

MVC was invented by Professor Trygve Reenskaug in the 70′s. He made the first implementation and wrote the original MVC note at Xerox PARC in 1978. “The essential purpose of MVC is to bridge the gap between the human user’s mental model and the digital model that exists in the computer. It was conceived as a general solution to the problem of users controlling a large and complex data set.”(Trygve Reenskaug)

Today’s MVC

1-Cocoa Touch implements in MVC by Apple. Cocoa Touch is a UI framework for building software programs to run on the iOS operating system (for the iPhone, iPod Touch, and iPad). Cocoa Touch is written in the Objective-C language.

2-All outstanding PHP frameworks implement in MVC. Such as CodeIgniter, CakePHP, Yii and FuelPHP.

3-Xamarin implements in MVC. Xamarin is a cross-platform development for iOS, Android, Mac and Windows apps in C#.

4-Microsoft launched the first release of MVC on Dec 2007.

Personally, I used MVC for iPhone (Objective-C), Yii Framework (PHP), and ASP.NET MVC (C#). If you have experience with MVC regardless of its programming language, it is not really difficult to switch MVC to another programming language.

Case Study, Initial Proposal for Quotation Management System

Bring back to the case study, System requirement are gathered in a JAD (Joint application design) session with the client. Based on the requirement, the Use Case Diagram, Use Case Scenario, Interface Wire-frame and Entity Relationship Model were prepared as initial proposal and revision of the system.

Figure 1: Use Case Diagram

Use Case Scenario
A. Manage User Actor: User
A.1 User signs in to the System
A.2 User successfully signed in into the system
A.2 User has access to all of the information within the system.
A.3 Admin has access to manage user (Add, Edit and Delete)
Exceptions:
A.1.2 User login information is not verified by the system, User redirects to login page and the number of failure attempts have been recorded by the system.
B. Manage Company Actor: User
Pre-Request Scenario : A.2
B.1 User could Add a company, each company has a Name and an Address.
B.2 User could Edit each company.
B.3 User could Delete each company in the condition that it does not have any sub records in Contacts, Quotations and Invoices. For example, if that company have already a quotation. User could not Delete that record. He need to first delete that quotation.
B.4 User could filter and search for company based on a predefined filter definition by the system.
Exceptions:
B.3.2 User must be show exactly which record prevent that the company to be deleted.
C. Manage Contact Actor: User
Pre-Request Scenario : A.2, B.1
C.1 User could Add a or multiple Contacts for each Company. Contact details are listed in Entity Relationship Diagram.
C.2 User could Edit each Contact information.
C.3 User could Delete each Contact in the condition that it does not have any sub records in Quotations and Invoices.
C.4 User could filter and search for Contact based on a predefined filter definition by the system.
Exceptions:
C.3.2 User must be show exactly which record prevent that the Contact to be deleted.
D. Manage Quotation Actor: User
Pre-Request Scenario : A.2, B.1, C.1
D.1 User could Add a or multiple Quotation for each Contact. Quotation details are listed in Entity Relationship Diagram.
D.2 User could Edit each Quotation information.
D.3 User could Delete each Quotation in the condition that it does not have any sub records in Invoices.
D.4 User could filter and search for Quotation based on a predefined filter definition by the system.
D.5 Quotation Item could be added to each quotation, each Quotation Item have number, description and amount.
D.6 Quotation Item could be deleted or updated
D.7 Each Quotation Item could be listed as Optional or compulsory or optional
D.8 After any operation (Add/Delete/Update) over the quotation item, the total amount of the quotation must be calculated by the system.
D.9 Each Quotation could be issued for only one primarily currency. A list of available currency is shown to the User.
D.9 Each Quotation could be selected a person in charge that approve that quotation. The information of this person is printed in the Quotation and Invoice. (Please refer to Entity Relationship Diagram)
D.10 Usually each Quotation have 4 compulsory and 3 optional item. Hence, by default the system create 4 compulsory quotation item and 3 optional quotation item.
Exceptions:
D.3.2 User must be show exactly which record prevent that the Quotation to be deleted.
E. Manage Invoices Actor: User
Pre-Request Scenario : A.2, B.1, C.1, D.1
E.1 User could Add a or multiple Invoice for each quotation. Over the adding of an invoice, User could select which of the Quotation Items would bring to the Invoice Items of that Invoice. Invoice details are listed in Entity Relationship Diagram.
E.2 User could Edit each Invoice information.
E.3 User could Delete each Invoice.
E.4 User could filter and search for Invoice based on a predefined filter definition by the system.
E.5 User are not allowed to add an Invoice Item to Invoice after the creation of invoice,
E.6 Invoice Item could be deleted or amended
E.7 After any Delete or Update operation over the Invoice Item, the total amount of the invoice must be calculated by the system.
E.8 User have the option to add invoice based on a percentage of the quotation total amount.
E.9 Foreign Exchange rate must be entered by the user, The system automatically calculates Foreign Exchange Amount of the invoice.
F. Manage Out Come Actor: User
Pre-Request Scenario : A.2, B.1, C.1, D.1
F.1 User could Add a Outcome for each quotation. Outcome details are listed in Entity Relationship Diagram.
F.2 User could Edit each Outcome information.
F.3 User could Delete each Outcome.
F.4 User could filter and search for Outcome based on a predefined filter definition by the system.



Figure 2: Add invoice initial WireFrame




Figure 3: Initial Entity Relationship Model

An Entity Relationship Model (ER Model) is a data model for describing a database in an abstract way. Subsequently, when we reached this step. Our ER Model is ready to be converted to the MVC Model.

Implementation of Quotation Management System in ASP.NET MVC

The easiest way to convert an ER Model to a MVC Model is to draw the Class Diagram of that ER Model. As the Class Diagram are drawn, your are ready to convert Class Diagram to ASP.Net MVC Model.


Figure 4: Final Revision of Class Diagram

Well done, in the following you could see Company, Contact, Quotation, Invoice and OutCome Models in C#.

A Company has a contact ID, Name and Address.

Company.cs

A Contact has a Company ID, Contact ID, First Name, Last Name, Position, Tell, Fax, Email, Gender, Last Activity Date, and Contact Status.

Contact.cs

A Quotation has a Contact ID, Quotation ID, Quotation, ITQ Number, Terms, Condition, Currency, Total Compulsory Amount, and etc.

Quotation.cs

A Invoice has a Quotation ID, Invoice ID, Date, Terms, Conditions, Percentage, Exchange Rate, and etc.

Invoice.cs

A Out Come has a Quotation ID, Out Come ID, Lost Amount, Lost To, and Short List.

OutCome.cs

What is the Next?

The next step is to create the Controller and the View for our Model. Thanks to ASP.Net MVC that automatically with an command could create them for us. Without any doubt you need to a little study and change the View and the Controller to meet the client requirements. ASP.net MVC really is much easier to learn and work in compare to Objective-C and PHP MVC, specially if you have worked with Visual Studio and MSSQL Before. You can download Visual Studio Express 2013 for Web completely free.


Figure 5: Edit Quotation




Figure 6: Invoice List




Figure 7: Print Invoice

Further Resources:

  1. Wikipedia, Trygve Reenskaug
  2. Microsoft MVC Tutorial

Next Article: