[Dev Tip] REFACTORING THE ASP.NET MVC APPLICATION TO THE ONION ARCHITECTURE


Source Code on GitHub

Background

Any application should be fairly tested before it shipped to the customer. Biggest challenge in the testing is tightly coupled behavior of the UI with the Application Logic and further to the Database logic .Good testable systems are the one in which presentation layer does not directly depends on the application logic and the database logic. Application logic should be independent of UI such that both can be tested independent of each other. For example you should not call DBContext methods on click event of a button from the UI. If you do so, then the UI is tightly coupled with the database layer and any change in the database logic will impact the UI. Other disadvantage is that to unit test the database logic you need the UI. Testing of various components of the application is as important as building the components of the application. You should able to do the Unit Testing without the need of the database. Now let us assume, you are creating an ASP.NET MVC application and you have written all the database codes (fetching records or inserting etc.) in the controller itself. Your application may be up and running but in this pattern, you cannot unit test the controller without database. Other problem could be, you may have duplicate the database codes in different controllers and certainly you would not like that. There are challenges with duplicate codes. One change in database logic may require you to do multiple changes in the code. Other problem is your controller is aware of the underlying database source and if in future you change the data source, the controller will be affected and again this is not the best practice to create an ASP.NET MVC application. These problems are not only restricted to MVC but can exist in any kind of applications which is having database logic tightly coupled with the application itself.

Let us summarize problems we discussed above:

  • Duplicate database access codes
  • Hard to maintain the codes
  • Difficulties in Unit Testing
  • Hard to replace type of data sources
  • Tough to put centralized database access related policy

Usual approach we follow is the Layered Architecture. In layered architecture the presentation layer is transitively depends on the database layer and that does not solve the problem we discussed earlier in an absolute way.

Onion Architecture is the preferred way of architecting application for better testability, maintainability and dependability on the infrastructures like databases and services. This term was first coined by Jeffery Palermo in his blog back in 2008.

Learn more about the Onion Architecture in the series of blog posts by Jeffery Palermo

  • In the Onion Architecture layers talk to each other using the Interfaces. Any concrete implantation would be provided to application at the run time.
  • Any external dependency like database access and the web service call are part of the external layers
  • UI is part of the external layers
  • Objects representing domain are part of the internal layers or they are the centers
  • External layers can depend on the layers internal to it or central to it
  • Internal layer should not depend on the external layers.
  • Domain object which is at the core or center can have access to the both the UI and the database layers.
  • All the coupling are towards the center
  • Codes which may change often should be part of the external layers

I would recommend you to watch Steve Smith course on same topic at Pluralsight for better understanding on the concepts of the Onion Architecture. I will not go much into discussion of Onion architecture and jump into showing you refactoring ASP.NET MVC application to use the Onion Architecture.

Create N-Tier application using C# by Steve Smith

Setup

Let us implement Repository Pattern in MvcMovieRTM ASP.NET MVC Application. You can download this app from official Microsoft site here . After downloading, open the app in Visual Studio and in Package Manager Console run the command update-database. Go ahead and press F5 to run the application. Navigate to Movie Controller and you should able to see list of movies, can edit, delete and create new movie. We are going to refactor this application to adhere the Repository Pattern. Before we move ahead, let us examine the code in MoviesController.

image

As you see in the above code snippet that inside the controller we are directly accessing the database. All logics to fetch data from database is written right inside the controller and that makes the controller and the database access tightly coupled to each other. You cannot unit test Index action in isolation of database.

Refactoring to Repository Pattern

Follow the following steps to refactor the existing application:

Create two class library projects and give them name as MvcMovie.Infrastructure andMvcMovie.Core. In the project MvcMovie.Infrastructure all database related operation will be placed. In this example Entity Framework is used. So all Entity Framework dependency will be part of MvcMovie.Infrastructure project.

Setting up Infrastructure Project

Let’s start with moving the MovieDBContext class to the MvcMovie.Infrastructure project. Infrastructure project will contain all the database related classes and the operations. Since application is using Entity framework, we need to add the Entity framework reference in Infrastructure project. From Nuget manager add Entity framework package in the project. MovieDBContext class will look like as follows:

MovieDBContext.cs

1
2
3
4
5
6
7
8
9
10
11
using System.Data.Entity;
namespace MvcMovie.Infrastructure
{
    public class MovieDBContext : DbContext
    {
        public DbSet<Movie> Movies { get; set; }
    }
}

Next create MovieRepository class in the Infrastructure project. This class will contain all the database operations. Essentially we will move operations which are directly working with MovieDbContext class from the MoviesController to MovieRepository class. After moving the Entity framework codes the MovieRepository class will look like follows:

MovieRepository.cs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
using MvcMovie.Core;
using System;
using System.Collections.Generic;
using System.Data.Entity;
namespace MvcMovie.Infrastructure
{
    public class MovieRepository : IMovieRepository, IDisposable
    {
        MovieDBContext db = new MovieDBContext();
        public IEnumerable<Movie> GetMovies()
        {
            
                return db.Movies;
            
        }
        public void Add(Movie m)
        {
          
                db.Movies.Add(m);
                db.SaveChanges();
           
        }
        public void Edit(Movie m)
        {
            
                db.Entry(m).State = EntityState.Modified;
                db.SaveChanges();
            
        }
        public void Remove(int id)
        {
                Movie movie = db.Movies.Find(id);
                db.Movies.Remove(movie);
                db.SaveChanges();
            
        }
        public void Dispose()
        {
            db.Dispose();
        }
    }
}

