Lab01 - Giới Thiệu Về ASP.NET MVC 5 - Bài 01 | DEVMASTER

Trang chủ » Tìm Hiểu Về Asp.net Mvc » Lab01 - Giới Thiệu Về ASP.NET MVC 5 - Bài 01 | DEVMASTER

Có thể bạn quan tâm

Apr - 2021 23 Lab01 - Giới thiệu về ASP.NET MVC 5 - Bài 01 Cẩm nang chia sẻ kiến thức

Lab 01

Introduction to ASP.NET MVC 5

Mục tiêu

  • Biết tạo một Project ASP.NET trống và khởi tạo các thành phần Controller, View.
  • Biết tạo một Project ASP.NET MVC 5 dựa trên template có sẵn và customize các thành phần.

Tạo ứng dụng ASP.NET MVC 5 Empty và thực hiện công việc sau:

  • Tạo một HomeController với các Action: Index, About.
  • Tạo 2 view ứng với 2 action trên (sử dụng _Layout để bố cục chung)

Bước 1: Mở Visual Studio 2019 -> vào File -> New -> Projects -> Chọn Web -> ASP.NET Web Appliction -> Nhập tên project -> Chọn đường dẫn lưu trữ -> Nhập tên solution -> Nhấn OK (xem hình dưới).

create solution

ASPnet mvc 5

  • Nhập tên và chọn Add

tạo controller

  • Code gợi ý cho controller

// GET: /Home/Index

public ActionResult Index()

{

//sử dung ViewBag để đưa dữ liệu ra View

ViewBag.message = "Chào mừng bạn đến với ASP.NET MVC 5";

return View();

}

//GET: /Home/About

public ActionResult About()

{

//sử dung ViewBag để đưa dữ liệu ra View

ViewBag.message = "Đây là trang About";

return View();

}

Bước 3: Tạo các view ứng với 2 action trong Controller.

  • Trong code Controller > kích chuột phải vào action Index chọn Add View

tạo view

  • Nhập các thông số như hình và nhấn Add

đặt tên view index

  • Code Razor gợi ý như sau:

@{

ViewBag.Title = "Trang chủ";

}

<h2>Trang chủ</h2>

<hr />

<h3>@ViewBag.message</h3>

  • Tạo View About.cshtml làm tương tự như view Index, code Razor gợi ý như sau:

@{

ViewBag.Title = "About";

}

<h2>Giới thiệu về ASP.NET MVC</h2>

<p>

MVC không phải là một mô hình lập trình mới lạ gì, và thậm chí, nó còn ra đời từ rất sớm. Có thể nói ASP.NET MVC là mô hình lập trình web chiến lược của Microsoft. Do đó, đối với những ai yêu mến và đi theo .NET, phát triển ứng dụng web với ASP.NET MVC sẽ là một kỹ năng không thể thiếu được.

</p>

Bước 4: Mở Views/Shared/_Layout.cshtml sửa lại code như sau:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>@ViewBag.Title - My ASP.NET Application</title>

</head>

<body>

<nav style="background-color:#e1c9c9">

@Html.ActionLink("Trang chủ", "Index", "Home", null, new { @class = "navbar-brand" })

/

@Html.ActionLink("Giới thiệu", "About", "Home", null, new { @class = "navbar-brand" })

<hr />

</nav>

<div>

@RenderBody()

<hr />

<footer>

<p>&copy; @DateTime.Now.Year - Phòng chuyên môn Devmaster</p>

</footer>

</div>

</body>

</html>

Bước 5: Chạy và kiểm tra kết quả trang chủ

chạy ứng dụng

Trang giới thiệu

Trang giới thiệu

Nguồn: Devmaster

Từ khóa » Tìm Hiểu Về Asp.net Mvc