đồ án môn học lập trình web

- Xác định yêu cầu, thu thập thông tin và các dữ liệu liên quan  Yêu cầu chức năng: Các chức đầy đủ và tiên nghi cho người dùng  Yêu cầu phi chức năng: Giao diện và hiệu ứng đẹp và vừa

-BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC NGUYỄN TẤT THÀNH

KHOA CÔNG NGHỆ THÔNG TIN

ĐỒ ÁN MÔN HỌC

Lập trình web Tên đề tài:

Môn học : Lập trình web

Giảng viên : BÙI DUY TÂN

Học kỳ 1 Năm 2023 - 2024

X

LỜI MỞ ĐẦU

Để hoàn thành được đề tài đồ án Lập trình web này, trước hết nhóm em xin gửi lời cảm ơn đến Thầy Bùi Duy Tân giáo viên Khoa Công nghệ Thông tin, trường Đại học Nguyễn Tất Thành đã tận tình

MỤC LỤC

Thông tin chung 1

Chương 1 Tổng quan 2

1.1 Mô tả tóm tắt về website 2

1.2 Cơ sở lý thuyết 2

Chương 2 Phân tích và hoạch định 3

2.1 Các module chức năng: Trình bày sơ đồ chức năng 3

2.2 Site map: Trình bày sơ đồ liên kết 3

2.3 Database diagram: Mô tả lược đồ quan hệ 3

2.4 GUI: Mô tả giao diện các các nhóm trang web của website 3

Chương 3 Triển khai ứng dụng web 4

3.1 Thiết kế giao diện: Trình bày các bước thiết kế, công cụ sử dụng và kết quả 4

3.2 Thiết kế dữ liệu: Trình bày sơ đồ dữ liệu và chi tiết các bảng 4

3.3 Thiết kế xử lý: Trình bày chi tiết các bước cài đặt các module chức năng 4

3.4 Bảo mật website 4

3.5 Kiểm tra và xuất bản website 4

Chương 4 Kết luận 5

4.1 Kết quả đạt được 5

4.2 Những hạn chế và hướng mở rộng 5

TÀI LIỆU THAM KHẢO 5

DANH MỤC HÌNH ẢNH

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

Nội dung báo cáo Đồ án môn học Lập trình Web

Thông tin chung

Tên đồ án:

Nhóm:

- Sinh viên 2: Nguyễn Xuân Minh MSSV: 2100007983

Phân công thực hiện (Mô tả cụ thể công việc của từng thành viên)

- Sinh viên 1:

- Sinh viên 2:

SV thực hiện: SV1 – SV2

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

Chương 1 Tổng quan

1.1 Mô tả tóm tắt về website

- Đồ án mà nhóm quyết định làm là lập trình một shop bán giày thể thao và các loại giày để đánh vào nhu cầu của giới trẻ hiện tại

- Xác định yêu cầu, thu thập thông tin và các dữ liệu liên quan

 Yêu cầu chức năng: Các chức đầy đủ và tiên nghi cho người dùng

 Yêu cầu phi chức năng: Giao diện và hiệu ứng đẹp và vừa đủ để cho khách hàng không bị khó chịu khi mua sắm

 Nguồn thông tin và dữ liệu: Nguồn thông tin về sản phẩm đầy đủ về hình ảnh

và thông tin văn bản 1.2 Cơ sở lý thuyết

1.2.1 MVC

MVC là viết tắt của Model-View-Controller, là một mô hình kiến trúc phần mềm được

sử dụng phổ biến trong phát triển ứng dụng, đặc biệt là lập trình web Mô hình này chia ứng dụng thành ba thành phần chính với chức năng riêng biệt:

 Model: Là thành phần của ứng dụng tương ứng với tất cả logic liên quan đến miền dữ liệu (data domain) Nó chứa tất cả logic dữ liệu của ứng dụng, bao gồm cả việc truyền dữ liệu giữa các thành phần View và Controller

 View: Là thành phần hiển thị thông tin cho người dùng Nó đảm nhiệm việc hiển thị dữ liệu từ Model và tương tác với người dùngView không xử lý logic nghiệp vụ, chỉ đơn thuần hiển thị thông tin

 Controller: Là thành phần xử lý sự kiện từ người dùng và tương tác với Model

và ViewController đảm nhiệm điều phối luồng dữ liệu giữa Model và View, cũng như xử lý logic nghiệp vụ

1.2.2 CSS

CSS là viết tắt của Cascading Style Sheets (tạm dịch là Tập tin Định kiểu Theo tầng) Đây là ngôn ngữ được sử dụng để định dạng giao diện của trang web, bao gồm màu sắc, font chữ, bố cục, hiệu ứng, v.v

