Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database...
Transcript of Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database...
![Page 1: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/1.jpg)
3-tier Architecture
Step by step Exercises
https://www.halvorsen.blog
Hans-Petter Halvorsen
![Page 2: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/2.jpg)
Client-Server
Software Architecture
Web Services
APIs
3-Tier Architecture
API: Application Programming Interface. Different devices or software modules can share the same code. Code once, use it many times
Web Services: A standard way to get data over a network/Internet using standard Web protocols (HTTP, etc.)
3-Tier: A way to structure your code into logical parts. Different devices or software modules can share the same code.
Good Software!
2-Tier
n-Tier
Web API
![Page 3: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/3.jpg)
3
The database-centric style. Typically, the clients communicate directly with the database.
A three-tier style, in which clients do not connect directly to the database.
Web Services, etc.
![Page 4: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/4.jpg)
3-tier/layer Architecture
4
Presentation Tier
Business Logic Tier
Data Access Tier
Data Source
PL
BL
DAL
Note! The different layers can be on the same computer (Logic Layers) or on different Computers in a network (Physical Layers)
Data Tier - DL
Logic Tier
![Page 5: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/5.jpg)
Why 3-Tier (N-Tier Architecture?)• Flexible applications• Reusable code– Code once, use many times
• Modularized– You need only to change part of the code– You can deploy only one part– You can Test only one part– Multiple Developers
• Different parts (Tiers) can be stored on different computers• Different Platforms and Languages can be used• etc.
5
![Page 6: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/6.jpg)
6http://en.wikipedia.org/wiki/Multitier_architecture
![Page 7: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/7.jpg)
3-tier/layer ArchitecturePresentation Tier• This is the topmost level of the application. • The presentation tier displays information related to such services as browsing merchandise, purchasing
and shopping cart contents. • It communicates with other tiers by which it puts out the results to the browser/client tier and all other
tiers in the network. • In simple terms it is a layer which users can access directly such as a web page, or an operating systems
GUIApplication tier (business logic, logic tier, data access tier, or middle tier)• The logical tier is pulled out from the presentation tier and, as its own layer. • It controls an application’s functionality by performing detailed processing.Data tier• This tier consists of database servers. Here information is stored and retrieved. • This tier keeps data neutral and independent from application servers or business logic. • Giving data its own tier also improves scalability and performance.
7http://en.wikipedia.org/wiki/Multitier_architecture
![Page 8: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/8.jpg)
3-tier Architecture
Presentation Tier
Business Logic Tier
Data Access Tier
Database
Presentation Tier Presentation Tier
Stored Procedures
Data Tier
Logic Tier
![Page 9: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/9.jpg)
3-tier Architecture
Presentation Tier
Business Logic Tier
Data Access Tier
Database
Presentation Tier Presentation Tier
Stored Procedures
Different Devices can share the same Business and Data Access Code
The different Tiers can be physical or logical Data Tier
Logic Tier
![Page 10: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/10.jpg)
Web Server
3-tier + WebService Architecture - Example
Presentation Tier
Business/Data Logic Tier
Data Source
Web Services
Server(s)
Data Tier
Stored Procedures
Server-side Client-side
![Page 11: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/11.jpg)
Web Server
3-tier + WebService Architecture - Example
Presentation Tier
Business/Data Logic Tier
Data Source
Web Services
Team
Foun
datio
n Se
rver
TFS Cient
Installed on one or more Windows Servers in your LAN or in the Cloud
Data Tier
Stored Procedures
Team Foundation Server
![Page 12: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/12.jpg)
3-tier Architecture Scenarios
Presentation Layer
Business Logic
Data Access LogicDatabase
Presentation Layer Presentation Layer
Stored Procedures
Client
ClientClient
Web Server
Web Service
Presentation Layer
Client
Presentation Layer
Internet
Local Network (LAN)
Client
Firewall
Presentation Layer
ServerServer
![Page 13: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/13.jpg)
Exercises
1. Create Data Tier (Database)
2. Create Logic Tier (Database Communication Logic)
Create Presentation Tier (User Interface Logic):3. WebApp: Using ASP.NET Web Forms (WS normally not needed)
4. Desktop App: Using WinFormsA. Without Web Services (We assume the App will be used only in
the LAN and that we have direct access to the Database)
B. With Web Services (We assume the App should be used on Internet outside the Firewall without direct DB access)
![Page 14: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/14.jpg)
Database
Presentation Tier
e.g., ADO, ADO.NET
Logic Tier
Web Service
Business Tier
Data Access Tier
Data Tier
Stored ProceduresViewsTables
Web Server
DatabaseServer
Presentation Tier
Client
ASP.NET Web Forms
Web AppPresentation Tier
Client
Clie
nt
ClientWinForms
3-tier Architecture
Scenarios
Firewall
Clients
Desktop AppMobile
App
Internet
Local Network
Note! The different Tiers can be on the same Computer (Logic Layers) or on different Computers in a network (Physical Layers)
Android, iOS, Windows 8/Windows Phone,
etc.
Presentation Tiers
Devices can share the same Business/Logic Tier and APIs
Seperate Presentation Tier for each Device App
API
API
API
API
![Page 15: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/15.jpg)
15
Visual Studio ProjectsSolution with all Projects (Logic Tier, Web Service, Desktop App, Web App, Mobile App)
Solution with Projects used by Web App (Logic Tier, Web App)
![Page 16: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/16.jpg)
Data TierWe are going to create the Database / Data Layer/Tier, including:1. Tables2. Views3. Stored Procedures4. Triggers5. Script for some “Dummy” Data
Download Zip Files with Tables, Views, Stored Procedures and Triggerse in order to create the Data Tier in SQL Server (The ZIP File is located on the same place as this File)
16
Note! Install them in this order
![Page 17: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/17.jpg)
Data Tier
17
Tables
Views
Stored Procedures
SQL Server
Triggers
Data Tier
![Page 18: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/18.jpg)
18
Database Tables
![Page 19: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/19.jpg)
19
Execute the different Scripts inside SQL Server
Management Studio
![Page 20: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/20.jpg)
20You are finished with the Exercise
![Page 21: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/21.jpg)
Create Logic Tier
21
Database
Presentation Tier
Logic Tier
ASP.NET Web Forms
Data Tier
Presentation Tier Presentation Tier
WinForms Windows Store App
Purpose: • All the Apps should/could
share the same Logic Tier• To make your Apps easier
to maintain and extend• etc.
![Page 22: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/22.jpg)
22
Create an Empty (Blank) Solution in Visual Studio
![Page 23: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/23.jpg)
23
Add Project for Logic Tier (Data Access)
Select a “Class Library” Project
“LogicTier”
![Page 24: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/24.jpg)
24
Add a New Class to the Project (“StudentData.cs”)
“StudentData.cs”
![Page 25: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/25.jpg)
25
Create the Code, e.g., like this (“StudentData.cs”):
Create your own Namespace
Improvements: Use Try... Catch ...
A View that collects data from several tables
![Page 26: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/26.jpg)
26
You should test the SQL Query in the SQL Server Management Studio first
![Page 27: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/27.jpg)
27
Code (“StudentData.cs”):using System.Data.SqlClient;using System.Data.SqlTypes;using System.Data;
namespace Tuc.School.LogicTier{
public class StudentData{
public DataSet GetStudentDB(string connectionString){
string selectSQL = "select StudentName, StudentNumber, SchoolName, ClassName, Grade from StudentData order by StudentName";
// Define the ADO.NET objects.SqlConnection con = new SqlConnection(connectionString);
SqlDataAdapter da = new SqlDataAdapter(selectSQL, con);
DataSet ds = new DataSet();da.Fill(ds);
return ds;
}}
}
![Page 28: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/28.jpg)
28
Create a proper name for the Assembly (.dll File)
This will be the Assembly for your Logic Tier, that can be imported and used in other projects.Create once – use it many times!!
Then Build your Project (hopefully with no errors)
Right-click on the Project in the Solution Explorer and select Properties
![Page 29: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/29.jpg)
29You are finished with the Exercise
![Page 30: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/30.jpg)
30
Presentation LayerWeb App: ASP.NET WebForms
We will create a WebForm like this where the data comes from our Logic Tier
![Page 31: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/31.jpg)
31
Add Project for Presentation Tier (ASP.NET WebForm)
![Page 32: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/32.jpg)
32
Add a New Class (“Student.cs”)
![Page 33: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/33.jpg)
33
Add Code (“Student.cs”)
Add a Reference to the Assembly in the Logic Tier
Note! This is our Logic Tier
![Page 34: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/34.jpg)
34
Code for “Student.cs”using System;using System.Collections.Generic;using System.Linq;using System.Web;
using System.Data;
using Tuc.School.LogicTier;
namespace Tuc.School.WebApp{
public class Student{
public DataSet GetStudent(string connectionString){
StudentData studentData = new StudentData();
return studentData.GetStudentDB(connectionString);
}}
}
Get Dat from our Logic Tier
Since we are using the DataSet Class
Our Logic Tier
![Page 35: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/35.jpg)
35
Add a New WebForm (StudentInformation.aspx)
![Page 36: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/36.jpg)
36
Create WebForm Page (“StudentInformation.aspx”)
GridView (Drag & Drop from Toolbox or create code in .aspx file)
![Page 37: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/37.jpg)
37
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="StudentInformation.aspx.cs" Inherits="WebApp.StudentInformation" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">
<title>Student Information</title></head><body>
<form id="form1" runat="server"><div>
<h1>Student Information</h1>
</div><asp:GridView ID="gridStudentData" runat="server"></asp:GridView>
</form></body></html>
HTML /ASPX Code (“StudentInformation.aspx”)
![Page 38: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/38.jpg)
38
Code behind for the Web Form (“StudentInformation.aspx.cs”)using System.Web.Configuration;using Tuc.School.WebApp;
namespace WebApp{
public partial class StudentInformation : System.Web.UI.Page{
private string connectionString = WebConfigurationManager.ConnectionStrings["SCHOOLConnectionString"].ConnectionString;
protected void Page_Load(object sender, EventArgs e){
if (!IsPostBack){
FillStudentGrid();}
}
private void FillStudentGrid(){
DataSet ds = new DataSet();
Student studentList = new Student();
ds = studentList.GetStudent(connectionString);
gridStudentData.DataSource = ds;
gridStudentData.DataBind();}
}}
Note!
Web.Config
![Page 39: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/39.jpg)
39
Store the “ConnectionString” for your Database in “Web.Config”
<?xml version="1.0" encoding="utf-8"?><!--For more information on how to configure your ASP.NET application, please visithttp://go.microsoft.com/fwlink/?LinkId=169433-->
<configuration>
<connectionStrings><add name="SCHOOLConnectionString" connectionString="Data Source=macwin8;Initial
Catalog=SCHOOL;Persist Security Info=True;User ID=sa;Password=xxxxxx"providerName="System.Data.SqlClient" />
</connectionStrings>
<system.web><compilation debug="true" targetFramework="4.5" /><httpRuntime targetFramework="4.5" />
</system.web></configuration>
Then you can easly switch Databsse without changing the Code!!
![Page 40: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/40.jpg)
40
Test your Web App
Note! We have used a “View” in order to get data from several tables
![Page 41: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/41.jpg)
41
Additional Exercise:
Update GridView with New Data from Database
Goto New WebFormin order to Add another Student
![Page 42: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/42.jpg)
42You are finished with the Exercise
![Page 43: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/43.jpg)
43
Presentation LayerDesktop App: WinForms
Part A: Without Web Services (we assume the App will be used only in the local LAN (or local on the same computer where the database is located) and that we have direct access to the Database)
Label
DataGridView
![Page 44: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/44.jpg)
44
Add a WinForm Project
![Page 45: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/45.jpg)
45
Add a New Class (“StudentWinForm.cs”)
![Page 46: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/46.jpg)
46
Add Code in Class
Add a Reference to the Assembly in the Logic Tier
![Page 47: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/47.jpg)
47
Code for Class “StudentWinForm.cs”
using System.Data;
using Tuc.School.LogicTier;
namespace Tuc.School.WinFormApp{
class StudentWinForm{
public DataSet GetStudent(string connectionString){
StudentData studentData = new StudentData();
return studentData.GetStudentDB(connectionString);}
}}
Reference to our Logic Tier
Since we are using the DataSet Class
Our Database Method in our Logic Tier
![Page 48: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/48.jpg)
48
Create Form
Label
DataGridView
![Page 49: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/49.jpg)
49
Create Form Code
![Page 50: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/50.jpg)
50
using System.Configuration;using Tuc.School.WinFormApp;
namespace WinFormApp{
public partial class Form1 : Form{
private string connectionString = ConfigurationManager.ConnectionStrings["SCHOOLConnectionString"].ConnectionString;
public Form1(){
InitializeComponent();}
private void Form1_Load(object sender, EventArgs e){
FillStudentGrid();
}
private void FillStudentGrid(){
DataSet ds = new DataSet();
StudentWinForm studentList = new StudentWinForm();
ds = studentList.GetStudent(connectionString);
dataGridViewStudentInformation.DataSource = ds.Tables[0];
}}
}
WinForm CodeNote!
ConnectionString is stored in App.config
![Page 51: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/51.jpg)
51
Note! Add System.Configuration Reference
![Page 52: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/52.jpg)
52
Create DB ConnectionString in App.config<?xml version="1.0" encoding="utf-8" ?><configuration>
<startup> <supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.5" />
</startup>
<connectionStrings><add name="SCHOOLConnectionString" connectionString="Data Source=macwin8;Initial Catalog=SCHOOL;Persist Security
Info=True;User ID=sa;Password=xxxxxx"providerName="System.Data.SqlClient" />
</connectionStrings>
</configuration>
![Page 53: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/53.jpg)
53
Test it
It works!!!
![Page 54: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/54.jpg)
54You are finished with the Exercise
![Page 55: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/55.jpg)
55
Presentation LayerDesktop App: WinForms
Part B: Using Web Services (we assume the The App should be used on Internet outside the Firewall)
Label
DataGridView
![Page 56: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/56.jpg)
56
Step 1: Create Web Service
Add Web Service:
Create an ASP.NET Project:“SchoolWS”
“SchoolWS.asmx”
![Page 57: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/57.jpg)
57
Web Service Code
Database ConnectionStringis located in Web.config
Web Service Method
![Page 58: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/58.jpg)
58
Database ConnectionString is located in Web.config
![Page 59: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/59.jpg)
59
Test Web Service
It Works!!
Click to Test the Web Service Method we created
![Page 60: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/60.jpg)
60
Deploy/Publish Web Service to IISCopy Web Service Files (Project) to default IIS Directory: C:\inetpub\wwwroot
![Page 61: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/61.jpg)
61
![Page 62: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/62.jpg)
62
Test if WS working:
http://localhost/SchoolWS
![Page 63: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/63.jpg)
63
Step 2: Use Web Service in WinFormCreate New WinForm Project:
“WinFormAppWSClient”
![Page 64: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/64.jpg)
64
Add Web Service Reference
Our Web Service Methods
![Page 65: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/65.jpg)
Create GUI
Label
DataGridView
![Page 66: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/66.jpg)
66
Create Code
![Page 67: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/67.jpg)
67
using System.Windows.Forms;
namespace WinFormAppWSClient{
public partial class FormWSClient : Form{
public FormWSClient(){
InitializeComponent();}
private void FormWSClient_Load(object sender, EventArgs e){
FillStudentGrid();}
private void FillStudentGrid(){
DataSet ds = new DataSet();
SchoolWSReference.SchoolWSSoapClient schoolWs = newSchoolWSReference.SchoolWSSoapClient();
ds = schoolWs.GetStudent();
dataGridViewStudentInformation.DataSource = ds.Tables[0];
}}
WinForm Code
Call the Web Service method
Fill GridView
![Page 68: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/68.jpg)
68
Test it:
It works!!!
![Page 69: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/69.jpg)
69You are finished with the Exercise
![Page 70: Step by step Exercises · Exercises 1. Create Data Tier (Database) 2. Create Logic Tier (Database Communication Logic) Create Presentation Tier (User Interface Logic): 3. WebApp:](https://reader033.fdocuments.us/reader033/viewer/2022041709/5e46e12019eb1936f2433ead/html5/thumbnails/70.jpg)
Hans-Petter Halvorsen
University of South-Eastern Norwaywww.usn.no
E-mail: [email protected]: https://www.halvorsen.blog