MỞ ĐẦUGiới thiệu tổng quan về đề tài Hiện nay, dưới sự phát triển của công nghệ thông tin, đặc biệt là trong lĩnhvực thương mại điện tử đã giúp các cá nhân, doanh nghiệp có mặt hàng dễ d
GIỚI THIỆU
Tổng quan
1.1.1 Lí do chọn đề tài
Trong bối cảnh công nghệ thông tin phát triển mạnh mẽ, đặc biệt trong lĩnh vực thương mại điện tử, việc tiếp cận người tiêu dùng trở nên dễ dàng hơn cho cá nhân và doanh nghiệp Hầu hết các doanh nghiệp hiện nay đều sở hữu website để giới thiệu sản phẩm, từ đó chúng tôi đã nảy ra ý tưởng xây dựng một website bán hàng trực tuyến.
Website của chúng tôi cung cấp thông tin chính xác về các loại mô hình và hướng dẫn đặt hàng trực tuyến Thông tin được cập nhật nhanh chóng, giúp rút ngắn khoảng cách giữa người mua và người bán, đồng thời giới thiệu sản phẩm mới đến tay khách hàng kịp thời Giao diện thân thiện, đẹp mắt, dễ sử dụng cho mọi lứa tuổi, từ người lớn tuổi đến trẻ nhỏ.
1.1.2 Mục đích thực hiện đề tài
Xây dựng một trang web cửa hàng bán thiết bị công nghệ trực tuyến giúp khách hàng dễ dàng xem, mua và thanh toán sản phẩm nhanh chóng Chủ cửa hàng cũng có thể quản lý hiệu quả các danh mục như sản phẩm, khách hàng và nguồn thu chi tổng bill.
Website cung cấp thông tin chi tiết về các loại thiết bị thông dụng, giúp khách hàng dễ dàng tìm kiếm và sở hữu những sản phẩm hiện đại và uy tín Các đánh giá và bình luận từ khách hàng được công khai, tạo sự tin cậy và thuận lợi cho người tiêu dùng trong việc lựa chọn thiết bị phù hợp.
Nhiệm vụ thực hiện đề tài
- Học tập và nắm vững các ngôn ngữ cần thiết để ứng dụng vào việc thiết kế Website.
- Đọc các tài liệu, các nguồn thông tin tham khảo.
Hình 1 : Các ngôn ngữ 1.2.2 Kết quả dự kiến
Website được thiết kế cẩn thận, giao diện đẹp mắt, nội dung chất lượng và được bố trí khoa học.
Mục tiêu của đề tài là áp dụng thực tế, cung cấp sản phẩm chất lượng cao với nhiều ưu đãi hấp dẫn Trang web hướng đến việc làm hài lòng khách hàng, từ đó tạo dựng mối quan hệ thân thiện giữa người tiêu dùng và cửa hàng.
TỔNG QUAN VỀ ECOMMERCE WEBSITE
Giới thiệu về Ecommerce website
- Ecommerce website là trang web bán các thiết bị công nghệ Những thiết bị như điện thoại, laptop, máy tính bản, tai nghe.
- Là mô hình mua bán trực tuyến, khách hàng sẽ dễ dàng mua sắm mà không cần tới cửa hàng trực tiếp.
Một số quy trình hoạt động
2.2.1 Quy trình đăng kí tài khoản
Khi khách hàng muốn đăng ký tài khoản để thực hiện các hoạt động như mua hàng, đánh giá sản phẩm hay bình luận, họ có thể truy cập trang đăng nhập và chọn mục đăng ký Sau đó, khách hàng cần điền đầy đủ thông tin vào form đăng ký và nhấn nút đăng ký Hệ thống sẽ kiểm tra thông tin và tiến hành đăng ký nếu thông tin hợp lệ; nếu không, khách hàng sẽ được yêu cầu nhập lại thông tin.
Hình 2 : Quy trình đăng kí tài khoản 2.2.2 Quy trình đăng nhập
Giao diện đăng nhập chỉ gồm 2 trường thông tin là tên tài khoản và mật khẩu
Trang đăng nhập sẽ tự động hiện khi khách có nhu cầu sử dụng các tính năng của thành viên trang web ví dụ: bình luận, đánh giá …
Hệ thống quản lý tài khoản thành viên sẽ xác minh thông tin đã cung cấp Nếu thông tin không chính xác, người dùng sẽ được đưa trở lại màn hình đăng nhập và nhận thông báo hiển thị trên giao diện.
Nếu thông tin được xác thực, đưa về giao diện trang chủ của web
Hình 3 : Quy trình đăng nhập
2.2.3 Quy trình tìm kiếm sản phẩm
Chức năng tìm kiếm trên trang web được đặt ở phần header, cho phép khách hàng dễ dàng tìm kiếm sản phẩm bằng cách nhập từ khóa vào ô input Ngay lập tức, danh sách sản phẩm liên quan sẽ được hiển thị, giúp khách hàng chọn và nhấn vào sản phẩm mong muốn.
Hình 4 : Quy trình tìm kiếm 2.2.4 Quy trình thêm sản phẩm vào danh sách yêu thích
Khi khách hàng chưa thể mua sản phẩm ngay lập tức, họ có thể lưu lại những sản phẩm yêu thích bằng cách nhấn vào biểu tượng hình trái tim Điều này cũng áp dụng cho những sản phẩm đã bán hết, giúp khách hàng ghi chú để quay lại trang web và thực hiện giao dịch sau này.
Hìn h 5 : Quy trình thêm sản phẩm vào danh sách yêu thích
2.2.5 Quy trình thêm sản phẩm vào giỏ hàng
Sau khi tìm kiếm sản phẩm, khách hàng có thể thêm sản phẩm ưng ý vào giỏ hàng để lưu giữ Điều này giúp họ dễ dàng kiểm tra và lựa chọn lại những sản phẩm yêu thích khi có nhu cầu mua sắm sau này.
Hình 6 : Quy trình thêm sản phẩm vào giỏ hàng 2.2.6 Quy trình thanh toán
Sau khi thêm sản phẩm vào giỏ hàng, khách hàng có thể tiến hành thanh toán bằng cách nhấn nút thanh toán dưới danh sách sản phẩm Sau đó, khách hàng kiểm tra thông tin cơ bản và chọn hình thức thanh toán phù hợp trước khi nhấn thanh toán lần cuối.
Qua trình thanh toán sẽ thông qua 2 giai đoạn quan trọng:
Trong giai đoạn 1, hệ thống tự động chuyển giao thông tin từ khách hàng đến ngân hàng hoặc nhà cung cấp dịch vụ đã liên kết với website Thông tin này sẽ được xác thực và sau đó thông báo kết quả trở lại hệ thống.
-Giai đoạn 2: gửi thông báo kết quả người xem
+Nếu thông tin không được xác nhận hệ thống đưa thành viên trở về giao diện và thông báo lỗi
Hình 7 : Quy trình thanh toán 2.2.7 Quy trình quản lý tài khoản khách hàng
Khi khách hàng mua sắm trên website, họ thường tạo tài khoản để lưu trữ dữ liệu và thuận tiện trong việc quay lại trang Đặc biệt, trên các website bán hàng, việc tạo tài khoản trở nên phổ biến nhằm hỗ trợ quản lý thông tin và giao dịch Để quản lý hiệu quả số lượng tài khoản lớn, admin cần có quy trình quản lý tài khoản rõ ràng, cho phép theo dõi thông tin, khóa tài khoản vi phạm và gửi voucher tri ân cho khách hàng thân thiết.
2.2.8 Quy trình quán lý đơn đặt hàng
Sau khi hoàn tất giao dịch mua hàng, thông tin đơn hàng sẽ được website lưu trữ để khách hàng có thể tra cứu khi nhận hàng Điều này cũng hỗ trợ quản trị viên trong việc quản lý đơn đặt hàng, đảm bảo khách hàng không bị mất quyền lợi của mình trong tương lai.
2.2.9 Quy trình quản lý sản phẩm
Một website bán hàng như figure thường có nhiều sản phẩm, và quy trình quản lý giúp admin kiểm soát tất cả Admin có thể dễ dàng thêm sản phẩm mới vào danh sách, xóa các sản phẩm lỗi và chỉnh sửa thông tin của những sản phẩm gặp vấn đề.
Cơ cấu tổ chức website
Cơ cấu tổ chức của website như sau:
+ Admin quản lý các hoạt động chung của website.
+ Khách hàng là người truy cập website và thao tác với các chức năng cơ bản như:Đăng nhập, đăng kí, mua hàng, tìm kiếm sản phẩm
NGHIÊN CỨU TỔNG QUAN
Ngôn ngữ thiết kế website
3.1.1 Ngôn ngữ lập trình Go
Ngôn ngữ lập trình Go, hay còn gọi là Golang, là một ngôn ngữ hiện đại do Google phát triển, nổi bật với hiệu suất cao và khả năng xử lý đồng thời Golang được ưa chuộng trong phát triển ứng dụng web, dịch vụ đám mây và hệ thống phân tán nhờ vào cú pháp đơn giản và tính năng tối ưu hóa.
1 Được thiết kế cho hiệu suất cao : Golang được tạo ra với mục tiêu chủ yếu là đạt được hiệu suất cao Nó có khả năng xử lý đa nhiệm thông qua goroutines, giúp xử lý hàng loạt các tác vụ cùng một lúc mà không tốn nhiều tài nguyên.
2 Kiểu Dữ Liệu Tĩnh và Cú Pháp Đơn Giản: Ngôn ngữ này hỗ trợ kiểu dữ liệu tĩnh, giúp phát hiện lỗi dễ dàng hơn trong quá trình biên dịch Cú pháp của Golang rất đơn giản và dễ đọc.
3 Concurrency và Parallelism: Golang hỗ trợ concurrency thông qua goroutines và channels Goroutines là các luồng nhẹ, và channels là cơ chế truyền thông tin giữa các goroutines Điều này giúp xử lý đa nhiệm một cách hiệu quả.
4 Bảo Mật và Bảo Quản Bộ Nhớ: Golang có các tính năng như quy tắc kiểm tra biên, giúp tránh lỗi kiểm soát đỉnh (bounds checking), và có quản lý bộ nhớ an toàn, giảm nguy cơ các lỗ hổng bảo mật phổ biến.
5 Cộng Đồng Phát Triển Đông Đảo : Mặc dù Go không có lịch sử lâu dài như một số ngôn ngữ khác, cộng đồng Go ngày càng phát triển và đóng góp nhiều vào các dự án mã nguồn mở
6 Phát Triển Ứng Dụng Web và Microservices: Golang thường được sử dụng để phát triển các ứng dụng web và microservices Nó cung cấp các thư viện hỗ trợ cho xử lý HTTP, giao tiếp RPC, và nhiều tính năng khác phục vụ việc phát triển các hệ thống phức tạp.
7 Chấp Nhận và Tích Hợp Dễ Dàng: Golang được thiết kế để đơn giản và dễ tích hợp với các công nghệ khác Điều này giúp nhà phát triển xây dựng và duy trì ứng dụng một cách hiệu quả.
8 Hỗ Trợ Đa Nền Tảng : Golang hỗ trợ đa nền tảng, nghĩa là bạn có thể viết mã một lần và chạy trên nhiều hệ điều hành khác nhau mà không cần sửa đổi nhiều.
Hình 8 : Ngôn ngữ Golang 3.1.2 Ngôn ngữ HTML
HTML (Hypertext Markup Language) là ngôn ngữ đánh dấu chính để tạo trang web trên World Wide Web Cùng với CSS và JavaScript, HTML đóng vai trò quan trọng trong thiết kế website Được phát triển từ SGML, HTML phục vụ cho các tổ chức với yêu cầu xuất bản phức tạp và đã trở thành tiêu chuẩn của Internet do W3C duy trì Phiên bản chính thức mới nhất là HTML5, thay thế HTML 4.01 (1999) và XHTML.
Bằng cách sử dụng HTML động hoặc Ajax, lập trình viên có thể tạo ra và xử lý nhiều công cụ khác nhau, từ các chương trình soạn thảo văn bản đơn giản đến những công cụ xuất bản WYSIWYG phức tạp Hypertext là phương thức kết nối các trang Web được thiết kế bằng HTML, với các liên kết trên trang Web được gọi là Hypertext HTML, hay ngôn ngữ đánh dấu bằng thẻ, cho phép người dùng đánh dấu tài liệu văn bản bằng các thẻ để trình duyệt Web hiểu cách cấu trúc và hiển thị nội dung trên màn hình.
Hình 9 : Hình ảnh minh họa HTML 3.1.3 Ngôn ngữ CSS
CSS là ngôn ngữ tạo phong cách cho trang web – Cascading Style Sheet language.
CSS được sử dụng để tạo phong cách và định kiểu cho các yếu tố trong ngôn ngữ đánh dấu như HTML, giúp điều khiển định dạng cho nhiều trang web cùng lúc, tiết kiệm công sức cho người viết Nó phân biệt cách hiển thị của trang web với nội dung chính bằng cách kiểm soát bố cục, màu sắc và font chữ.
CSS, được phát triển bởi W3C vào năm 1996, ra đời nhằm khắc phục hạn chế của HTML, vốn chỉ được thiết kế để đánh dấu nội dung mà không hỗ trợ định dạng trang web hiệu quả.
Các thẻ như được giới thiệu trong HTML phiên bản 3.2 đã gây khó khăn cho lập trình viên do sự đa dạng về font chữ, màu nền và phong cách trên các trang web Việc viết lại mã cho trang web trở thành một quá trình dài và vất vả Để khắc phục vấn đề này, CSS được phát triển bởi W3C.
Hình 10 : Hình ảnh minh họa css 3.1.4 Ngôn ngữ lập trình TypeScript
TypeScript, một siêu tập của JavaScript do Microsoft phát triển, cung cấp kiểm soát kiểu dữ liệu tĩnh, giảm thiểu lỗi trong quá trình phát triển và nâng cao hiệu suất ứng dụng Nó biên dịch thành mã JavaScript, cho phép chạy trên cả trình duyệt và Node.js, đồng thời hỗ trợ nhiều tính năng của ES6 và lập trình hướng đối tượng TypeScript là lựa chọn lý tưởng cho các dự án phức tạp, giúp quản lý mã nguồn hiệu quả và khai thác sức mạnh của ngôn ngữ lập trình web Với cộng đồng phát triển đông đảo và tích hợp tốt với các công cụ phát triển, TypeScript trở thành giải pháp mạnh mẽ cho việc xây dựng ứng dụng web đa dạng.
Hình 11 : Ngôn ngữ lập trình Typescript
Ngôn ngữ thiết kế hệ thống UML
UML (Unified Modeling Language) là ngôn ngữ dành cho viê •c đă •c tả, hình dung, xây dựng và làm tài liê •u của các hê • thống phần mềm
UML tạo cơ hô •i để viết thiết kế hê • thống, bao gồm những khái niê •m như tiến trình nghiê •p vụ và các chức năng của hê • thống.
Xây dựng các mô hình UML là phương pháp hiệu quả để mô tả cấu trúc và hoạt động của hệ thống thông tin Cách tiếp cận này hỗ trợ người thiết kế, thực hiện và người sử dụng hệ thống, tạo ra cái nhìn tổng thể về hệ thống thông tin cần xây dựng Nhờ vào cái nhìn bao quát này, các yêu cầu của người dùng được nắm bắt đầy đủ, phục vụ cho các giai đoạn từ phân tích, thiết kế, thẩm định đến kiểm tra sản phẩm ứng dụng công nghệ thông tin.
UML sử dụng hệ thống ký hiệu thống nhất để biểu diễn các phần tử mô hình, từ đó tạo thành các sơ đồ UML Các sơ đồ UML chủ yếu bao gồm nhiều loại khác nhau, mỗi loại phục vụ cho mục đích mô tả và phân tích hệ thống.
- Sơ đồ lớp (Class Diagram)
- Sơ đồ đối tượng (Object Diagram)
- Sơ đồ tình huống sử dụng (Use Cases Diagram)
- Sơ đồ trình tự (Sequence Diagram)
- Sơ đồ cộng tác (Collaboration Diagram hay là Composite Structure Diagram)
- Sơ đồ trạng thái (State Machine Diagram)
- Sơ đồ thành phần (Component Diagram)
- Sơ đồ hoạt động (Activity Diagram)
- Sơ đồ gói (Package Diagram)
- Sơ đồ liên lạc (Communication Diagram)
- Sơ đồ tương tác (Interaction Overview Diagram - UML 2.0)
- Sơ đồ phối hợp thời gian (Timing Diagram - UML 2.0)
Hình 14 : Ngôn ngữ thiết kế hệ thống UML
PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG.17 4.1 Biểu đồ Use case
Biểu đồ phân rã các Use Case khách hàng
4.1.2.1 Tiến trình sử dụng hệ thống
Hình 16 : Tiến trình sử dụng hệ thống
Biểu đồ phân rã cho Use Case Admin
4.1.3.1 Tiến trình quản lý sản phẩm
Hình 18 : Tiến trình quản lý sản phẩm
4.1.3.2 Tiến trình quản lý tài khoản
Hình 19 : Tiến trình quản lý tài khoản
4.1.3.3 Tiến trình quản lý đơn đặt hàng
Hình 20 : Tiến trình quản lý đơn đặt hàng
Đặc tả một số Use Case
Use-case: Login (đăng nhập)
Objective: Đăng nhập vào tài khoản để truy cập các tính năng của hệ thống. Pre-conditions: Không có
Post-conditions: Người dùng đã đăng nhập thành công và có thể truy cập vào tài khoản cá nhân.
Description: Là hành động đăng nhập vào hệ thống thông qua liên kết “Đăng nhập” trong hệ thống
*Các tương tác chính của kịch bản “Login”
Hoạt động của người dùng Hoạt động của hệ thống 1.Người dùng chọn chức năng login trên giao diện
2.Hiển thị form đăng nhập cho người dùng
3.Điền username,password vào form đăng nhập và ấn nút đăng nhập
3.Kiểm tra đăng nhập, thông báo với người dùng là đã đăng nhập thành công, nếu có lỗi về username password sẽ thông báo lỗi
4.Người dùng nếu nhận được lỗi thì tiến hành đăng nhập lại, nếu không có thì sẽ truy cập được các tính năng của hệ thống
Use-case: client register (đăng kí)
Objective: Tạo một tài khoản mới để có thể truy cập các tính năng của hệ thống
Post-conditions: Người dùng đã đăng ký thành công và có thể đăng nhập vào tài khoản mới
Description: Người dùng truy cập trang đăng ký thông qua liên kết "Đăng ký" từ trang chủ hoặc thanh điều hướng
*Các tương tác chính của kịch bản “Client register”
Hành động của người dùng Hành động hệ thống
1.Người dùng chọn chức năng register 2.Hiển thị form đăng kí cho người dùng 3.Người dùng điền thông tin đầy đủ theo form đăng kí
4.Xác thực tài khoản hợp lệ hay không, và thông báo đăng kí đã thành công hoặc một lỗi nào đó trong form
4.1.4.3 Use Case xem sản phẩm
Use-case: View items (xem sản phẩm)
Objective: Xem sản phẩm được bán có trong hệ thống
Post-conditions: Người dùng xem các thông tin về sản phẩm như : giá cả, hạn sử dụng, hướng dẫn sử dụng…
Description: Là hành động click vào các sản phẩm có trong hệ thống hoặc xem những thông tin cơ bản đã hiển thị trong giao diện của hệ thống
*Các tương tác chính của kịch bản “View items”
Hoạt động của người dùng Hoạt động của hệ thống 1.Người dùng truy cập vào hệ thống không cần thiết phải đăng nhập
2.Hiển thị các sản phẩm có trong cửa hàng ( hệ thống)
3.Click vào sản phẩm trong hệ thống để xem những xem thông tin chi tiết
4.1.4.4 Use Case thêm sản phẩm vào giỏi hàng
Use-case: Add product into cart (thêm sản phẩm vào giỏ hàng)
Objective: Thêm sản phẩm vào giỏ hàng cá nhân
Pre-conditions: Đăng nhập đã đăng nhập vào tài khoản và đã truy cập vào hệ thống.
Post-conditions: Thêm sản phẩm vào giỏ hàng thành công, người dùng có thể xem được giỏ hàng đang có sản phẩm gì.
Description: Là hành động click chức năng thêm vào giỏ hàng, để thêm những sản phẩm mà khách hàng muồn mua
*Các tương tác chính của kịch bản “Add product into cart”
Khi người dùng đã đăng nhập và chọn được sản phẩm mong muốn, họ chỉ cần nhấn vào tính năng "thêm vào giỏ hàng" để lưu sản phẩm cho quá trình mua sắm tiếp theo.
2 Cập nhật sản phẩm của khách hàng vào giỏ hàng
3.Có thể thấy giỏ hàng đã chứa sản phẩm vừa thêm vào
4.1.4.5 Use Case thêm sản phẩm vào danh sách yêu thích
Use-case: Add product into wishlist (thêm sản phẩm vào danh sách yêu thích) Actors: Người dùng
Objective: Thêm sản phẩm vào danh sách yêu thích
Pre-conditions: Đăng nhập đã đăng nhập vào tài khoản và đã truy cập vào hệ thống.
Người dùng đã xem qua các sản phẩm ( thực hiện view items)
Post-conditions: Thêm sản phẩm danh sách yêu thích thành công
Hành động thêm sản phẩm vào danh sách yêu thích giúp người dùng lưu trữ những món đồ mà họ dự định mua hoặc yêu thích, mà không cần phải ghi nhớ Điều này không chỉ tiết kiệm thời gian mà còn giúp dễ dàng truy cập lại những sản phẩm quan tâm trong tương lai.
*Các tương tác chính của kịch bản “Add product into wishlist”
Người dùng đã đăng nhập và khi tìm thấy sản phẩm cần ghi chú, họ chỉ cần nhấn vào tính năng "thêm sản phẩm vào danh sách yêu thích".
2 Cập nhật sản phẩm của khách hàng đã chọn vào danh sách yêu thích
3.Có thể thấy trong danh sách yêu thích đã chứa sản phẩm vừa thêm vào
Use-case: Post comment (thêm bình luận về sản phẩm)
Objective: Thêm bình luận cho sản phẩm nào đó
Pre-conditions: Đăng nhập đã đăng nhập vào tài khoản và đã truy cập vào hệ thống.
Người dùng đã xem qua các sản phẩm (thực hiện view items)
Post-conditions: Thêm bình luận thành công, phần bình luận của sản phẩm sẽ hiển thị lên giao diện
Description: Là hành động thêm bình luân về sản phẩm ví dụ như về giá cả, chất lượng tính năng…
*Các tương tác chính của kịch bản “Post comment”
Khi người dùng đã đăng nhập, họ có thể chọn sản phẩm mà mình muốn bình luận Sau khi viết ý kiến vào ô văn bản đã được hệ thống cung cấp, người dùng chỉ cần nhấn nút "Đăng" để hoàn tất quá trình bình luận.
2 Hiển thị bình luận của người dùng về sản phẩm đó lên phần bình luận của sản phẩm
3.Có thể thấy bình luận của mình đã được hiển thị ở phần bình luận và cả của những người khác
Use-case: Check out (thanh toán)
Objective: Thanh toán giỏ hàng, hoặc trực tiếp sản phẩm nào đó
Pre-conditions: Đăng nhập đã đăng nhập vào tài khoản và đã truy cập vào hệ thống.
Post-conditions: Thanh toán thành công và chờ nhận hàng.
Description: Là hành động trả tiền cho những sản phẩm đã mua
Người dùng đã đăng nhập và lựa chọn sản phẩm mà họ muốn mua hoặc tiến hành thanh toán cho giỏ hàng đã được chọn trước đó.
2 Tính toán tổng giá và hiển thị cho người dùng
3.Thanh toán qua ngân hàng hoặc trực tiếp
4 Xác nhận thanh toán thành công
5 Nhận hóa đơn và nhận hàng
Use-case: Make purchase (Mua hàng)
Pre-conditions: Đăng nhập đã đăng nhập vào tài khoản và đã truy cập vào hệ thống.
Xem sản phẩm và thanh toán sản phẩm
Description: Là hành động chính của hệ thống bao gồm nhiều hành động phụ, mua hàng là use case tổng hợp gần như đầy đủ các bước mua hàng
*Các tương tác chính của kịch bản “Make purchase”
Hoạt động của người dùng Hoạt động của hệ thống 1.Người dùng đã đăng nhập, khi lựa chọn được sản phẩm muốn mua và thanh toán
2.Xác thực đơn hàng người dùng và giao hàng cho người dùng
3 Nhân hàng và hoàn tất quá trình mua hàng
4.1.4.11 Use Case quản khách hàng
Use-case: Manage users (Quản lí người dùng)
Objective: Quản lí thông tin và quyền của người dùng trong hệ thống
Post-conditions: Thay đổi thông tin và quyền của người dùng được lưu lại hệ thống
Description: Là hành động quản lí người dùng gia nhập vào hệ thống, kiểm toán hóa đơn đã bán được và người dùng mua hàng
*Các tương tác chính của kịch bản “Manage users”
Hoạt động của admin Hoạt động của hệ thống
1 Admin truy cập trang quản lý người dùng từ giao diện quản trị hoặc thanh điều hướng
2 Hệ thống hiển thị danh sách người dùng, bao gồm các thông tin như tên, email, vai trò, trạng thái tài khoản, và các thông tin khác
3 Admin có thể sử dụng các bộ lọc hoặc tìm kiếm để thu hẹp danh sách người dùng theo yêu cầu cụ thể.
4 Sau khi Admin thực hiện các thay đổi, hệ thống hiển thị thông báo xác nhận và cập nhật thông tin người dùng.
4.1.4.12 Use Case quán lý sản phẩm
Use-case: Manage products (Quản lí sản phẩm)
Objective: Quản lí thông tin các sản phẩm có trong cửa hàng
Pre-conditions: Đăng nhập vào tài khoản quản trị
Post-conditions: Thay đổi thông tin và trạng thái của sản phẩm được lưu lại trong hệ thống.
Description: Là hành động quản lí giá cả trạng thái còn hay hết hàng của sản phẩm, thêm sản phẩm mới hoặc xóa sản phẩm.
*Các tương tác chính của kịch bản “Manage products”
Hoạt động của admin Hoạt động của hệ thống
1 Admin truy cập trang quản lý sản phẩm từ giao diện quản trị hoặc thanh điều hướng.
2 Hệ thống hiển thị danh sách sản phẩm, bao gồm các thông tin như tên sản phẩm, mô tả, giá, số lượng trong
3 Admin có thể sử dụng các bộ lọc hoặc tìm kiếm để thu hẹp danh sách sản phẩm theo yêu cầu cụ thể.
4 Admin chọn một sản phẩm từ danh sách để xem chi tiết thông tin và các tùy chọn quản lý.
5 Chỉnh sửa, thay đổi, xóa sản phẩm theo nhu cầu của admin
6 Admin thực hiện các thay đổi 7 Hệ thống hiển thị thông báo xác nhận và cập nhật thông tin sản phẩm.
4.1.4.13 Use Case quản lý hóa đơn
Use-case: Manage bills (Quản lí hóa đơn)
Objective: Quản lý thông tin và trạng thái của hóa đơn trong hệ thống.
Pre-conditions: Đăng nhập vào tài khoản quản trị
Post-conditions: Thay đổi thông tin và trạng thái của hóa đơn được lưu lại trong hệ thống.
Description: Là hành động quản lí giá cả trạng thái của các hóa đơn, quản thí doanh thu, nắm bắt xu hướng của khách hàng.
*Các tương tác chính của kịch bản “Manage products”
Hoạt động của admin Hoạt động của hệ thống
1 Admin truy cập trang quản lý hóa đơn từ giao diện quản trị hoặc thanh điều hướng.
2 Hệ thống hiển thị danh sách hóa đơn, bao gồm các thông tin như số hóa đơn, ngày tạo, khách hàng, tổng giá trị, và trạng thái thanh toán.
3 Admin có thể sử dụng các bộ lọc hoặc tìm kiếm để thu hẹp danh sách hóa đơn theo yêu cầu cụ thể.
4 Admin chọn một hóa đơn từ danh sách để xem chi tiết thông tin và các tùy chọn quản lý.
5 Xem chi tiết hóa đơn, chỉnh sửa, thay đổi, xóa hóa đơn theo nhu cầu của admin
6 Admin thực hiện các thay đổi 7 Hệ thống hiển thị thông báo xác nhận
Biểu đồ hoạt động
Hình 21 : Biểu đồ hoạt động đăng ký
Hình 22 : Biểu đồ hoạt động đăng nhập
Hình 23 : Biểu đồ hoạt động bình luận
4.2.4 Thêm sản phẩm vào giỏ hàng
Hình 24 : Biểu đồ hoạt động thêm sp vào giỏ hàng
Hình 25 : Biểu đồ hoạt động thanh toán
Hình 26 : Biểu đồ hoạt động thêm comment
4.2.10 Cập nhật thông tin cá nhân
Hình 27 : Biểu đồ hoạt động cập nhật thông tin cá nhân
Hình 28 : Biểu đồ hoạt động quản lý tài khoản
Hình 29 : Biểu đồ hoạt động quản lý sản phẩm 4.2.13 Quản lý đơn đặt hàng
Hình 30 : Biểu đồ hoạt động đơn đặt hàng
Biểu đồ tuần tự
Hình 32 : Biểu đồ tuần tự đăng ký
Hình 33 : Biểu đồ tuần tự đăng nhập
Hình 34 : Biểu đồ tuần tự bình luận
4.2.6 Thêm sản phẩm vào giỏ hàng
Hình 35 : Biểu đồ tuần tự thêm sp vào giỏ hàng 4.2.7 Thanh toán
Hình 36 : Biểu đồ tuần tự thanh toán
Hình 37 : Biểu đồ tuần tự thêm blog 4.2.10 Cập nhật thông tin cá nhân
Hình 38 : Biểu đồ tuần tự cập nhật thông tin cá nhân 4.2.11 Quản lý users
Hình 39 : Biểu đồ tuần tự quản lý tài khoản
THIẾT KẾ CƠ SỞ DỮ LIỆU
Cơ sở dữ liệu đóng vai trò quan trọng trong việc xây dựng hệ thống, giúp nghiên cứu các lớp và mối quan hệ một cách chặt chẽ Điều này không chỉ làm cho việc lập trình trở nên dễ dàng hơn mà còn nâng cao hiệu suất của hệ thống.
Hình 40 : Mối quan hệ giữa các bảng
THIẾT KẾ WEBSITE
Giao diện người dùng
Trên trang chủ còn hiển thị một số sản phẩm nổi bật, được nhiều lượt quan tâm và đặt mua của khách hàng.
1.1.1.2 Sản phẩm bán chạy nhất
Hình 43 : Trang chủ 3 1.1.1.3 Sản phẩm mới nhất
Phần footer trang web là nơi hiển thị một sô thông điệp hướng tới khách hàng cũng như địa chỉ và cách thức liên lạc với cửa hàng.
Hình 45 : Footer 1.1.2 Giao diện đăng nhập
Để sử dụng các chức năng trên trang web, người dùng cần đăng nhập bằng tài khoản và mật khẩu chính xác Ngoài ra, người dùng cũng có thể dễ dàng đăng nhập thông qua tài khoản Google hoặc Facebook.
Hình 46 : Giao diện đăng nhập 1.1.3 Giao diện đăng ký
Nếu bạn chưa có tài khoản, hãy đăng ký ngay tại giao diện đăng ký Bạn cũng có thể sử dụng tài khoản Google hoặc Facebook để thực hiện việc đăng ký một cách nhanh chóng và tiện lợi.
Để thực hiện việc đặt hàng trên trang web, khách hàng cần truy cập vào giao diện cập nhật thông tin khách hàng và điền đầy đủ thông tin cần thiết.
Hình 48 : Giao diện cập nhật thông tin khách hàng
Hình 49 : Header trang sản phẩm 1.1.5.1 Giao diện hiển thị các sản phẩm
Giao diện sản phẩm trên trang web cho phép khách hàng dễ dàng lựa chọn, xem chi tiết, thêm sản phẩm vào giỏ hàng hoặc lưu vào mục yêu thích.
Hình 50 : Các sản phẩm 1.1.5.2 Giao diện chi tiết sản phẩm
Hình 51 : Chi tiết sản phẩm
Hình 62 : Chi tiết sản phẩm
Hình 63 : Giao diện liên hệ 1.1.7 Giao diện blog
Hình 64.Giao diện blog 1.1.7.1 Bình luận
Người dùng có thể chọn đọc một bài viết và để lại bình luận.
Hình 52 : Bình luận 1.1.8 Giao diện giỏ hàng
Một trang web thương mại điện tử thì không thể thiếu chức năng thêm vào giỏ hàng Ở đây hiển thị những mặt hàng mà khách hàng đã chọn.
Hình 67 : Giỏ hàng 1.1.9 Giao diện danh sách yêu thích
Hình 53 : danh sách yêu thích 1.1.10 Giao diện thanh toán
KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN
Để xây dựng một hệ thống website bán hàng hoàn hảo, cần tuân theo các giai đoạn khảo sát, phân tích, thiết kế hệ thống, nghiên cứu công cụ lập trình, thiết kế website và kiểm thử Hiện nay, với nhiều lựa chọn công nghệ mới, việc phát triển một website quản lý ký túc xá đơn giản và tối ưu là rất quan trọng Qua nghiên cứu và xây dựng đề tài này, chúng tôi đã củng cố và học hỏi được nhiều kiến thức bổ ích.
Hiểu và xây dựng phân tích cũng như thiết kế hệ thống là rất quan trọng Bạn cần có khả năng vẽ và thao tác với nhiều loại biểu đồ như biểu đồ use-case, biểu đồ hoạt động, biểu đồ lớp và biểu đồ tuần tự Bên cạnh đó, việc đặc tả use-case cũng là một kỹ năng cần thiết trong quá trình phát triển hệ thống.
Học hỏi và nắm vững các ngôn ngữ lập trình cần thiết, cùng với việc hiểu rõ về API và các framework phù hợp Tối ưu hóa mã nguồn để đảm bảo hiệu suất tốt nhất, đồng thời tuân thủ các quy tắc cần thiết trong lập trình.
- Nâng cao trình độ thao tác, tư duy lập trình nhạy bén hơn
Việc xây dựng website bán hàng không chỉ giúp chúng em tạo ra nhiều trang web tương tự mà còn nâng cao kỹ năng lập trình của mình.
Từ những nghiên cứu và bắt tay vào xây dựng đề tài thì chúng em đã đạt được một số kết quả như sau:
- Tạo nên một website bán hàng với giao diện có tính thẩm mĩ cao, nhiều chức năng mới mẻ, tối ưu hóa trong việc quản lý và tìm kiếm.
- Giúp khách hàng đặt hàng một cách nhanh chóng và tiện lợi
Website có thêm nhiều chức năng hơn, tối ưu hóa SEO, bảo mật website tốt hơn trước đó
Do thời gian hạn chế nên việc xây dựng UI của admin chưa được đẹp mắt và tối giản.
Để nâng cao trải nghiệm người dùng, cần hoàn thiện giao diện website với đầy đủ chức năng và phát triển tính năng để website trở nên phổ biến hơn Bên cạnh đó, việc xây dựng giao diện admin hoàn chỉnh sẽ giúp chủ cửa hàng hoặc doanh nghiệp dễ dàng quản lý và điều hành hoạt động kinh doanh.
Cố gắng học hỏi thêm nhiều framework khác nhau để tối ưu và nâng cao hiệu suất trang web.