Wednesday, June 20, 2012

Architecture - Layers Diagram

Sometimes we work with large solutions containing a large number of projects, from projects for UI, business/Services, Data & etc..

So I will go quickly on how to set one project and draw its Layer Diagram.
Note: Im using VS2012RC Ultimate Edition (same for VS2010 & VS2011 Ultimate editions)

To set up, I will use the following scenario:
I have a to build a solution for a software called Ntrasal. I will set the namespace correctly from the beginning.
I will assume that I will need 3 layers, Data, Business & UI, and my UI have two parts (Mobile web interface and Normal PC web interface)


Step 1: Setup the solution
Start with new project, select other projects types, select visual studio solutions,  Blank solution
Give it the name you need for the project ex: (Injazat.Ntrasal) ==> ([CompanyName].[SolutionName])
Note: from the Beginning add it to source control



Step 2: For Data Layer
Add new project to the solution, select C#, class library for Data Access, name it as below:
Injazat.Ntrasal.Data

Note: If for any reason Ntrasal will have more data sources, example filenet documents, or fax or other I prefer the following: (you can add a separate project or a folder inside Injazat.Ntrasal.Data)
Ntrasal.Data.CLR (for any CLR functions)
Ntrasal.Data.ExtensionMethods
Ntrasal.Data.Modules (if you are using one LINQ or Entityframework no need for a folder)


Step 3: For business Layer
Add new project to the solution, select C#, Class library , name it as below:
Injazat.Ntrasal.Business

Note: Because im sure that NTrasal business will change in the future and it may cover a lot of area’s I prefer the following (add folders as below)
Injazat.Ntrasal.Business.Core (general business here and basics)
Injazat.Ntrasal.Business.FileNet
Injazat.Ntrasal.Business.SMS
Injazat.Ntrasal.Business.FAX

Step 4: Then add presentation layer
Currently for this example my presentation layer is only Web,
but be aware that in the future you may have more specific presentation layers as example 
Injazat.Ntrasal.UI.MVC
Injazat.Ntrasal.UI.Forms
Injazat.Ntrasal.UI.Mobile
Injazat.Ntrasal.UI.Mobile.BlackBerry (only if there are some spacifications)
Injazat.Ntrasal.UI.Mobile.iPhone
Injazat.Ntrasal.UI.VIP.Mobile

I will user the following
Injazat.Ntrasal.UI.Web.MobileMVC (this is the the mobile MVC)
Injazat.Ntrasal.UI.Web.MVC (this is for the normal PC Browser)

Step 5: Setting the references
Business will reference needed Data projects, and UI will reference needed Business layers. 

Step 6:Adding the Layer Diagram
Note: Even though I prefer to start first with this, we are doing it the other way around.
add to the same solution a new Modeling Project, I names it as below:
Injazat.Ntrasal.Architecture (I will use this project to store the layers diagram and any other UML I need or have example: Use cases, Sequence diagrams & etc.)

You can go to the  Architecture menu (you need to use Ultimate Edition of Visual Studio) and select new diagram, then select Layer Diagram.
Drag your artifacts(currently our project, folders) and set them on the layer diagram, set the dependences and change the colours, you may get something like the below:


Note: for more details you can refer to the MSDN link













No comments:

Post a Comment