BÀI TẬP LỚN PHÁT TRIỂN ỨNG DỤNG WEB - ĐỀ TÀI: WEB CỬA HÀNG XE MÁY

BÀI TẬP LỚN PHÁT TRIỂN ỨNG DỤNG WEB - ĐỀ TÀI: WEB CỬA HÀNG XE MÁY Trong thời đại công nghệ số phát triển mạnh mẽ, các nền tảng trực tuyến ngày càng đóng vai trò quan trọng trong việc kết nối giữa người bán và người mua. Ngành công nghiệp xe máy không nằm ngoài xu hướng này, khi nhu cầu tìm kiếm, so sánh và mua xe qua các trang web ngày càng gia tăng. Trang web bán xe máy được xây dựng nhằm mục đích tạo ra một không gian trực tuyến tiện lợi và hiệu quả cho người dùng, nơi họ có thể dễ dàng tiếp cận thông tin về các dòng xe, so sánh giá cả, và thực hiện giao dịch mua bán một cách an toàn và nhanh chóng. Không chỉ mang đến trải nghiệm mua sắm hiện đại, trang web còn là giải pháp tối ưu cho các doanh nghiệp trong việc mở rộng thị trường và tiếp cận khách hàng tiềm năng. Với giao diện thân thiện, tính năng đa dạng, và hiệu suất ổn định, trang web bán xe máy hứa hẹn sẽ đáp ứng nhu cầu của người dùng và góp phần thúc đẩy ngành kinh doanh xe máy trong bối cảnh kinh tế số hóa.

KHOA CÔNG NGHỆ THÔNG TIN

BÀI TẬP LỚN PHÁT TRIỂN ỨNG DỤNG WEB

ĐỀ TÀI: WEB CỬA HÀNG XE MÁY

Sinh viên thực hiện: Trần Nguyên Lượng

Giảng viên hướng dẫn: Phạm Văn Kiên

Lớp: DK13 – CNTT1

Sao Đỏ, ngày 1 tháng 1 năm 2025

MỤC LỤC

LỜI MỞ ĐẦU 3

CHƯƠNG 1: GIỚI THIỆU TỔNG QUAN 4

1.1 Lý do lựa chọn dự án 4

1.2 Mục tiêu nghiên cứu cần đạt được 4

1.3 Nghiên cứu tài liệu và công nghệ: 5

1.4 Phân tích yêu cầu: 5

1.5 Thiết kế và lập trình: 6

1.6 Thử nghiệm và đánh giá: 6

1.7 Triển khai và bảo trì : 6

1.8 Bố cục đề tài: 6

CHƯƠNG 2: NGHIÊN CỨU TỔNG QUAN 7

2.1 Phân tích yêu cầu: 7

2.2 Thiết kế giao diện người dùng: 7

CHƯƠNG 3: THIẾT KẾ CƠ SỞ DỮ LIỆU 12

3.1 Xây dựng biểu đồ Use case 12

3.1.1 Biểu đồ Use case tổng quát 12

3.1.2 Xác định các gói Use case, biểu đồ Use case chi tiết 12

3.1.3 Nhóm Use case Đăng ký, đăng nhập 13

3.1.4 Nhóm Use case Quản lý thông tin cá nhân 14

3.1.5 Nhóm Use case Quản lý danh sách thành viên 14

3.1.6 Nhóm Use case Quản lý danh mục sản phẩm 15

3.1.7 Nhóm Use case Mua hang 15

3.1.8 Nhóm Use case Xử lý đơn hàng 16

3.2 Kịch bản các Use case 16

3.2.1 Kịch bản Use case đăng ký thành viên 16

3.2.2 Đặc tả Use case đăng nhập 17

3.1 Kịch bản Use case xem thông tin giỏ hàng 17

3.2.4 Kịch bản Use case xem thông tin đơn hàng 18

3.2.5 Kịch bản Use case xem thông tin sản phẩm 18

3.2.6 Kịch bản Use case xem thông tin cá nhân 18

3.2.7 Kịch bản Use case sửa thông tin cá nhân 19

3.2.8 Kịch bản Use case quản lý danh mục sản phẩm 19

3.2.9 Kịch bản Use case quản lý danh sách thành viên 20