Once MovieRepository class is created refactor it to extract Interface from this class. You need to move extracted interface to the MvcMovie.Infrastructure project.

clip_image002

Visual Studio will extract the IMovieRepository interface and put it inside the MvcMovie.Infrastructure project. Move the IMovieRepository interface to the MvcMovie.Core project. IMovieRepository will look like follows in MvcMovie.Core project:

IMovieRepository.cs

1
2
3
4
5
6
7
8
9
10
11
12
using System;
using System.Collections.Generic;
namespace MvcMovie.Core
{
   public interface IMovieRepository
    {
        void Add(Movie m);
        void Edit(Movie m);
        IEnumerable<Movie> GetMovies();
        void Remove(int id);
    }
}

Do not forget to implement the IMovieRepository interface in the MovieRepository class. At this point of time if you go ahead and build the MvcMovie.Infrastructure project, you will get compile time errors. In solution explorer MvcMovie.Infrastructure project should look like follows:

clip_image002[6]

Setting up Core Project

Move Movie class from the MvcMovie project to the MvcMovie.Core project. To work with data annotations add reference of System.ComponentModel.DataAnnotaions in the MvcMovie.Core project. Movie class should look like follows in core project:

Movie.cs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
using System;
using System.ComponentModel.DataAnnotations;
namespace MvcMovie.Core
{
  public class Movie
    {
        public int ID { get; set; }
        [StringLength(60, MinimumLength = 3)]
        public string Title { get; set; }
        [Display(Name = "Release Date")]
        [DataType(DataType.Date)]
        [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
        public DateTime ReleaseDate { get; set; }
        [RegularExpression(@"^[A-Z]+[a-zA-Z''-'\s]*$")]
        [Required]
        [StringLength(30)]
        public string Genre { get; set; }
        [Range(1, 100)]
        [DataType(DataType.Currency)]
        public decimal Price { get; set; }
        [RegularExpression(@"^[A-Z]+[a-zA-Z''-'\s]*$")]
        [StringLength(5)]
        public string Rating { get; set; }
    }
}

You should have the IMovieRepository interface and the Movie class inside the MvcMovie.core project. In solution explorer the MvcMovie.Core project will look as follows:

clip_image002[8]

Compile MvcMovie.Core project and add its reference to the MvcMovie and the MvcMovie.Infrastruture project. After adding reference of the MvcMovie.Core in the MvcMovie.Infrastructure project, you should able to successfully compile the MvcMovie.Infrastructure project.

Refactor MoviesController

Previously in the MoviesController class we were directly creating instance of the MovieDBContext and performing database operations. To follow Onion Architecture, controller will only know about the IMovieRepository and perform database operations using the IMovieRepository. Very first let’s create instance of the IMovieRepository

1
private IMovieRepository db = new MovieRepository() ;

Next any database operation will be performed on instance of MovieRepository. Some of the operations are as follows:

Fetch Genre

1
2
3
var GenreQry = from d in db.GetMovies()
               orderby d.Genre
               select d.Genre;

Fetch All Movies

1
2
var movies = from m in db.GetMovies()
                         select m;

Add Movie

1
db.Add(movie);

Edit Movie

1
db.Edit(movie);

Remove Movie

1
db.Remove(movie.ID);

Replace various database operations in MoviesController with the code as shown above. As of now you should successfully able to run the application.

Inverting the Dependency

We are directly creating instance of the MovieRepository in the MoviesController which makes Controller tough for Unit Test. In this scenario to test the Controller, you need the database. We can solve this problem by inverting the control using any DI Container. You are free to use any DI container of your choice, however I am using Microsoft provided Unity Container. To use it add the Unity reference using Nuget Package Manger. In Unity.Config (located in the App_Start) folder register the type as given below:

1
container.RegisterType<IMovieRepository, MovieRepository>();

Once type is registered you need to call the RegisterComponents() method of UnityConfig in the Application_Start() method of the Global.asax.cs as shown below:

1
UnityConfig.RegisterComponents();

As the last step refactor Controller as shown below:

clip_image002[10]

If you remember in beginning we were directly creating the instance of the MovieDBcontext inside controller hence the controller was fully dependent on database and was making it tough to test it in isolation.

MvcMovie application has been refactored to Onion Architecture. Next task you may want to do, is to download the code discussed in this post from GitHub and start writing test.

Source Code on GitHub

Summary

We have refactored the application adhering to the onion architecture. Domain objects like Movie is at the center of the architecture and are the part of internal layers. The Infrastructure project in which we are working with database and database logics are part of the external layers. They depend on the centeral layers like core. UI or in this case the MVC application is also an external layer and depndes on the Core project. All layers are interacting to each other using the interfaces rather than the concrete definitions. You can very easily write Unit Test against the controllers using Fake or Mock without hitting the datbase. In future you can easily change data access technology from Enity Framework to something else without affecting the UI and the Core.

Resources

Source Code on GitHub

Learn more about the Onion Architecture in the series of blog posts by Jeffery Palermo

REF: http://debugmode.net/2014/09/12/refactoring-the-asp-net-mvc-application-to-the-onion-architecture/

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s