Chức năng:

 Kiểm soát giao diện của trang web: Cho phép người dùng thay đổi màu sắc, font chữ, kích thước, vị trí, v.v của các phần tử trong trang web

 Tạo bố cục trang web: Cho phép người dùng bố trí các phần tử trong trang web một cách hợp lý và khoa học

 Thêm hiệu ứng cho trang web: Cho phép người dùng thêm các hiệu ứng như chuyển động, đổ bóng, v.v vào trang web

1.2.3 JavaScript

JavaScript là một ngôn ngữ lập trình được sử dụng để tạo ra các trang web tương tác

và năng động Nó hoạt động cùng với HTML và CSS để thêm chức năng cho trang web

Chức năng:

SV thực hiện: SV1 – SV2

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

 Xử lý sự kiện: JavaScript có thể xử lý các sự kiện của người dùng như nhấp chuột, di chuột, v.v

 Tạo hiệu ứng: JavaScript có thể tạo ra các hiệu ứng như chuyển động, đổ bóng, v.v

 Truy cập dữ liệu: JavaScript có thể truy cập và xử lý dữ liệu từ các nguồn khác nhau như JSON, XML, v.v

 Lập trình ứng dụng web: JavaScript có thể được sử dụng để phát triển các ứng dụng web hoàn chỉnh

1.2.4 ActionResult

ActionResult là một lớp trừu tượng trong ASP.NET MVC đại diện cho kết quả của một hành động trong bộ điều khiển (controller) Nó là một kiểu trả về chung cho phép người dùng trả về nhiều loại kết quả khác nhau từ một hành động, bao gồm:

 View: Hiển thị một trang web bằng cách sử dụng Razor view engine

 PartialView: Hiển thị một phần nhỏ của trang web bằng cách sử dụng Razor view engine

 Json: Trả về dữ liệu được định dạng JSON

 Redirect: Chuyển hướng người dùng đến một URL khác

 File: Trả về một tệp tin cho người dùng

 Content: Trả về một chuỗi văn bản cho người dùng

 StatusCode: Trả về mã trạng thái HTTP cho người dùng

1.2.5 ActionLink

ActionLink là một helper method trong ASP.NET MVC được sử dụng để tạo một liên kết đến một hành động trong bộ điều khiển (controller) Khi người dùng nhấp vào liên kết, trình duyệt sẽ gửi một yêu cầu HTTP đến hành động được chỉ định

 Cú pháp:

@Html.ActionLink("Text", "Action", "Controller", new {routeValues})

@Html.ActionLink("Trang chủ", "Index", "Home")

 Chú thích:

+ Text: Văn bản hiển thị cho liên kết

+ Action: Tên hành động trong bộ điều khiển

+ Controller: Tên bộ điều khiển

+ routeValues: (Tùy chọn) Các giá trị định tuyến để truyền cho hành động

Bổ sung thêm: ActionLink có thể thêm class vào bên trong nó như thẻ <a herf=””>

 Cú pháp:

@Html.ActionLink("Text", "Action", "Controller", null, new {@class=””})

1.2.6 Ngôn ngữ HTML

SV thực hiện: SV1 – SV2

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

HTML là viết tắt của HyperText Markup Language, hay còn gọi là Ngôn ngữ Đánh dấu Siêu văn bản Đây là ngôn ngữ nền tảng được sử dụng để tạo ra các trang web trên World Wide Web Nó hoạt động như một bộ hướng dẫn cung cấp cho trình duyệt web biết cách hiển thị nội dung trên màn hình

HTML là ngôn ngữ đánh dấu vì nó không chứa các hướng dẫn lập trình phức tạp

mà chỉ đơn giản là sử dụng các thẻ để đánh dấu các phần khác nhau của trang web, như tiêu đề, đoạn văn, hình ảnh, liên kết, v.v

1.2.1 Cấu trúc HTML

Trong đó:

 <!DOCTYPE html>: Khai báo kiểu dữ liệu hiển thị.

 <html> và </html>: Cặp thẻ bắt buộc, element cấp cao nhất, có nhiệm vụ

đóng gói tất cả nội dung của trang HTML

 <head> và </head>: Khai báo các thông tin meta của trang web như: tiêu đề

trang, charset

 <title> và </title>: Cặp thẻ nằm trong thẻ <head>, dùng để khai báo tiêu đề

cho trang

 <body> và </body>: Cặp thẻ dùng để đóng gói tất cả các nội dung sẽ hiển thị

trên trang

1.2.7 C#

C# (hay C sharp) là một ngôn ngữ lập trình đơn giản, được phát triển bởi đội ngũ kỹ sư của Microsoft vào năm 2000 C# là ngôn ngữ lập trình hiện đại, hướng đối tượng

