If you're new here, you may want to subscribe to my Email Updates. Thanks for visiting!
For the regular visitors on this site, it may seems that nothing happened here since a little while. It might be true for the “Window” (no pun intended), but in the back office it was hard work during this time. Some of those projects have nothing to do with this site, but others are intimately linked to it, you will see the results all along this year. For now you can see the style is now “Modern”, in the same spirit as our daily tools with Visual Studio 2013, but also more “Mobile”, as now it is adapted to smart phones and tablets, allowing you to check and read the site where ever you are.
The year 2013 has seen the birth of this site, and the regular climb of its readers number. I hope 2014 w<ill be a much better Year, for this site, for You and for me!
Thanks to you for your interest, your confidence and your support.
In this introduction to MVC, we will be looking at this famous pattern, but first some explanations about this goal change. When I started this tutorial, I had only a vague idea about the kind of web application I wanted to build. The “personal Challenge” idea seemed interesting, but after thinking a bit more about it, it does not seem really useful. I decided to embark on something really different, which could potentially be useful to thousands of people, and which, from my research, does not really exists today.
I don’t want to unveil right now what this is about, this will be done once the project actually start and we begin to design the database. For now let me just say that it will be a real world application, unique, free, of course, using a database, latest technologies with HTLML 5, CSS3, JQuery, and so on. The goal is to build a web application, deployed and hosted, available to anyone, hoping it will end up being a useful, succesful tool for those using it
Obviously the problems to solve during this project will be directly linked to this specific application domain, but in the same time, methods and technic used should be generic enough to be useful examples in many other ASP.NET MVC applications.
The methodology used will be as close as possible to SCRUM methods, which means that each step in the developement process (and tutorial) will have to end up with a usable feature, which means that, at the end of each step we should get “something” usable, without being always fully done. We will also use tests where it is meaningful, but maybe not everywhere.
Source code and the whole project will be available to everyone on GitHub, so it should be easy to follow the evolution and to participate.
This being said, let’s go back to the subject at hand, MVC….
Model – View – Controller Pattern
The main idea behind MVC is to make easier isolation between different parts of the application user interface, principle also known as “SoC”, Separation of Concerns. It’s about making components independent from each other, which has many benefits:
Developement: As individual components are designed to not be depending on one another, it’s easier to build them independently. This make also their replacement or substitution easier, eliminating difficulties happening when modification of one component cascade needed change on others.
Testability: In the same way, the ability to untie components make writing tests easier. For example, it become possible to replace a query to a database by a function returning a string, to test another part of the application. This becomes very valuable over time, to check that changes made somewhere have no side effects, as tests must always pass. We will have plenty of opportunities to go back to tests during this project.
Maintenance: Components isolation also means that, chances are a modification will have to be made to only one component, eliminating the need to cascade changes in many places to add or modify a feature.
To be clear, the MVC pattern has to do only with the UI, and more generally with decoupling components. In a real application, it will not be the only pattern in use, and each component must be seen in a flexible, non restrictive way. For example, it’s possible to build a MVC application which has no tie to a database, but with web services returning data. It will still be an application built upon the MVC pattern
Obviously there are many different answers for this question, so I will give you mine. First, I am far more familiar with C# than I am with PHP, even if i wrote a few applications with it, more specifically with the MVC framework “Cake”. MVC pattern is for me the most logical way to deal with a Web application, make future extensions and maintenance easier. As it happens, ASP.Net implementation of this pattern is very clean and logical. BUT, normally .Net and C# needs Windows as OS. Problem is, most web applications I am writing are going to be hosted on external virtual servers, not in house. Hosting providers are able to offer great Linux packages, where you have full control for a very good price, but for Windows based solutions, its generally not that flexible, you can’t always install what you need, and the deals are not as good. Moreover, in my personal case, it seems logical to avoid to multiply servers. My blog use WordPress, hosted on a Ubuntu server, and I would like (quite a few of my clients, too) to be able to host on the same server some ASP.NET MVC 4.0 applications. This is doable, thank you to Mono, which is improving at a fast pace and is now compatible with MVC 4.0 and Entity Framework 6.0 (RC1 for now..)
In this post, we are going to see, step by step, how to run Asp.Net MVC 4 with MySql on Linux Ubuntu with Mono. The same steps would apply to any other Linux distribution, and to PostgreSql as well.
To start, I am going to assume you have access to a Ubuntu Server 12.04 LTS or newer, available here: http://www.ubuntu.com/download/server , and a PuTTY terminal to manage it. If you don’t have a remote host, you can easily create a local virtual machine with Windows 8 and Hyper-V. In fact, even if you have a real remote server, it might be a good idea to create a local virtual machine to experiment with.
Let’s see how to build our LAMA stack, in replacement to, or association with, LAMP. Lamp being an acroym for Linux, Apache, MySql, PHP and Lama being an acronym for Linux, Apache, MySQL, ASP.NET.
Ubuntu distribs already contains Mono, but the lag behind current Mono evolution is significant, as installed version is 2.10.8, MVC 3 compatible, while the current version, while I am writing this, is 3.2.3 and is .Net 4.5 and MVC 4.0 compatible. As we want to run MVC 4.0 applications, we have no other choice but to download, compile and run mono directly from source code. This takes a little bit of time and precision, but there is nothing difficult if you follow step by step.
After connecting via SSH/PuTTY, the very first thing to do is to check that we are up to date on everything already installed:
bernard@UbuntuFactory:~$ sudo su
root@UbuntuFactory:/home/bernard# apt-get update
root@UbuntuFactory:/home/bernard# apt-get dist-upgrade
(If you are using PuTTY, select the text of the commands here, copy it into the clipboard with CTRL-C, put the mouse cursor inside PuTTY and right-click, the text will be inserted where PuTTY cursor is.)
Then we install the minimum set of tools needed to compile:
There are different ways to create a local site on your machine. The one I am going to describe now is adapted to what we have been doing , manually create statics html and css files.
-1- Create a Virtual Directory in IIS
In IIS Manager main windows, select the Default Web Site, then right click to get the popup menu. Select “Add Virtual Directory”. Give it an alias name, then select the actual physical path where your files are.
-2- Modify the Directory Security settings to allow the “Internet User” to read and execute scripts.
IIS_IUSRS is the name given by the system to your Internet Guest. You need to give him rights as seen on the picture, in order to allow him to access your site content.
-3- Rename your file to match a default file name. Otherwise we would have to lower server security to allow to browse the directory.
The file used in previous steps was named something like ““HTMLPartOneStepTwo.html”. This named is not known from IIS, and as I did not want to type this exact name as part of the URL, IIS do not allow us to browse the directory, even if IIS_USERS is allowed to. Standard ISS configuration disallow this feature. As you may seen on the screen shot, ISS kindly explain to us what we need to do to allow this feature, but it’s not a very good idea for quite obvious security reasons. In our (very simple) case, to see our page “served” by the server, we simply rename it “Index.html”.
-4- Point your browser to the local Url
After this filename change, I just had to refresh the page to see it apprear, exactly identical as she was at the end of the previous step. The only difference being that, this time we get it through the Internet Server rather than through the file system. As this is totally static HTML, there is no other difference.
First Part Conclusion
As we have now seen what happens on the Browser side, we are finally ready to start working server side, that is beging with MVC and code.
If you have not yet done so, I invite you to subscribe to our email updates, so that you will be informed as soon as a new post is made.
A question over at StackOverflow made me curious about how Entity Framework with Code First and MySql are working together. Specifically Code First, as it’s the less obvious for EF.
Without going deep into Entity Framework (if you read this, I assume you already use it), you can use EF following 2 basic scenarios:
From an existing database, generate in Visual Studio classes for the data repository model
Write classes to define the data model, and generate database tables and columns from there. As this last approach start by writing code, it sound appropriate to name it Code First…
To test Entity Framework with MySql, I created a small console application, so that anything not absolutely mandatory for this purpose would be eliminated. No clutter here! You will be able to download my project at the end of this post, but I’ll start by describing the items needed and main steps.
Visual Studio 2012, any version. Not tested with another version, but VS 2013 should be fine.
MySql. Unless you already have it on your computer, the easiest way is to download and install MySql Installer, which include, beside the server itself, MySql Workbench, a very good “studio” for MySql, and connectors.
Everything else will be installed directly into the project with NuGet.
Your script can do many different tasks:
Modify the DOM (Document Object Model) and its elements
React to events, like a click on a button, opening a page, drag and drop, and so on.
Read global variables, linked to the document or the browser
We are going to create a simple script doing all of the above, step by step.
There are much, much more material to be found on Internet about this, but don’t get overwhelmed. It’s great to know how it works, but we’ll see later on that you don’t have to do everything by yourself, manueally
We are going to build together a web application, using the MVC pattern and Entity Framework. Data Centric because, as I come from the Clarion world, the logical process for me is to start by defining the data structure before starting to define a User Interface and start coding. There is nothing wrong doing things differently, it just seems to “flow” more naturally for me that way.
What tools you need to follow along?
We will be using the latest Web technologies existing today in the Microsoft world. If you don’t already have a version of Microsoft Visual Studio, I suggest to download Microsoft Visual Studio 2012 for Web, or the equivalent 2013 preview. If you already have an Express version of Visual Studio, be sure to have the Web Version. The other versions, Professional, Enterprise and Ultimate will all have the required features. Read more ›