3.2.10 Kịch bản Use case chọn sản phẩm cần mua 21

3.2.11 Kịch bản Use case thêm sản phẩm vào giỏ hàng 22

3.2.12 Kịch bản Use case loại sản phẩm đã chọn ở giỏ hàng 22

3.2.13 Kịch bản Use case thanh toán 23

3.2.14 Kịch bản Use case tiếp nhận đơn hàng 24

3.2.15 Kịch bản Use case giao cho nhân viên thực hiện 24

3.2.16 Kịch bản Use case nhận đơn hàng và giao hàng 24

3.2.17 Kịch bản Use case báo cáo kết quả 25

3.2.18 Kịch bản Use case thanh toán 25

3.2.19 Kịch bản Use case quản lý sản phẩm 26

3.3 Bảng CSDL 27

3.4 Biểu đồ quan hệ CSDL 30

KẾT LUẬN 32

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

4.2 Hạn chế: 32

4.3 Hướng phát triển: 32

LỜI MỞ ĐẦU

Trong thời đại công nghệ số phát triển mạnh mẽ, các nền tảng trực tuyếnngày càng đóng vai trò quan trọng trong việc kết nối giữa người bán và người mua.Ngành công nghiệp xe máy không nằm ngoài xu hướng này, khi nhu cầu tìm kiếm,

so sánh và mua xe qua các trang web ngày càng gia tăng Trang web bán xe máyđược xây dựng nhằm mục đích tạo ra một không gian trực tuyến tiện lợi và hiệuquả cho người dùng, nơi họ có thể dễ dàng tiếp cận thông tin về các dòng xe, sosánh giá cả, và thực hiện giao dịch mua bán một cách an toàn và nhanh chóng.Không chỉ mang đến trải nghiệm mua sắm hiện đại, trang web còn là giải pháp tối

ưu cho các doanh nghiệp trong việc mở rộng thị trường và tiếp cận khách hàng tiềmnăng Với giao diện thân thiện, tính năng đa dạng, và hiệu suất ổn định, trang webbán xe máy hứa hẹn sẽ đáp ứng nhu cầu của người dùng và góp phần thúc đẩyngành kinh doanh xe máy trong bối cảnh kinh tế số hóa

Website của tôi không chỉ dừng lại ở việc giới thiệu các dòng xe máy hiệnđại với đầy đủ thông tin chi tiết, mà còn là cầu nối giữa khách hàng và doanhnghiệp Với các tính năng như tìm kiếm nhanh, so sánh sản phẩm, và thanh toántrực tuyến, tôi mong muốn mang lại trải nghiệm mua sắm hoàn toàn mới, giúpkhách hàng dễ dàng chọn lựa sản phẩm phù hợp mà không cần mất thời gian đếncửa hàng

Báo cáo này sẽ trình bày quá trình thiết kế và phát triển trang web bán xemáy, từ việc phân tích yêu cầu, thiết kế giao diện đến triển khai thực tế, nhằm mangđến cái nhìn toàn diện về dự án và tiềm năng phát triển trong tương lai Tuy nhiên,

do hạn chế về thời gian, kinh nghiệm và kỹ năng còn chưa hoàn thiện, bài tập nàykhông tránh khỏi những thiếu sót Em rất mong nhận được ý kiến đóng góp từ thầy

cô và các bạn để có thể hoàn thiện và nâng cao chất lượng bài làm

Em xin chân thành cảm ơn!

CHƯƠNG 1: GIỚI THIỆU TỔNG QUAN

1.1 Lý do lựa chọn dự án

- Tầm quan trọng của xe máy trong cuộc sống hằng ngày: Xe máy là phươngtiện di chuyển phổ biến nhất tại Việt Nam Việc tạo ra một trang web bán xemáy không chỉ giúp khách hàng dễ dàng tìm kiếm sản phẩm phù hợp mà cònthúc đẩy quá trình số hóa ngành kinh doanh truyền thống này

- Xu hướng phát triển thương mại điện tử: Thương mại điện tử đang phát triểnmạnh mẽ, giúp các doanh nghiệp tiếp cận khách hàng dễ dàng hơn thôngqua các kênh trực tuyến Xây dựng một trang web bán xe máy là một cáchứng dụng công nghệ hiện đại vào lĩnh vực kinh doanh, đồng thời khai thác

