ASP.NET คือ ตอนที่ 2 : Model-View-Controller (MVC)

  1. ทำความเข้าใจกับสถาปัตยกรรม MVC
  2. ทำแอปพลิเคชัน ASP.NET MVC
  3. การกำหนดเส้นทาง (Routing) ใน MVC
  4. Controllers และ Actions ใน MVC
  5. View Models และการผูกข้อมูล (Data Binding)
  6. Razor Views
  7. การทำงานกับข้อมูล – Entity Framework

ASP.NET MVC เป็นเฟรมเวิร์กที่ทรงพลังมายาวนานสำหรับการทำเว็บแอปพลิเคชัน ทำให้นักพัฒนามีแนวทางที่ชัดเจนและเป็นระเบียบเพื่อการทำแอพโครงการเว็บที่ซับซ้อน ด้วยสถาปัตยกรรม Model-View-Controller (MVC) ASP.NET MVC สนับสนุนการทำแอพโดยแยกข้อกังวลออกจากกันอย่างชัดเจน ในบทความนี้ เราจะสำรวจ ASP.NET MVC ในเชิงลึก โดยเน้นที่สถาปัตยกรรม ส่วนประกอบหลัก และความเข้ากันได้ของขอบเขตที่กว้างขึ้นของการทำแอพและทำเว็บ

1. ทำความเข้าใจกับสถาปัตยกรรม MVC

ขั้นตอนแรกในการใช้ประโยชน์จาก ASP.NET MVC คือการทำความเข้าใจสถาปัตยกรรม MVC ซึ่งเป็นแกนหลักของเฟรมเวิร์ก MVC เป็นรูปแบบทางสถาปัตยกรรมที่ใช้ในวิศวกรรมซอฟต์แวร์ที่แยกลอจิกของแอปพลิเคชันออกเป็นส่วนประกอบที่เชื่อมต่อถึงกันสามส่วน:

  1. โมเดล (Model): แสดงโครงสร้างข้อมูลของแอปพลิเคชัน จัดการตรรกะที่เกี่ยวข้องกับข้อมูล โดยทั่วไปจะเกี่ยวข้องกับการโต้ตอบกับฐานข้อมูลและการตรวจสอบความถูกต้องของข้อมูล
  2. View: จัดการการแสดงข้อมูลให้กับผู้ใช้ โดยพื้นฐานแล้วประกอบด้วยอินเทอร์เฟซผู้ใช้ของแอปพลิเคชัน
  3. Controller: ทำหน้าที่เป็นส่วนต่อประสานระหว่าง Model และ View โดยจะประมวลผลคำขอที่เข้ามา โต้ตอบกับโมเดลเพื่อดำเนินการกับข้อมูลที่จำเป็น และเลือกมุมมองที่จะแสดงผลแก่ผู้ใช้

สถาปัตยกรรม MVC มีจุดมุ่งหมายเพื่อแยกการแสดงข้อมูลจากการโต้ตอบของผู้ใช้กับมัน การแยกนี้ส่งผลให้เกิดรหัสที่เป็นระเบียบและบำรุงรักษาได้ซึ่งเป็นไปตามหลักการความรับผิดชอบเดียว นอกจากนี้ยังสนับสนุนการแยกส่วนประกอบของซอฟต์แวร์ ซึ่งช่วยให้การทดสอบและการพัฒนาอย่างอิสระสะดวกสบายมากขึ้น

2. ทำแอปพลิเคชัน ASP.NET MVC

การทำแอพใน ASP.NET MVC เริ่มต้นด้วยการตั้งค่าโครงการใหม่ใน Visual Studio หรือ IDE ที่ต้องการที่รองรับการทำแอพ .NET คุณสามารถเลือกเทมเพลต MVC ในขณะที่สร้างโปรเจ็กต์ใหม่ ซึ่งจะตั้งค่าโครงสร้างโฟลเดอร์ MVC ที่จำเป็นโดยอัตโนมัติ: โมเดล มุมมอง และคอนโทรลเลอร์

โฟลเดอร์ Models คือตำแหน่งที่ตั้งธุรกิจและตรรกะการตรวจสอบ ขณะที่โฟลเดอร์ Views มีไฟล์ที่สร้างอินเทอร์เฟซผู้ใช้ ในขณะเดียวกัน โฟลเดอร์ Controllers จะมีคลาสที่จัดการคำขอของผู้ใช้ โต้ตอบกับโมเดล และเลือกมุมมองที่จะแสดงผล

3. การกำหนดเส้นทาง (Routing) ใน MVC

การกำหนดเส้นทางเป็นลักษณะพื้นฐานของแอปพลิเคชัน MVC ใดๆ ASP.NET MVC ใช้เครื่องมือกำหนดเส้นทางที่แมป URL กับการทำงานของตัวควบคุม เอ็นจิ้นการกำหนดเส้นทางใช้ข้อตกลงรูปแบบเพื่อกำหนดว่าคอนโทรลเลอร์และแอคชันใดที่จะเรียกใช้เมื่อผู้ใช้ส่งคำขอ

ในไฟล์ ‘RouteConfig.cs’ เส้นทางเริ่มต้นถูกกำหนดเป็น: “{controller}/{action}/{id}” รูปแบบนี้ช่วยให้ routing engine สามารถแยกวิเคราะห์ URL ขาเข้า และส่งคำขอไปยัง Controller และ Action ที่เหมาะสม