và được xây dựng trên nền tảng của hai ngôn ngữ mạnh nhất là C++ và Java Tên gọi chính thức của ngôn ngữ này theo Microsoft là "C#", nhưng theo chuẩn ECMA thì chỉ là "C#"

SV thực hiện: SV1 – SV2

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

C# được xây dựng trên nền tảng của hai ngôn ngữ mạnh nhất là C++ và Java, nhằm giữ lại những ưu điểm của hai ngôn ngữ này đồng thời loại bỏ những điểm phức tạp không cần thiết Nhờ vậy, C# được đánh giá là ngôn ngữ dễ học, dễ sử dụng và hiệu quả

Ưu điểm của C#:

C# là ngôn ngữ lập trình hiện đại, linh hoạt và mạnh mẽ được sử dụng rộng rãi trong nhiều ngành công nghiệp khác nhau Dưới đây là một số ưu điểm chính của C#:

1 Hướng đối tượng: C# là ngôn ngữ hướng đối tượng thuần túy, điều này có nghĩa là nó hỗ trợ các khái niệm như lớp, đối tượng, thừa kế, đa hình và đóng gói Điều này giúp cho việc phát triển phần mềm dễ dàng hơn, có thể bảo trì và mở rộng hơn

2 Kiểu dữ liệu mạnh mẽ: C# có hệ thống kiểu dữ liệu mạnh mẽ giúp ngăn chặn các lỗi thời gian chạy và làm cho mã dễ bảo trì hơn Hệ thống kiểu dữ liệu của C# bao gồm các tính năng như kiểm tra kiểu tĩnh, thu gom rác tự động và an toàn bộ nhớ

3 Bảo mật: C# được thiết kế để bảo mật cao, với các tính năng như kiểm tra kiểu tĩnh và thu gom rác tự động Điều này giúp bảo vệ phần mềm khỏi các lỗ hổng bảo mật và các cuộc tấn công

4 Đa nền tảng:

 C# có thể được sử dụng để phát triển ứng dụng cho nhiều nền tảng khác nhau, bao gồm Windows, macOS, Linux, Android và iOS

 NET Core, nền tảng phát triển nguồn mở cho C#, hỗ trợ đa nền tảng mạnh mẽ

5 Cộng đồng lớn và phát triển:

 C# có cộng đồng lập trình viên lớn và năng động trên toàn thế giới, luôn sẵn sàng chia sẻ kiến thức và kinh nghiệm

 Microsoft thường xuyên cập nhật và cải tiến C# với các tính năng mới, đáp ứng nhu cầu phát triển phần mềm ngày càng cao

SV thực hiện: SV1 – SV2

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

Chương 2 Phân tích và hoạch định

2.1 Các module chức năng: Trình bày sơ đồ chức năng

2.2 Site map: Trình bày sơ đồ liên kết

Sơ đồ trang Home

Sơ đồ mục Product

SV thực hiện: SV1 – SV2

Home Product Sale About Contact Wishlist Search Cart

Product Adidas Nike Air Jordan Puma Fila Men Women

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

2.3 Database diagram: Mô tả lược đồ quan hệ

Các model được sử dụng trong đồ án gồm:

 Customer: Được dùng để lưu trữ các thông tin cơ bản của khách hàng về tên, email và thong tin đăng nhập vào trang web

 Cus_ORDER: Được dùng để lưu trữ lịch sử mua của khách hàng

 Product: Được dùng là nơi lưu trữ các thông tin và danh mục về sản phẩm

 Category: Được xem là danh mục để lọc sản phẩm

 Admin: Được dùng là nơi lưu trữ tài khoản quản trị viên

2.4 GUI: Mô tả giao diện các các nhóm trang web của website

SV thực hiện: SV1 – SV2

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

Chương 3 Triển khai ứng dụng web

3.1 Thiết kế giao diện: Trình bày các bước thiết kế, công cụ sử dụng và kết quả

3.2 Thiết kế dữ liệu: Trình bày sơ đồ dữ liệu và chi tiết các bảng

3.3 Thiết kế xử lý: Trình bày chi tiết các bước cài đặt các module chức năng

3.4 Bảo mật website

3.5 Kiểm tra và xuất bản website

 Kiểm tra giao diện các trang khi thể hiện trên các trình duyệt web thông dụng

 Kiểm tra các chức năng của website (thể hiện thông tin, quản trị, …)

 Hosting website lên internet (yêu cầu mở rộng)

SV thực hiện: SV1 – SV2

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

Chương 4 Kết luận

4.1 Kết quả đạt được



4.2 Những hạn chế và hướng mở rộng



TÀI LIỆU THAM KHẢO

SV thực hiện: SV1 – SV2