Chương 1: Khởi động với kiến thức nền tảng 1. Lập trình Web là gì? Lập trình Web có thể được hiểu đơn giản là “code” ra một trang web hay nói cách khác là việc chúng ta “tạo” ra một website có thể vận hành được.1) Mối liên hệ giữa Thiết kế Web và Lập trình Web? Giống với việc xây dựng một ngôn nhà, thiết kế Web được hiểu như là việc thiết kế bản vẽ, tạo ra hình dáng bên ngoài, tức là hình ảnh khi nhìn vào, còn Lập trình Web sẽ chính là việc xây dựng nền móng, chọn nguyên vật liệu phù hợp để cấu thành cấu trúc cũng như những tiện nghi bên trong của ngôn nhà ấy. Đảm bảo nó vững chắc và bền bỉ theo thời gian.2 – Ví dụ về việc xây nhà với lập trình web) Tương tự, việc “xây” lên một website cũng đòi hỏi 2 bộ phận. Hay ta còn gọi là Front-end và Back-end.
Nôm na, Front-end làm giao diện còn Back-end làm hệ thống xử lý bên trong. Thông thường, thay vì tự thiết kế giao diện(công việc của Front-end), người ta có thể mua hoặc tải miễn phí những mẫu giao diện có sẵn để tiết kiệm thời gian và chi phí trong việc lập trình trang web. Tuy nhiên, thường để lập trình được phía sau đòi hỏi người làm Back-end phải có kiến thức về việc thiết kế Web vì vậy có thể nói 2 việc này bổ trợ cho nhau. Cần chuẩn bị những kiến thức gì trước khi học Lập trình Web? Để học ta cần phải có tất cả những kiến thức về Thiết kế Web như: HTML, CSS, Javascript.
Cách dùng thư viện Bootstrap. Tinh thần ham học hỏi và một bộ não bình thường. Ngoài ra, một số kỹ năng Google, tự rà lỗi và sửa chúng sẽ là một kỹ năng quang trọng. Tôi luôn khuyến khích học hỏi từ nhiều nguồn để có thể cải thiệ kỹ năng của mình.
9 Vậy là chúng ta đã khởi động xong, không để bạn đợi lâu nữa, nào chúng ta cùng bắt đầu khởi hành trên cuộc thành trình này nhé! 10 Chương 2: Nhập môn ASP.NET và mô hình MVC 1. Mô hình MVC là gì? MVC: viết tắt của Model – View – Controller.1 – Mô hình MVC) “Mô hình Model – View – Controller (MVC) là một mẫu kiến trúc lâu đời trong việc phát triển phần mềm, nó chia ứng dụng ra làm 3 thành phần: Models, View và Controllers. Mẫu hình này được tạo ra nhằm tách biệt các mối quan tâm với nhau, giúp việc triển khai một ứng dụng trở nên dễ dàng hơn. Nó hoạt động bằng cách chuyển các yêu cầu của người dùng đến Controller, cái mà sẽ chịu trách nhiệm làm việc với Model để có thể xử lý các yêu cầu của người dùng như truy xuất kết quả.
Controller cũng có nhiệm vụ chọn View để hiển thị trả về cho người dùng và cung cấp bất cứ dữ liệu nào mà người dùng mong muốn.” Về cấu trúc và cách hoạt động của nó có thể hình dung đơn giản như sau.2 – Minh hoạ mô hình MVC) Ta sẽ chia source code ra làm 3 phần: View sẽ hiển thị ra phần nhập form tiêu đề và nội dung. Controller lấy dữ liệu từ 2 trường và gửi tới Model. Model lúc này sẽ nhận dữ liệu từ Controller để lưu trữ trong cơ sở dữ liệu. Bạn có thể tưởng tượng, khi một yêu cầu từ máy client gửi tới server, Controller sẽ thực hiện nhiệm vụ của mình đó là tiếp nhận và xử lý yêu cầu.
Trong trường hợp cần thiết, nó có thể liên hệ Model(bộ phận làm việc với database) để hỗ trợ. Khi xử lý xong yêu cầu, kết quả sẽ được trả về View. Tại View sẽ tạo mã HTML thành giao diện và trả về hiển thị trên trình duyệt. Việc “chia để trị” này góp phần giúp cấu trúc MVC trở nên rõ ràng tạo hiệu quả cao trong việc phát triển phần mềm hay ứng dụng web.
Vậy là ta đã hiểu sơ lược về mô hình MVC, giờ việc áp dụng nó vào thực tế chúng ta cùng tìm hiểu tiếp theo nhé. Tìm hiểu về ASP.NET MVC Dựa trên nền tảng của mô hình MVC, Microsoft đã tạo ra ASP.NET MVC nhằm hiện thực hoá mô hình MVC trên quá trình phát triển ứng dụng Web.3 – Mô tả phạm vi hỗ trợ ASP.NET MVC là một thư viện để phát triển ứng dụng web (web application development framework) được phát triển bởi Microsoft, vốn được kế thừa từ. Nó giúp việc phát triển một ứng dụng web trở nên đơn giản, rõ ràng và sạch đẹp bằng cách tách biệt những phần code với nhau. Chúng ta có thể mở rộng và tuỳ chỉnh mã nguồn một cách dễ dàng.
Đồng thời đây cũng là phương pháp phát triển web mạnh nhất và phổ biến nhất trên nền ASP.NET hiện nay. Mô hình MVC phù hợp với các dự án với các đội ngũ làm việc độc lập với nhau, như vậy các công việc đều có thể được thực hiện một cách linh hoạt.4 – Minh hoạ cấu trúc MVC) Theo trang magenest.com thì ASP.NET MVC sẽ có tổng cộng tất cả các ưu và nhược điểm sau: 13 Ưu điểm: - Hỗ trợ quá trình phát triển nhanh chóng: Với đặc điểm hoạt động độc lập của từng thành phần, các lập trình viên có thể làm việc đồng thời trên từng bộ phận khác nhau của mô hình này. MVC giúp bạn tiết kiệm rất nhiều thời gian. - Khả năng cung cấp đồng thời nhiều khung View: Với mô hình MVC, bạn có thể tạo ra đồng thời nhiều khung View cho Model.
- Hỗ trợ các kỹ thuật không đồng bộ: MVC có thể hoạt động trên nền tảng JavaScript. Điều này có nghĩa là các ứng dụng MVC có thể hoạt động với các file PDF, các trình duyệt web cụ thể, và cả các widget máy tính. - Dễ dàng thao tác chỉnh sửa: Bộ phận Model hoạt động tách biệt với View đồng nghĩa với việc bạn có thể đưa ra các thay đổi, chỉnh sửa hoặc cập nhật dễ dàng ở từng bộ phận. - Giữ nguyên trạng thái data: Mô hình MVC truyền lại dữ liệu nhưng không định dạng lại dữ liệu.
Do đó, các dữ liệu này có thể được dùng lại cho các thay đổi sau này. - Hỗ trợ các nền tảng phát triển SEO: Với mô hình MVC, bạn có thể dễ dàng tạo ra các mã SEO URL để thu hút lượng truy cập đối với ứng dụng bất kỳ. Nhược điểm: - Khó khăn trong quá trình điều hướng code: Điều hướng khung có thể phức tạp vì mô hình này bao gồm nhiều lớp và yêu cầu người dùng thích ứng với các tiêu chí phân tách của MVC. - Không thích hợp việc phát triển các ứng dụng nhỏ: Vì mô hình này yêu cầu bạn lưu trữ một số lượng lớn các file.
- Nhiều khung hoạt động đồng thời: Việc phân tách một tính năng thành ba bộ phận khác nhau dễ dẫn đến hiện tượng phân tán. Do đó, đòi hỏi các nhà phát triển phải duy trì tính nhất quán của nhiều bộ phận cùng một lúc. (Nguồn: https://magenest.com/vi/mo-hinh-mvc-la-gi/) Phương thức hoạt động: 14 Được kế thừa từ ý tưởng của mô hình MVC, ASP.NET MVC cũng được chia làm 3 tầng mã nguồn: Model (tầng business – business layer) View (tầng hiển thị – display layer) Controller (điều khiển đầu vào – input control) Cụ thể nó sẽ có ý nghĩa như sau: Model: là một thành phần (component) trong mô hình MVC để quản lý dữ liệu kinh doanh hoặc dữ liệu miền, tức là trạng thái của ứng dụng trong bộ nhớ. Đây thường là những lớp (class) đại diện cho dữ liệu có thể được truy xuất bởi View và Controller.
Một model sẽ có cấu trúc như sau dưới ngôn ngữ C#: (Hình 2.5) View: là một thành phần để tương tác với người dùng, đó là tất cả những gì phía người dùng (người truy cập website) có thể nhìn thấy và tương tác. Đó chính là những dữ liệu được xuất ra với dạng một giao diện có thể tương tác.Những View này, nó hỗ trợ tất cả những cú pháp để chúng ta có thể thiết kế web với ngôn ngữ HTML. Có một điều khác biệt là chúng ta có thể viết C# để chạy cùng với HTML (hay còn gọi với một cái tên khác là Razor) để xử lý những yêu cầu cũng như truy xuất dữ liệu phía Controller. 15 Đây là một mẫu view viết với ngôn ngữ Razor: (Hình 2.6 – Code mẫu ngôn ngữ Razor) Controller: Là một lớp chứa những public methods được gọi là những Action, nó giúp xử lý những yêu cầu từ phía trình duyệt.
Đây thường là những lớp (class) được kế thừa từ System. Thành phần này tương tác với cả Model và View, nó chứ a những Action Method giúp xử lý những URL truy cập đến. Thông thường, ta sẽ dùng những class này để truyền dữ liệu ra giao diện View. Đây là một Controller mẫu: 16 (Hình 2.7 – Code mẫu Controller) Cho nên trong một project sẽ có tương ứng 3 thư mục chứa mã nguồn tách biệt nhau.8 – Cấu trúc thư mục của một project MVC) Vậy tại sao ta NÊN sử dụng ASP.NET trong việc phát triển ứng dụng web.
Ưu điểm nổi trội lớn nhất của ASP.NET này ở chỗ nó tách phần code và giao diện ra thành các thành phân riêng biệt, điều này đặc biệt quan trọng vì nó giúp tối ưu hoá quy 17 trình phát triển ứng dụng, giúp dễ quản lý, bảo trì nhưng vẫn đảm bảo hiệu suất cao nhất trong quá trình vận hành sử dụng. Cách để tạo một project ASP.NET MVC trên Visual Studio Lưu ý: Phần cài đặt Visual Studio ta sẽ không nói ở đây, tuy nhiên phần này rất đơn giản, bạn có thể cài bất kỳ phiên bản nào miễn là từ đời 2013 trở đi. Bước 1: Bạn mở Visual Studio lên, chọn File -> New -> Project, một cửa sổ New Project sẽ hiện lên. Trong cửa sổ này, phần bên trái, bạn chọn Visual C#, phần bên phải chọn ASP.NET Web Application, đặt tên dự án là gì cũng được rồi nhấn Next.9- Bảng chọn loại dự án Visual Studio) Bước 2: Lúc này phần mềm sẽ cho bạn các lựa chọn template bạn muốn, ở đây để cho nhanh, chúng ta chọn MVC phần mềm sẽ tự thiết lập ra những file cần thiết.
Sau đó bạn nhấn Next.10 – Bảng lựa chon template) Đợi một lúc chương trình sẽ hiện lên cửa số soạn thảo, nếu để ý bên phía tay phải, bạn sẽ thấy các thư mục của dự án như sau: (Hình 2.11 – Cấu trúc thư mục mới tạo) References: là nơi lưu trữ, thêm/bớt các thư viện DLL có liên quan đến website. 19 App_Data: là nơi chứa cơ sở dữ liệu dạng tập tin .MDF, để làm dự án thuận tiện bạn nên chọn làm cơ sở dữ liệu dạng này. App_Start: chứa các lớp cấu hình sẽ kích hoạt chạy trước khi dự án web chạy.