3 Layer Architecture in ASP.Net

3 Layer Architecture


This article describes one of the important topics of development architecture, the 3-layer architecture. Before going further into detail and explaining the three-layer architecture, in the past I used code for the form events and after a while when the code needed to be changed I had to make changes everywhere. Somehow being human I might forget to change it in some places. I was a bit worried since I was not able to understand the 3-layer architecture so I have worked hard and tried my best to learn and share it with all of you.

A three-layer architecture is a client-server architecture in which the functional processes of user interface, business logic and data access layer are developed and maintained as independent modules on separate platforms. The three-layer architecture is a software design pattern and well-established software architecture.

Advantages of 3-layer Architecture
  1. Reusability: Moving code-behind libraries. It is possible to make changes in the presentation level without effecting the other two (business or data access layer).

  2. Decoupling of UI, Business logic and Data Access Layer are done.

  3. Maintainability: When we change one layer due to the client's needs it doesn't affect the other layers and we need to do less changes in another layer.

  4. If your project moves from Windows to a website then only the UI is changed and all the other layers remain the same and the same goes when depending on your business needs the database changes. Only the DAL is changed, the rest are decoupled from each other making the project easier to manage.
    Three Layer Architecture
    Figure : Three Layer Architecture

Let's get it started. Practically we are making a basic three-layer website.

Step 1

Create a project.

Creating a Project

Step 2

Select ASP.NET Web Form.

Web Application

Step 3

Delete all the default aspx templates from the web application.

Delete all the default Aspx templates

Step 4

Add a new Web Form.

webform

Step 5

Create your Simple Registration Form.

design

Step 6

Create a table for that named Registration with respective column name and data type.

table design

Step 7

Now add a Business Class to act as a mediator for both the UI and Data Access Layer.

adding a Business Class

Step 8

Name the Class CustomerReg as in the following screenshot:

new class

Now define the properties of the class, in other words the class should have some characteristics and our project should work as a real entity.

We create properties of the CustomerReg class, in other words the Properties are named members of classes, structures and interfaces. Member variables or methods in a class or structure are called fields. Properties are an extension of fields and are accessed using the same syntax. The important use of a property is to inject logic or validation into it. They use accessors by which the values of the private fields can be read, written or manipulated.

So let's get started.

Step 9

To define a property you can use a keyword prop and press the Tab button. A property will automatically be created and you can name it depending on your requirements or else create a private variable then right-click on the variable name then go to Refractor and press Encapsulate field, your get and set method properties will be created.

set method property

reference

Step 10

Now add a DAL to contain our database related code.

add new class

Adding a DAL

namespace

Add the System.Data and System.Data.SqlClient namespace for the database connection class. Now we create a connectionstring in the Web.conFigure file, for that we need to use the following procedure.

Step 11

click server explorer

data connection

Step 12

Add a new connection.

add connection

Enter your server name or enter "." or ".\sqlexpress" and select your database name.

test

Select your database name. I created the table in a database called MyCustomer so I will select the MyCustomer database and then press OK.

Your connection will appear in the Server Explorer.

Server Explorer

Step 13

Right-click on properties and then go to the connection string.

properties

enter connection string

Copy the connection string and then got to the web.conFigure file.

webconFigure

Add a connection string for the database connectivity.

Step 14

Add a connection string

<add name="DB" providerName="System.Data.SqlClient" connectionString="Data Source=.;Initial Catalog=MyCustomer;Integrated Security=True"/>

Now I will create a class and name it conString that will contain the connection string provider name so that we don't need to create a connection string every time we want to perform some db related actions. The constructor will be automatically called when we click on the submit button that will initialize the object of the Sqlconnection.

class

connection String

Sqlconnection

Now whenever we want our sqlconnection I will just use its class and SqlConnection object Con.

Step 15

Now passing values to the Business logic double-click on the Submit button and create an object of the Business class and assign the TextBox values to the properties.

Business class

Create an object of the Business class and assign the values of the textboxes to the corresponding properties.

Call a function by the Business Layer object and save it. You would be aware of showing a JavaScript alert in the C# code, I also used it and showed an alert message as shown above.

Now create a function called Save in the Business layer.

Step 16

And now the Business layer will act as a mediator between the UI and DAL.

Create an object of the DAL.

Create object of DAL

Now in the Data Access Layer we will create a Boolean function named RegisterData that will accept 4 Parameter as shown below.

And perform the insert query into the table.

insert query

Once completed you are ready to insert the details into the database using the 3-layer architecture. Just run your program and here you go.

We will go through the phases of the flow of the program, so I have injected debugging points into the program so that it will be easy for us to understand how the data is flowing.

Step 17

The Register Page.

register

I have entered the form details and will submit the button and see how the data is following from the UI Layer to the Business Layer and then to the DAL and then vice versa back to the UI.

As we can see below, it comes to the Business class and creates an object of the Business class and then takes all the input values from the textboxes.

textboxes

Once all the values have been saved the Business Class function Save is called.

Business Class Function

The Save function is called and now the real property values are set depending on the values passed from the Register Form. Here all of the Property values are validated if you have injected any validation into it.

Register Form

validation

We can see all the values that have been set to the properties of _UserName, _Password, _Address and _MobileNo.

After the DAL Object is created the RegisterData function is called where all the database related code is written or fired.

RegisterData

All the values have been passed to the boolean function and we can see the following values of the parameters above, by clicking on the pin to source option.

Now once the compiler gets to conString.con.open it goes to the conString class and opens the connection.

compiler code

conString

SQL code is fired and returned true, finally the connection is closed. Once the connection is closed the complier comes back to the function from where it was called.

code

This will again return true to the previous calling function and the result (true/false) will be assigned into it and will check for true or false. Since the operation was successful it will return true.

bool status

Status

We can see the value of the status is true, so then you have successfully Registered Yourself will get fired.

Registered Yourself

And now check the database, whether or not the value was inserted.

Query

As you can see below the value was successfully inserted into the database.

So I want to conclude the article, here we learned how our code behind got minimized by beautifully dividing our code into three layers. It's easy readable for the user and using this code the code duplication will be minimized.

I hope this article will be helpful and makes it easy to understand the concept of the 3-layer architecture. Please write your feedback and add on your learning to it so that I can also learn from you all.