งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

ทส215 การเขียนโปรแกรมบนเว็บ 1 อาจารย์อรรถวิท ชังคมานนท์ สาขาวิชาเทคโนโลยีสารสนเทศ คณะวิทยาศาสตร์ ASP.NET MVC.

งานนำเสนอที่คล้ายกัน


งานนำเสนอเรื่อง: "ทส215 การเขียนโปรแกรมบนเว็บ 1 อาจารย์อรรถวิท ชังคมานนท์ สาขาวิชาเทคโนโลยีสารสนเทศ คณะวิทยาศาสตร์ ASP.NET MVC."— ใบสำเนางานนำเสนอ:

1 ทส215 การเขียนโปรแกรมบนเว็บ 1 อาจารย์อรรถวิท ชังคมานนท์ สาขาวิชาเทคโนโลยีสารสนเทศ คณะวิทยาศาสตร์ ASP.NET MVC Framework

2 2 MVC  สิ่งหนึ่งในรูปแบบเหล่านี้คือ โมเดล วิว คอนโทรลเลอร์ (Model View Controller หรือ MVC) กำเนิดขึ้นในภาษาสมอลทอล์ค (Smalltalk) ในวิธีนี้ ระบบจะถูกแบ่งออกเป็น 3 คอมโพเนนต์ ประกอบด้วย  โมเดล (Model)  วิว (View)  คอนโทรลเลอร์ (Controller)  MVC แสดงให้เห็นประโยชน์ของมันในการโต้ตอบกับผู้ใช้ด้วยการแสดงผลที่ หน้าจอหลากหลายของข้อมูลเดียวกัน สนับสนุนการนำรหัสต้นฉบับ (Source code) มาใช้ใหม่และช่วยให้นักพัฒนามุ่งสนใจกับหน้าตาแอพพลิเคชัน(วิว) เดียว โดยไม่สนหน้าตาแอพพลิเคชันส่วนอื่น เพราะแต่ละส่วนได้นำข้อมูล ของส่วนกลางมาแสดงผล ข้อมูลไม่ได้ขึ้นกับหน้าตาแอพพลิเคชันใด การ เปลี่ยนแปลงส่วนใดส่วนหนึ่งของคอมโพเนนต์จะไม่ส่งผลกระทบต่อ คอมโพเนนต์อื่นตามไปด้วย

3 3 Model  "Models" คือส่วนของ components ในระบบมีหน้าที่สำหรับจัดการส่วนของ Object State (Data + Value)  เป็น Class ที่ออกแบบมาเพื่อ get/set Attribute ซึ่งส่วนใหญ่จะใช้งาน ประยุกต์ร่วมกับข้อมูลปกติที่จัดเก็บใน database แล้วส่งต่อไปยังส่วนของ View เพื่อกำหนด Format ของการแสดงผลต่อไป  สามารถใช้งานร่วมกับส่วนของ View หลายหน้าจอได้โดยไม่ต้อง เปลี่ยนแปลง code ใดๆ จึงทำให้สะดวกในการตรวจสอบ reusable  หากกรณีที่ข้อมูลที่ได้รับมาไม่ถูกต้องก็ให้ทำการตรวจสอบระบบที่ส่วนของ Controller ซึ่งเป็นส่วนที่มีการคำนวณประมวลผลแล้วส่งผลลัพธ์ไว้ที่ Model

4 4 View  “Views" คือส่วนของ components ในระบบมีหน้าที่สำหรับจัดการส่วนของ การแสดงผลแก่ผู้ใช้งาน(User Interface)  MVC model สามารถมีส่วนของการแสดงผลได้หลายประเภทเช่น WEB- FORMS, HTML, XML/XSLT, XTML, and WML or can be Windows forms etc.  View สามารถแสดงผลในแบบที่เป็น Graphical data presentation ได้เพื่อ ความน่าเชื่อถือของข้อมูล look and feel, formatting, sorting etc.  การทำงานของ View จะแยกออกจากการประมวลผลข้อมูลที่ซับซ้อน เช่น ระบบของการซื้อขายสินค้า Online product catalog การทำงานส่วนของ view จะทำหน้าที่เพียงรับข้อมูลจาก Model มาจัดรูปแบบให้ถูกต้องและ สวยงามแล้วแสดงผลทางหน้าจอแก่ผู้ใช้งานระบบต่อไป ซึ่งจะไม่เกี่ยวของ กับการ database connection, query, tables etc.

5 5 Controller  "Controllers" คือส่วนของ components ในระบบมีหน้าที่สำหรับจัดการส่วน ของการประมวลผลคำสั่งการทำงานต่างๆ แล้วส่งผลลัพธ์ในรูปแบบของ model จากนั้นจะส่งต่อไปยังview.  Handles and Responds to user input and interaction.  = Method

6 6  ประโยชน์อย่างหนึ่งของการออกแบบระบบแบบ MVC methodology คือช่วยแบ่งแยกการทำงาน เป็นส่วนๆ อย่างชัดเจน ซึ่งจะทำให้การปรับปรุง ตรวจสอบ แก้ไขระบบเป็นไปได้ง่ายยิ่งขึ้น  MVC pattern ยังมีส่วนช่วยในการทดสอบระบบ แบบ Red/Green Test Driven Development (TDD)