ASP.NET MVC ยังรองรับการกำหนดเส้นทางแอตทริบิวต์ ซึ่งเส้นทางถูกกำหนดเหนือคอนโทรลเลอร์หรือการดำเนินการโดยใช้แอตทริบิวต์เส้นทาง คุณสมบัตินี้ให้ความยืดหยุ่นมากขึ้นและควบคุมการกำหนดเส้นทางของแอปพลิเคชันของคุณ

4. Controllers และ Actions ใน MVC

คอนโทรลเลอร์ (Controllers) ใน ASP.NET MVC มีหน้าที่ตอบสนองต่ออินพุตของผู้ใช้ ทำงานกับโมเดล และเลือกมุมมองที่จะเรนเดอร์ คอนโทรลเลอร์แต่ละตัวเป็นคลาสที่สืบทอดมาจากคลาสพื้นฐาน ‘Controller’ ประกอบด้วยวิธีการดำเนินการที่จัดการคำขอ HTTP

วิธีการ Actions ส่งคืน ActionResult ซึ่งสามารถเป็นมุมมอง ไฟล์ สตริง หรือคำสั่งเปลี่ยนเส้นทางไปยังวิธีการดำเนินการหรือตัวควบคุมอื่น อยู่ในวิธีการดำเนินการเหล่านี้ที่ตรรกะของแอปพลิเคชันเพื่อโต้ตอบกับโมเดลและเลือกมุมมองที่เหมาะสมจะถูกวางไว้

5. View Models และการผูกข้อมูล (Data Binding)

ASP.NET MVC รองรับการเชื่อมโยงข้อมูล ซึ่งเป็นกระบวนการสร้างการเชื่อมต่อระหว่าง UI ของแอปพลิเคชันกับตรรกะทางธุรกิจ การเชื่อมโยงข้อมูลใน MVC มักจะดำเนินการผ่าน View Models

View Models ได้รับการออกแบบมาโดยเฉพาะเพื่อจัดหาข้อมูลให้กับ Views ช่วยให้คุณสามารถกำหนดรูปร่างหลายเอนทิตีจากโมเดลให้เป็นวัตถุเดียวที่มุมมองสามารถจัดการได้ง่าย กระบวนการนี้ให้คุณควบคุมข้อมูลที่จะส่งไปยัง Views ของคุณ เพิ่มความปลอดภัยและประสิทธิภาพ

6. Razor Views

Razor เป็นเครื่องมือสร้างเทมเพลตที่ใช้โดย ASP.NET MVC เพื่อสร้าง HTML แบบไดนามิก มีไวยากรณ์ที่เน้นการเขียนโค้ดที่ลื่นไหล เข้าใจและใช้งานได้ง่าย

มุมมอง Razor (ไฟล์ .cshtml) สามารถมีโค้ด C# ซึ่งช่วยให้นักพัฒนาสามารถสร้างหน้าเว็บไดนามิกที่ซับซ้อนได้ ไวยากรณ์ของ Razor นั้นสะอาดและกระชับ ผสานรวมกับ HTML ได้อย่างราบรื่นและให้ประสบการณ์นักพัฒนาที่ราบรื่น

7. การทำงานกับข้อมูล – Entity Framework

Entity Framework เป็นตัวเลือกการเข้าถึงข้อมูลยอดนิยมด้วย MVC สำหรับนักพัฒนา .NET เป็น Object-Relational Mapper (ORM) ที่ทำให้การเข้าถึงข้อมูลง่ายขึ้นโดยอนุญาตให้นักพัฒนาโต้ตอบกับฐานข้อมูลโดยใช้วัตถุ .NET แนวทางนี้ช่วยลดความจำเป็นสำหรับรหัสการเข้าถึงข้อมูลส่วนใหญ่ที่นักพัฒนามักจะต้องเขียน

ด้วย Entity Framework คุณสามารถดำเนินการสร้าง อ่าน อัปเดต และลบ (CRUD) โดยไม่ต้องเขียนโค้ด SQL คุณกำหนดโมเดลข้อมูลโดยใช้คลาส .NET และ Entity Framework จะสร้างฐานข้อมูลให้คุณ


ASP.NET MVC ให้แนวทางที่มีประสิทธิภาพ ปรับขนาดได้ และบำรุงรักษาได้เพื่อทำเว็บแอปพลิเคชัน ด้วยการปฏิบัติตามรูปแบบ MVC จะช่วยให้โค้ดที่เชื่อมต่อกันหลวมๆ สะอาดตา ซึ่งแยกข้อกังวลเกี่ยวกับข้อมูล การแสดงผล และการโต้ตอบของผู้ใช้ของแอปพลิเคชัน

ด้วยการเรียนรู้ ASP.NET MVC คุณจะไม่เพียงแค่เรียนรู้เฟรมเวิร์กเท่านั้น คุณกำลังใช้รูปแบบการออกแบบที่ใช้กันอย่างแพร่หลายในอุตสาหกรรม ปรับปรุงพฤติกรรมการเขียนโค้ดของคุณ และทำให้ง่ายต่อการเจาะลึกเทคโนโลยีอื่นๆ ที่คล้ายคลึงกัน ทักษะที่คุณได้รับจะพิสูจน์ได้ว่ามีค่าเมื่อคุณก้าวหน้าในสายอาชีพการทำแอพและทำเว็บ


ASP.NET คืออะไร

ASP.NET คือ ตอนที่ 1 : การทำเว็บแอปพลิเคชันด้วยเว็บฟอร์ม (Web Forms)
ASP.NET คือ ตอนที่ 3 : การสร้างบริการ (Services) HTTP Web API