Đồ Án môn học lập trình web tên Đề tài xây dựng Ứng dụng web bán Điện thoại di Động

Hình 1: Giao diện thể hiện các trang public...5Hình 2: Giao diện thể hiện các trang sản phẩm...6 Hình 3: Giao diện thể hiện các trang chi tiết sản phẩm...7 Hình 4: Giao diện thể hiện tra

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: XÂY DỰNG ỨNG DỤNG WEB BÁN ĐIỆN

[MSSV]

SV thực hiện 2 : HÀ XUÂN HỒNG VŨ [MSSV]

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 9

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 11

3.4 Bảo mật website 16

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

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

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

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

TÀI LIỆU THAM KHẢO 17

Hình 1: Giao diện thể hiện các trang public 5

Hình 2: Giao diện thể hiện các trang sản phẩm 6

Hình 3: Giao diện thể hiện các trang chi tiết sản phẩm 7

Hình 4: Giao diện thể hiện trang giỏ hàng (Shopping Cart) 8

Hình 5: Màn hình cài đặt Layout page 9

Hình 6: Database Diagrams 9

Hình 7: Class Diagram 11

Hình 8: DB Context Class 11

Hình 9: Category Class 12

Hình 10: Product Class 12

Hình 11: Màn hình cài đặt Index Action 13

Hình 12: Màn hình cài đặt Details Action 13

Hình 13: Màn hình cài đặt Index View 14

Hình 14: Kết quả thể hiện Index Page 14

Hình 15: Màn hình cài đặt Details View 15

Hình 16: Kết quả thể hiện Details Page 15

SV thực hiện: SV1 – SV2 1

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

Thông tin chung

Chương 1 Tổng quan

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

Trong thế giới số hóa ngày nay, việc mua sắm trực tuyến không chỉ là một xu hướng

mà còn là một phần thiết yếu của cuộc sống hàng ngày Đồ án này tập trung vào việc phát triển một ứng dụng web bán điện thoại, nhằm mục tiêu cung cấp một nền tảng muasắm trực tuyến thuận tiện, nhanh chóng và an toàn cho người tiêu dùng Chúng tôi nhậnthức được tầm quan trọng của việc tiếp cận thông tin sản phẩm một cách dễ dàng và quyết định mua hàng một cách thông minh Vì vậy, ứng dụng của chúng tôi được thiết

kế để đáp ứng nhu cầu đó, thông qua việc cung cấp thông tin chi tiết về sản phẩm, đánh giá từ người dùng và một quy trình thanh toán đơn giản

Đồ án này nhằm mục tiêu phát triển một ứng dụng web bán điện thoại sử dụng nền tảngASP.NET MVC:

 Yêu Cầu Chức Năng:

o Tích hợp hệ thống quản lý sản phẩm, cho phép thêm, sửa, xóa và liệt kê các sản phẩm

o Cung cấp chức năng tìm kiếm và lọc sản phẩm theo nhiều tiêu chí như hãng, giá cả, và đặc điểm kỹ thuật

o Quản lý giỏ hàng và quy trình thanh toán

o Quản lý hồ sơ cá nhân và lịch sử mua hàng

o Đăng nhập/Đăng ký tài khoản người dùng

o Xem sản phẩm và mua hàng

 Yêu Cầu Phi Chức Năng:

o Bảo mật thông tin người dùng và giao dịch

o Tối ưu hóa cho tốc độ tải trang nhanh

o Thiết kế giao diện thân thiện với người dùng và tương thích với nhiều thiết bị

o Dễ dàng mở rộng và bảo trì

 Nguồn Thông Tin Và Dữ Liệu:

o Thông tin sản phẩm và hình ảnh sẽ được thu thập từ các nhà sản xuất và nhà phân phối chính thức

o Phản hồi và đánh giá từ người dùng

o Dữ liệu giao dịch và lịch sử mua hàng sẽ được lưu trữ an toàn trong cơ

sở dữ liệu

SV thực hiện: SV1 – SV2 3

1.2 Cơ sở lý thuyết

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

Về Chúng tôi Blog

Bài Viết Chi tiết Bài Viết

