Tạo ứng dụng ASP.NET MVC đầu tiên
Trong phần này, chúng ta sẽ tạo một ứng dụng web ASP.NET MVC mới bằng Visual Studio và tìm hiểu các thành phần cơ bản của ứng dụng ASP.NET MVC.
Chúng ta sẽ sử dụng ASP.NET MVC 5 và phiên bản Visual Studio 2017 Community và .NET Framework 4.6 để tạo ứng dụng ASP.NET MVC đầu tiên của chúng ta.
Nếu bạn chưa có Visual Studeio thì có thể tải xuống phiên bản mới nhất tại https://visualstudio.microsoft.com/downloads/.
Mở Visual Studio 2017 và chọn menu File -> New -> Project, như hình ảnh bên dưới.
Từ hộp thoại New Project như được hiển thị trong hình ảnh bên dưới, mở rộng nút Visual C # và chọn Web ở khung bên trái, sau đó chọn ASP.NET Web Application (.NET Framework) trong ngăn giữa. Nhập tên dự án của bạn là MyMVCApplication (bạn có thể đặt tên cho ứng dụng tùy ý của mình). Ngoài ra, bạn có thể thay đổi vị trí của ứng dụng ASP.NET MVC bằng cách nhấp vào nút Browse… Cuối cùng, bấm OK.
Từ hộp thoại New ASP.NET Web Application, chọn MVC (nếu chưa được chọn) như hiển thị bên dưới.
Bạn cũng có thể thay đổi cơ chế xác thực bằng cách nhấp vào nút Change Authentication. Bạn có thể chọn chế độ xác thực phù hợp cho ứng dụng của mình, như hiển thị bên dưới.
Ở đây, chúng tôi sử dụng cơ chế xác thực mặc định cho ứng dụng của chúng tôi là No Authentication (Không xác thực). Nhấn OK để tiếp tục.
Đợi một lúc cho đến khi Visual Studio tạo một dự án ASP.NET MVC đơn giản bằng cách sử dụng mẫu mặc định, như hiển thị ở hình ảnh bên dưới.
Bây giờ, nhấn phím F5 để chạy dự án ở chế độ debug (gỡ lỗi) hoặc Ctrl + F5 để chạy dự án mà không cần debug. Nó sẽ mở trang chủ trong trình duyệt, như hiển thị trong hình bên dưới.
Dự án ASP.NET MVC 5 bao gồm các tập tin JavaScript và CSS của bootstrap 3.0 theo mặc định. Vì vậy, bạn có thể tạo các trang web responsive.
Giao diện người dùng sẽ thay đổi dựa trên kích thước màn hình của các thiết bị khác nhau. Ví dụ: thanh menu trên cùng sẽ được thay đổi trong các thiết bị di động, như hiển thị trong hình bên dưới.
Như vậy là bạn đã tạo ứng dụng ASP.NET MVC 5 đầu tiên của mình bằng Visual Studio 2017.
Cấu trúc thư mục ứng dụng ASP.NET MVC
Chúng ta đã tạo ứng dụng ASP.NET MVC 5 đầu tiên của chúng ta trong phần trước. Visual Studio tạo cấu trúc thư mục sau cho ứng dụng ASP.NET MVC theo mặc định.
Chúng ta sẽ lần lượt tìm hiểu ý nghĩa của từng thư mục.
App_Data
Thư mục App_Data có thể chứa các tập tin dữ liệu ứng dụng như LocalDB, tập tin .mdf, tập tin .xml và các tập tin liên quan đến dữ liệu khác. IIS sẽ không bao giờ cho phép truy cập các tập tin từ thư mục App_Data.
App_Start
Thư mục App_Start có thể chứa các lớp sẽ được thực thi khi ứng dụng khởi động. Thông thường, đây sẽ là các tập tin cấu hình như AuthConfig.cs, BundleConfig.cs, FilterConfig.cs, RouteConfig.cs, v.v. MVC 5 có các tập tin BundleConfig.cs, FilterConfig.cs và RouteConfig.cs theo mặc định. Chúng ta sẽ tìm hiểu ý nghĩa của các tập tin này sau.
Content
Thư mục Content chứa các tập tin tĩnh như tệp css, tập tin hình ảnh và biểu tượng. Ứng dụng ASP.NET MVC 5 bao gồm bootstrap.css, bootstrap.min.css và Site.css theo mặc định.
Controllers
Thư mục Controllers chứa các lớp controller. Controller xử lý yêu cầu của người dùng và trả về một phản hồi. ASP.NET MVC yêu cầu tên của tất cả các lớp controller kết thúc bằng “Controller”. Bạn sẽ tìm hiểu về controller trong phần tiếp theo.
fonts
Thư mục fonts chứa các tập tin phông chữ tùy chỉnh cho ứng dụng của bạn.
Models
Thư mục Models chứa các lớp mô hình (model). Thông thường lớp mô hình bao gồm các thuộc tính public, sẽ được ứng dụng sử dụng để lưu trữ và xử lý dữ liệu ứng dụng.
Scripts
Thư mục Scripts chứa các tập tin Javascript hoặc VBScript cho ứng dụng. ASP.NET MVC 5 có các tập tin javascript là bootstrap.js, jquery-x.x.js và modernizer-x.x.js theo mặc định.
Views
Thư mục Views chứa các tập tin làm giao diện cho ứng dụng. Thông thường view là tập tin .cshtml, nơi bạn viết mã html kết hợp với C#.
Thư mục Views có các thư mục riêng cho mỗi controller. Ví dụ: tất cả các tập tin .cshtml của HomeController sẽ nằm trong thư mục Views > Home.
Thư mục Shared trong thư mục Views chứa tất cả các view sẽ được chia sẻ giữa các controller khác nhau, ví dụ: tập tin _Layout.cshtml.
Ngoài ra, dự án ASP.NET MVC cũng có các tập tin cấu hình sau:
Global.asax
Tập tin Global.asax cho phép bạn viết code để phản hồi với các sự kiện ở cấp ứng dụng, chẳng hạn như Application_BeginRequest, application_start, application_error, session_start, session_end, v.v.
Packages.config
Tập tin Packages.config được NuGet quản lý để theo dõi các gói và phiên bản bạn đã cài đặt trong ứng dụng.
Web.config
Tập tin Web.config chứa cấu hình cấp ứng dụng.
Tìm hiểu cách ASP.NET MVC xử lý yêu cầu bằng cách sử dụng routing trong phần tiếp theo.