xu hướng mua sắm trực tuyến đang ngày càng phổ biến

- Cơ hội học tập và nâng cao kĩ năng cá nhân: Dự án này không chỉ giúp tôi

áp dụng các kiến thức đã học về lập trình web, thiết kế giao diện, và cơ sở

dữ liệu, mà còn giúp tôi hiểu rõ hơn về quy trình phát triển một hệ thốngthương mại điện tử hoàn chỉnh Đây là cơ hội để tôi rèn luyện kỹ năng lậptrình thực tế, quản lý dự án, và tư duy sáng tạo

- Đáp ứng nhu cầu thực tế của người dùng: Khách hàng thường gặp khó khănkhi phải đến cửa hàng để tìm kiếm thông tin xe máy Một trang web bán xemáy giúp họ dễ dàng tra cứu thông tin, so sánh sản phẩm, và thực hiện giaodịch chỉ với vài thao tác Điều này mang lại sự tiện lợi và tiết kiệm thời giancho cả người bán và người mua

1.2 Mục tiêu nghiên cứu cần đạt được.

a Mục tiêu cần đạt được đối với bản thân:

- Phát triển kỹ năng chuyên môn: Áp dụng kiến thức đã học về lập trình web,

cơ sở dữ liệu, và xử lý thông tin để xây dựng một hệ thống hoàn chỉnh, nângcao năng lực lập trình thực tế

- Nâng cao tư duy thiết kế và giải quyết vấn đề: Phát triển khả năng phân tíchyêu cầu người dùng, từ đó thiết kế và triển khai giải pháp hiệu quả, thânthiện với người dùng

- Tích lũy kinh nghiệm quản lý dự án:Thực hành lập kế hoạch, phân chia côngviệc, và hoàn thiện từng bước của dự án một cách khoa học và có tổ chức

- Xây dựng sản phẩm có giá trị thực tiễn:Tạo ra một trang web có thể ứngdụng thực tế, giúp tôi hiểu rõ hơn về việc phát triển các sản phẩm công nghệđáp ứng nhu cầu người dùng

b Mục tiêu đối với học tập:

- Củng cố kiến thức lý thuyết: Áp dụng các khái niệm đã học như thiết kế cơ

sở dữ liệu, lập trình web, và các kỹ thuật bảo mật trong phát triển hệ thống

- Kết nối lý thuyết và thực hành: Kết hợp lý thuyết học tập với thực tế triểnkhai, giúp hiểu sâu hơn về cách thức xây dựng và vận hành một hệ thốngthương mại điện tử

- Học hỏi các công nghệ mới: Nghiên cứu và sử dụng các công cụ, frameworkhoặc thư viện hỗ trợ lập trình web như Bootstrap, PHP, MySQL, giúp mởrộng vốn kiến thức và kỹ năng

- Rèn luyện kĩ năng làm việc nhóm và cá nhân: Học cách làm việc độc lậphoặc cộng tác để hoàn thành dự án đúng hạn, đồng thời cải thiện khả nănggiao tiếp và giải quyết vấn đề

- Chuẩn bị cho nghề nghiệp tương lai: Xây dựng nền tảng kiến thức và kinhnghiệm vững chắc, giúp bản thân tự tin hơn khi tham gia các dự án thực tếhoặc công việc sau này trong ngành công nghệ thông tin

1.1 Nghiên cứu tài liệu và công nghệ:

- Tìm hiểu lý thuyết nền tảng: Đọc các tài liệu, giáo trình về phát triển web,lập trình PHP, cơ sở dữ liệu MySQL và các công nghệ liên quan Tìm hiểucác tiêu chuẩn thiết kế giao diện người dùng (UI/UX) để đảm bảo tính thẩm

mỹ và thân thiện với người dùng

- Phân tích các trang web tương tự: Khảo sát các trang web bán xe máy hiện

có để học hỏi cách tổ chức giao diện, tính năng nổi bật, và điểm mạnh/điểmyếu So sánh với yêu cầu người dùng thực tế để định hình ý tưởng cho dựán