Liên Hệ Đăng Nhập

SV thực hiện: SV1 – SV2 5

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

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

 Trang Chủ

o Thanh điều hướng: Bao gồm logo, menu danh mục sản phẩm, thanh tìm kiếm, và các biểu tượng như giỏ hàng và tài khoản người dùng

o Banner quảng cáo: Hiển thị các chương trình khuyến mãi hoặc sản phẩm nổi bật

o Danh sách sản phẩm: Các sản phẩm được sắp xếp theo danh mục, có thể lọc theo giá, thương hiệu, hoặc đánh giá

 Trang Sản Phẩm

o Hình ảnh sản phẩm: Hình ảnh trực quan sản phẩm

o Thông tin sản phẩm: Bao gồm tên, giá, mô tả, thông số kỹ thuật

o Phân loại sản phẩm: Phân loại theo hãng sản xuất

Trang Chi Tiết Sản Phẩm:

Hình ảnh sản phẩm:



 Trang Thanh Toán

o Biểu mẫu thanh toán: Yêu cầu thông tin giao hàng, phương thức thanh toán, và xác nhận đơn hàng

o Tóm tắt đơn hàng: Hiển thị sản phẩm, số lượng, giá, và tổng cộng

Trang Quản Lý Tài Khoản

Thông tin cá nhân: Cho phép người dùng cập nhật thông tin cá nhân và mật khẩu

Lịch sử mua hàng: Hiển thị danh sách các đơn hàng đã đặt và trạng thái của chúng

Trang Liên Hệ

Biểu mẫu liên hệ: Cho phép người dùng gửi câu hỏi hoặc phản hồi

 Thông tin liên hệ: Bao gồm địa chỉ, số điện thoại, và email hỗ trợ

 Trang về chúng tôi: Thông tin về cửa hàng

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

3.1 Thiết kế giao diện

Sử dụng Template Eshopper được thiết kế trên nền tảng Bootstrap Framewwork, tích hợp vào ứng dụng web dùng thể hiện giao diện cho các nhóm trang web

(Giao diện các nhóm trang web được thể hiện từ Bootstrap Responsive Template

Eshopper tích hợp vào ứng dụng web…)

Giao diện thể hiện cho các nhóm trang web gồm:

SV thực hiện: SV1 – SV2 7

Hình 1: Giao diện thể hiện các trang public

Hình 2: Giao diện thể hiện các trang sản phẩm

SV thực hiện: SV1 – SV2 9

Hình 3: Giao diện thể hiện các trang chi tiết sản phẩm

Hình 4: Giao diện thể hiện trang giỏ hàng (Shopping Cart)

SV thực hiện: SV1 – SV2 11

Hình 5: Màn hình cài đặt Layout page

…

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.2.1 Lược đồ dữ liệu quan hệ

Hình 6: Database Diagrams

3.2.2 Các bảng dữ liệu

 Bảng Category: …

 Bảng Product: …

…

SV thực hiện: SV1 – SV2 13

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.3.1 Mô hình ánh xạ dữ liệu và các thực thể (ORM)

 Class Diagram: ProductDataModel

Hình 7: Class Diagram

 DBContext Class: ProductDBContext

Hình 8: DB Context Class

SV thực hiện: SV1 – SV2 15

3.3.2 Chức năng thể hiện thông tin

Thể hiện thông tin cho các trang thuộc nhóm Public page (Index, Product, ….)

 Model: Sử dụng các entity…

 ProductController

hiện truy vấn dữ liệu từ các thực thể (model) và trả kết quả cho Index View là tậphợp các sản phẩm thuộc loại sản phẩm, ứng với mã loại sản phẩm đã tiếp nhận

 Details Action:

…

Hình 11: Màn hình cài đặt Index Action

Hình 12: Màn hình cài đặt Details Action

 View

 Index View: …

Hình 13: Màn hình cài đặt Index View

Hình 14: Kết quả thể hiện Index Page

SV thực hiện: SV1 – SV2 17

 Details View: …

Hình 15: Màn hình cài đặt Details View

Hình 16: Kết quả thể hiện Details Page

…

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)