7 7 MVC Structure

8 8

9 9 Activity

10 10 MVC Sequence Diagram

11 11 Benefits  Since MVC handles the multiple views using the same enterprise model it is easier to maintain, test and upgrade the multiple system.  It will be easier to add new clients just by adding their views and controllers.  Since the Model is completely decoupled from view it allows lot of flexibilities to design and implement the model considering reusability and modularity. This model also can be extended for further distributed application.  It is possible to have development process in parallel for model, view and controller.  This makes the application extensible and scalable.

12 12 Drawbacks  Requires high skilled experienced professionals who can identify the requirements in depth at the front before actual design.  It requires the significant amount of time to analyze and design.  This design approach is not suitable for smaller applications. It Overkills the small applications.

13 13 Sample Code : XML  Business Entity

14 14 ASPX protected MVCDesignCSharp.XMLData.Orders ordersDataSet; private void Button1_Click(object sender, System.EventArgs e){ BizOrderManager.GetOrderList(ordersDataSet); if(DataGrid1.Visible==false){ DataList1.Visible =false; DataGrid1.Visible =true; DataGrid1.DataBind(); Button1.Text="Show View 1"; }else { DataList1.Visible =true; DataGrid1.Visible =false; DataList1.DataBind(); Button1.Text="Show View 2"; } private void Button2_Click(object sender, System.EventArgs e){ BizOrderManager.GetOrderList(ordersDataSet); DataList1.Visible =true; DataGrid1.Visible =true; DataList1.DataBind(); DataGrid1.DataBind(); Button1.Text="Show Only View 2"; }

15 15 Business Objects public static void GetOrderList(DataSet OrderDS){ OrderDS.ReadXml(AppDomain.CurrentDomain.BaseDirectory + "/XMLData/Orders.xml"); }

16 16 Sample Code

17 17 Site Structure

18 18 Database  Table: Photos

19 19 Photos.aspx The following files were found in your Upload folder. Click on Import to import thesepictures to your photo album. This operation may take afew moments. View

20 20 Photos.aspx.cs protected void Button1_Click(object sender, ImageClickEventArgs e) { DirectoryInfo d = new DirectoryInfo(Server.MapPath("~/Upload")); foreach (FileInfo f in d.GetFiles("*.jpg")) { byte[] buffer = new byte[f.OpenRead().Length]; f.OpenRead().Read(buffer, 0, (int)f.OpenRead().Length); PhotoManager.AddPhoto(Convert.ToInt32( Request.QueryString["AlbumID"]), f.Name, buffer); } GridView1.DataBind(); } Controller

21 21 PhotoManager.cs Controller

22 22 PhotoManager.cs public static void AddPhoto(int AlbumID, string Caption, byte[] BytesOriginal) { using (SqlConnection connection = new SqlConnection( ConfigurationManager.ConnectionStrings["Personal"].ConnectionString)) { using (SqlCommand command = new SqlCommand("AddPhoto", connection)) { command.CommandType = CommandType.StoredProcedure; command.Parameters.Add(new AlbumID)); command.Parameters.Add(new Caption)); command.Parameters.Add(new BytesOriginal)); command.Parameters.Add(new ResizeImageFile(BytesOriginal, 600))); command.Parameters.Add(new ResizeImageFile(BytesOriginal, 198))); command.Parameters.Add(new ResizeImageFile(BytesOriginal, 100))); connection.Open(); command.ExecuteNonQuery(); } Controller

23 23 Photos.aspx Photo Caption View

24 24 Photos.aspx Mapping Method of “PhotoManager” Call Controller “PhotoManager” View

25 25 Photo.cs public class Photo { private int _id; private int _albumid; private string _caption; public int PhotoID { get { return _id; } } public int AlbumID { get { return _albumid; } } public string Caption { get { return _caption; } } public Photo(int id, int albumid, string caption) { _id = id; _albumid = albumid; _caption = caption; } Model

26 26 Controller with Model public static List GetPhotos(int AlbumID) { using (SqlConnection connection = new SqlConnection(ConfigurationManager.ConnectionStrings["Personal"].ConnectionString)) { using (SqlCommand command = new SqlCommand("GetPhotos", connection)) { command.CommandType = CommandType.StoredProcedure; command.Parameters.Add(new AlbumID)); bool filter = !(HttpContext.Current.User.IsInRole("Friends") || HttpContext.Current.User.IsInRole("Administrators")); command.Parameters.Add(new filter)); connection.Open(); List list = new List (); using (SqlDataReader reader = command.ExecuteReader()) { while (reader.Read()) { Photo temp = new Photo( (int)reader["PhotoID"], (int)reader["AlbumID"], (string)reader["Caption"]); list.Add(temp); } return list; }

27 27


ดาวน์โหลด ppt ทส215 การเขียนโปรแกรมบนเว็บ 1 อาจารย์อรรถวิท ชังคมานนท์ สาขาวิชาเทคโนโลยีสารสนเทศ คณะวิทยาศาสตร์ ASP.NET MVC.

งานนำเสนอที่คล้ายกัน


Ads by Google