- Nghiên cứu công nghệ và công cụ hỗ trợ: Sử dụng các framework và thưviện phổ biến như Bootstrap, AJAX để cải thiện giao diện và hiệu suất Tìmhiểu các giải pháp bảo mật như mã hóa dữ liệu, xác thực người dùng

1.2 Phân tích yêu cầu:

- Khảo sát nhu cầu người dùng: Tiến hành khảo sát hoặc lấy ý kiến từ ngườidùng tiềm năng (như khách hàng hoặc người quản lý cửa hàng xe máy) đểhiểu rõ yêu cầu thực tế Xác định các tính năng cần thiết cho trang web nhưtìm kiếm sản phẩm, giỏ hàng, thanh toán trực tuyến

- Phân tích chức năng hệ thống: Xác định rõ các chức năng chính của trangweb, bao gồm giao diện người dùng, quản lý sản phẩm, và xử lý giao dịch.Phân tích luồng dữ liệu và cách tổ chức cơ sở dữ liệu

1.3 Thiết kế và lập trình:

- Thiết kế giao diện: Vẽ sơ đồ bố cục (wireframe) và thiết kế mockup giaodiện cho từng trang Thử nghiệm và điều chỉnh giao diện để đảm bảo tínhthân thiện và nhất quán

- Lập trình hệ thống: Xây dựng từng phần của hệ thống theo mô hình 3 lớp(Presentation Layer, Application Layer, Data Layer) Áp dụng các phươngpháp lập trình từng bước, kiểm tra và tối ưu mã nguồn liên tục

1.4 Thử nghiệm và đánh giá:

- Thử nghiệm đánh giá: Kiểm tra các tính năng của trang web, từ giao diệnngười dùng, tìm kiếm, giỏ hàng đến thanh toán Đảm bảo các chức nănghoạt động đúng yêu cầu và không có lỗi phát sinh

- Thử nghiệm hiệu suất: Đánh giá tốc độ tải trang, hiệu quả xử lý khi có lượngtruy cập lớn Tối ưu hóa hệ thống để cải thiện hiệu suất hoạt động

- Đánh giá từ người dùng: Thu thập ý kiến phản hồi từ người dùng thực tế vềgiao diện, chức năng, và trải nghiệm sử dụng Điều chỉnh hệ thống dựa trêncác phản hồi để nâng cao chất lượng

1.5 Triển khai và bảo trì :

- Triển khai và bảo trì: Đưa trang web lên môi trường hoạt động thực tế, thửnghiệm trên các nền tảng khác nhau (PC, mobile, tablet) Cài đặt các công

cụ giám sát hiệu suất và theo dõi lỗi phát sinh

- Bảo trì và nâng cấp: Cập nhật hệ thống khi có công nghệ mới hoặc yêu cầu

bổ sung từ người dùng.Đảm bảo tính ổn định và bảo mật lâu dài cho trangweb

1.6 Bố cục đề tài:

- Chương 1: Giới thiệu tổng quan

- Chương 2: Nghiên cứu tổng quan

- Chương 3: Thiết kế Cơ Sở Dữ Liệu

- Tổng Kết:

CHƯƠNG 2: NGHIÊN CỨU TỔNG QUAN

1.1 Phân tích yêu cầu:

- Yêu cầu chức năng:

 Đối với khách hàng: Xem danh sách sản phẩm, Tìm kiếm và lọc sảnphẩm, Xem chi tiết sản phẩm, Đặt hàng và thanh toán, Quản lý tài khoản

cá nhân

 Đối với Admin: Quản lý sản phẩm ( thêm, sửa, xóa sản phẩm ), Quản lýđơn hàng, theo dõi trạng thái đơn hàng (đang xử lý, đã giao, hủy)

 Quản lý tài khoản người dùng: Xem, khóa hoặc xóa tài khoản

1.2 Thiết kế giao diện người dùng:

- Trang chủ: Trang chủ là giao diện đầu tiên mà người dùng nhìn thấy khi

truy cập vào trang web Đây là nơi tập trung các thông tin chính và đượcthiết kế để thu hút sự chú ý, tạo ấn tượng tốt cho khách hàng

a Thiết kế hiện đại và trực quan:

 Giao diện gọn gàng, dễ nhìn với bố cục rõ ràng

 Sử dụng màu sắc và hình ảnh nổi bật để thu hút sự chú ý

 Đảm bảo tính tương thích trên các thiết bị di động (responsive)

b Nội dung chính:

 Thanh tìm kiếm:Hiển thị nổi bật trên đầu trang, cho phép người dùngtìm kiếm nhanh sản phẩm

 Danh mục sản phẩm:Bao gồm các danh mục như: Xe tay ga, Xe số,

Xe côn tay, giúp khách hàng dễ dàng chọn loại xe họ quan tâm

 Sản phẩm nổi bật:Hiển thị các mẫu xe máy bán chạy, mới ra mắt hoặcđang giảm giá để thu hút sự quan tâm của khách hàng

 Hình ảnh quảng cáo:Các banner quảng cáo về khuyến mãi, ưu đãihoặc dịch vụ bảo hành

 Thông tin giới thiệu:Cung cấp thông tin về doanh nghiệp, lý do nênchọn mua xe tại trang web

 Liên kết nhanh:Dẫn đến các trang quan trọng như: Chính sách bảohành, hỗ trợ khách hàng, liên hệ.

c Chức năng nổi bật:

 Tích hợp nút "Thêm vào giỏ hàng" trực tiếp tại danh sách sản phẩm

 Hỗ trợ ngôn ngữ đa dạng, giúp tiếp cận nhiều đối tượng khách hàng

 Các nút chia sẻ mạng xã hội (Facebook, Instagram, Zalo)

d Vai trò của trang chủ:

 Tạo ấn tượng đầu tiên và giữ chân khách hàng ở lại trang web

 Cung cấp thông tin ngắn gọn, đủ hấp dẫn để người dùng khám phácác trang con như danh mục sản phẩm hoặc chi tiết sản phẩm

 Xây dựng niềm tin thông qua giao diện chuyên nghiệp và dễ sử dụng

Hình 2.1 ảnh minh họa trang chủ

- Danh sách sản phẩm: Trang Danh sách sản phẩm là nơi hiển thị toàn bộ

các sản phẩm xe máy hiện có trên trang web Đây là một phần quan trọnggiúp khách hàng dễ dàng tìm kiếm, so sánh và lựa chọn mẫu xe phù hợp vớinhu cầu của họ

a Bố cục trực quan:

 Sản phẩm được trình bày theo dạng lưới hoặc danh sách, với hình ảnh,tên sản phẩm, giá cả, và các thông tin cơ bản hiển thị rõ ràng

 Thanh điều hướng (breadcrumb) hiển thị vị trí của người dùng trêntrang web, ví dụ: Trang chủ > Xe tay ga.

b Bộ lọc và tìm kiếm:

 Cho phép khách hàng tìm kiếm sản phẩm theo:Hãng sản xuất: Honda,Yamaha, Suzuki, Loại xe: Xe tay ga, xe số, xe côn tay Khoảnggiá: Ví dụ: Dưới 30 triệu, từ 30-50 triệu

c Thông tin sản phẩm cơ bản:

 Hình ảnh sản phẩm: Hình ảnh nổi bật giúp khách hàng dễ hình dung

 Tên sản phẩm: Gắn liền với hãng và dòng xe (ví dụ: Honda Air Blade2023)

 Giá cả: Hiển thị giá bán và ưu đãi (nếu có)

 Nút hành động: "Xem chi tiết" hoặc "Thêm vào giỏ hàng"

d Chức năng sắp xếp:

 Sắp xếp sản phẩm theo:

 Giá: Tăng dần hoặc giảm dần

 Độ phổ biến: Các sản phẩm được xem nhiều nhất

 Ngày đăng: Sản phẩm mới ra mắt

e Vai trò của danh sách sản phẩm:

 Giúp khách hàng nhanh chóng tìm được mẫu xe phù hợp với nhu cầu

Hình 2.3 ảnh minh họa Trang chi tiết sản phẩm

 Quản lý đơn hàng: Xem danh sách đơn hàng: Trạng thái (đang xử lý,

đã giao, hủy bỏ), chi tiết sản phẩm, khách hàng Thay đổi trạng tháiđơn hàng, ví dụ: "Đang xử lý" sang "Đã giao"

 Quản lý người dùng: Xem danh sách tài khoản người dùng, thông tinliên hệ Khóa hoặc xóa tài khoản nếu phát hiện hành vi vi phạm

c Chức năng bảo mật:

 Hệ thống yêu cầu đăng nhập với quyền Admin để truy cập

 Hỗ trợ phân quyền (Admin cấp cao, nhân viên quản lý sản phẩm/đơnhàng)

d Vai trò của trang Admin:

 Đảm bảo trang web hoạt động ổn định và hiệu quả

 Quản lý dễ dàng theo dõi và kiểm soát toàn bộ hoạt động của trangweb

 Tăng khả năng tối ưu hóa trải nghiệm người dùng thông qua việc cậpnhật thông tin sản phẩm, xử lý đơn hàng nhanh chóng, và quản lý dữliệu hiệu quả

Hình 2.4 ảnh minh họa trang Admin

CHƯƠNG 3: THIẾT KẾ CƠ SỞ DỮ LIỆU

3.1 Xây dựng biểu đồ Use case.

Tác nhân “Khách hàng” có các UC sau:

- Đăng kí làm thành viên

- Xem thông tin sản phẩm

- Xem thông tin giỏ hàng

- Chọn sản phẩm cần mua

- Thêm, bớt sản phẩm trong giỏ hàng

- Thực hiện việc mua hàng

- Thanh toán

Tác nhân “Người quản lý” có các UC sau:

- Tiếp nhận đơn hàng

- Giao cho nhân viên thực hiện

- Quản lý danh sách thành viên

- Quản lý danh mục sản phẩm

- Thực hiện giao hàng

- Báo cáo kết quả doanh thu trong tháng

Hình 3.1 ảnh biểu đồ Use case tổng quát

3.1.2 Xác định các gói Use case, biểu đồ Use case chi tiết.

- Từ việc phân tích các UC của từng tác nhân, ta xây dựng thành các nhóm

UC như sau:

Hình 3.2: Nhóm các Use case

Hình 3.3 Nhóm Use case Đăng ký, Đăng nhập

3.1.4 Nhóm Use case Quản lý thông tin cá nhân.

Hình 3.1 Nhóm Use case Quản lý thông tin cá nhân

Hình 3.2: Nhóm Use case Quản lý danh sách thành viên

 Hệ thống cung cấp liên kết để thành viên có thể sửa đổi thông tin cánhân.

 UC kết thúc



Kịch bản Use case hệ thống quản lý thông tin

- Tác nhân: thành viên của hệ thống

- Mô tả: UC cho phép thành viên thay đổi các thông tin đăng ký

- Tiền điều kiện: thành viên phải đăng nhập vào hệ thống

- Luồng sự kiện chính:

 Thành viên chọn chức năng sửa thông tin cá nhân

 Hệ thống hiển thị form sửa thông tin với các thông tin cũ của thành viênhiện tại

 Thành viên nhập các thông tin mới

 Nhấn nút lưu thông tin

 Nếu việc cập nhật thành công thì thực hiện bước 6 Nếu sai thực hiệnluồng sự kiện rẽ nhánh A1

 Lưu thông tin

 UC kết thúc

- Luồng sự kiện rẽ nhánh A1: thông tin nhập không hợp lệ

 Hệ thống thông báo việc nhập dữ liệu không hợp lệ

 Thành viên nhập lại thông tin

 Quay lại bước 4 của luồng sự kiện chính

- Hậu điều kiện: thông tin thành viên được lưu vào hệ thống

- Tác nhân: người quản lý

- Mô tả: UC cho phép người quản lý thêm, xoá, thay đổi thông tin của cácsản phẩm trong danh mục

- Tiền điều kiện: người quản lý phải đăng nhập vào hệ thống

- Luồng sự kiện chính:

 Người quản lý chọn kiểu tác động lên sản phẩm: thêm sản phẩm, thayđổi thông tin sản phẩm, xoá sản phẩm ra khỏi danh mục

a Thêm sản phẩm:

o Hệ thống hiển thị form nhập thông tin sản phẩm

o Người quản lý nhập thông tin sản phẩm

o Nhấn nút lưu thông tin