1. Trang chủ
  2. » Cao đẳng - Đại học

Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)

95 6 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Xây Dựng Website Bán Sách Điện Tử
Tác giả Trần Lương Nguyên, Nguyễn Quốc Dũng
Người hướng dẫn ThS. Trần Thị Hồng Yến
Trường học Đại học Quốc Gia Thành Phố Hồ Chí Minh
Chuyên ngành Công Nghệ Thông Tin
Thể loại báo cáo đồ án
Năm xuất bản 2022
Thành phố Thành Phố Hồ Chí Minh
Định dạng
Số trang 95
Dung lượng 3,88 MB

Cấu trúc

  • Chương 1 TỔNG QUAN VỀ ĐỀ TÀI (15)
    • 1.1 Giới thiệu về đề tài (15)
      • 1.1.1 Tầm quan trọng sách (15)
      • 1.1.2 Lý do chọn đề tài (15)
    • 1.2 Khảo sát hiện trạng (16)
    • 1.3 Đối tượng nghiên cứu (16)
    • 1.4 Phạm vi nghiên cứu (17)
    • 1.5 Phương pháp nghiên cứu (17)
    • 1.6 Nhiệm vụ của đề tài (17)
    • 1.7 Mục tiêu của đề tài (17)
    • 2.1 Tổng quan về ReactJs (18)
      • 2.1.1 Giới thiệu (18)
      • 2.1.2 Cách hoạt động (18)
      • 2.1.3 Ưu nhược điểm (19)
    • 2.2 Tổng quan về Redux Toolkit (21)
      • 2.2.1 Giới thiệu (21)
      • 2.2.2 Cách sử dụng (21)
      • 2.2.3 Ưu điểm (21)
    • 2.3 Tổng quan về Ant design (22)
      • 2.3.1 Giới thiệu (22)
      • 2.3.2 Cách hoạt động (22)
      • 2.3.3 Ưu nhược điểm (22)
    • 2.4 Tổng quan về NodeJs (22)
      • 2.4.1 Giới thiệu (22)
      • 2.4.2 Khả năng sử dụng (23)
      • 2.4.3 Thành phần (23)
      • 2.4.4 Lợi ích của (24)
      • 2.4.5 Trường hợp sử dụng (24)
    • 2.5 Tổng quan về ExpressJs (25)
      • 2.5.1 Giới thiệu (25)
      • 2.5.2 Cấu trúc của ExpressJs (25)
      • 2.5.3 Ưu nhược điểm của ExpressJs (26)
    • 2.6 Tổng quan về JSON Web Token (27)
      • 2.6.1 Giới thiệu (27)
      • 2.6.2 Cấu trúc của JWT (27)
      • 2.6.3 Trường hợp sử dụng (28)
    • 2.7 Tổng quan về MongoDB (28)
      • 2.7.1 Giới thiệu (28)
      • 2.7.2 Một vài khái niệm cơ bản trong MongoDB (29)
      • 2.7.3 Ưu nhược điểm (30)
    • 3.1 Mô tả yêu cầu (31)
      • 3.1.1 Yêu cầu chức năng (31)
      • 3.1.2 Yêu cầu phi chức năng (33)
    • 3.2 Kiến trúc hệ thống (34)
      • 3.2.1 Mô tả kiến trúc Front-End (34)
      • 3.2.2 Mô tả kiến trúc Back-End (37)
    • 4.1 Sơ đồ Use case (39)
      • 4.1.1 Đăng kí (40)
      • 4.1.2 Xác thực tài khoản (40)
      • 4.1.3 Đăng nhập (41)
      • 4.1.4 Quên mật khẩu (42)
      • 4.1.5 Cập nhật mật khẩu (43)
      • 4.1.6 Chỉnh sửa thông tin cá nhân (43)
      • 4.1.7 Tìm kiếm sách (44)
      • 4.1.8 Thêm sách vào giỏ hàng (44)
      • 4.1.9 Mua hàng (45)
      • 4.1.10 Xác thực đơn hàng (45)
      • 4.1.11 Nhận xét đánh giá (46)
      • 4.1.12 Quản lí đơn hàng (46)
      • 4.1.13 Thêm sách mới (47)
      • 4.1.14 Nhập sách (48)
      • 4.1.15 Chỉnh sửa thông tin sách (48)
      • 4.1.16 Nhập sách (49)
      • 4.1.17 Thêm thể loại mới (50)
      • 4.1.18 Chỉnh sửa thông tin thể loại (51)
      • 4.1.19 Xóa thể loại (51)
      • 4.1.20 Thêm tác giả (53)
      • 4.1.21 Chỉnh sửa thông tin tác giả (54)
      • 4.1.22 Xóa tác giả (55)
      • 4.1.23 Thêm mã giảm giá (57)
      • 4.1.24 Chỉnh sửa thông tin mã giảm giá (57)
      • 4.1.25 Xóa thông tin mã giảm giá (58)
      • 4.1.26 Xác nhận đơn hàng (59)
      • 4.1.27 Hủy đơn đặt hàng (60)
      • 4.1.28 Xem chi tiết đơn đặt hàng (60)
      • 4.1.29 Xác thực đơn đặt hàng từ các khách hàng chưa đăng kí tài khoản (61)
      • 4.1.30 Báo cáo (62)
    • 4.2 Thiết kế dữ liệu (63)
      • 4.2.1 Danh sách các đối tượng trong hệ thống (64)
      • 4.2.2 Dữ liệu người dùng (64)
      • 4.2.3 Dữ liệu sách (65)
      • 4.2.4 Dữ liệu thể loại (66)
      • 4.2.5 Dữ liệu tác giả (67)
      • 4.2.6 Dữ liệu đánh giá (68)
      • 4.2.7 Dữ liệu mã giảm giá (68)
      • 4.2.8 Dữ liệu đơn hàng (69)
    • 4.3 Thiết kế giao diện (70)
      • 4.3.1 Giao diện của người dùng (70)
      • 4.3.2 Giao diện của admin (80)
    • 5.1 Đánh giá (92)
      • 5.1.1 Thuận lợi (92)
      • 5.1.2 Khó khăn (92)
    • 5.2 Kết quả đạt được (92)
      • 5.2.1 Ưu điểm (92)
      • 5.2.2 Nhược điểm (92)
    • 5.3 Hướng phát triển (93)

Nội dung

TỔNG QUAN VỀ ĐỀ TÀI

Giới thiệu về đề tài

Sự phát triển của nhân loại luôn gắn liền với sách, công cụ lưu giữ kiến thức và truyền đạt cho các thế hệ sau Sách không chỉ chứa đựng thông tin mà còn phản ánh giá trị vật chất và tinh thần của con người, đồng thời thể hiện tình cảm trong những vấn đề cuộc sống Mỗi cuốn sách mang đến những chủ đề và lĩnh vực khác nhau, nhưng đều nhằm mục đích cung cấp tri thức mới và giá trị nhân loại cho độc giả.

Sách là nguồn kiến thức vô tận, giúp con người kết nối với thế giới và khám phá nền văn minh nhân loại Nhờ có sách, xã hội mới có thể phát triển và tiến bộ Dù xã hội có thay đổi ra sao, giá trị to lớn mà sách mang lại cho nhân loại vẫn luôn tồn tại và không thể bị xóa nhòa.

Sách là nguồn tri thức quý giá, giữ gìn những giá trị lịch sử cho thế hệ sau Vai trò của sách trong sự phát triển của xã hội loài người là không thể thiếu.

1.1.2 Lý do chọn đề tài

Hiện nay, sự phát triển mạnh mẽ của internet và hệ thống logistics đã thúc đẩy sự tăng trưởng nhanh chóng của các ngành nghề kinh doanh và thương mại điện tử Các công ty và tập đoàn đang đầu tư mạnh mẽ vào lĩnh vực này, khiến cho thương mại điện tử trở nên vượt trội hơn so với các phương thức thương mại truyền thống Chỉ với vài thao tác đơn giản trên thiết bị thông minh, người dùng có thể dễ dàng chọn lựa sản phẩm và nhận hàng tận nhà Đồng thời, nhu cầu về sách cũng ngày càng gia tăng, không chỉ phục vụ cho học tập và tra cứu thông tin mà còn đáp ứng nhu cầu giải trí.

Sách truyền thống đang gặp nhiều khó khăn như nguồn sách hạn chế và khó tiếp cận cho khách hàng ở xa Để khắc phục những vấn đề này, nhóm chúng em đã quyết định phát triển dự án "Xây dựng website bán sách", nhằm đáp ứng nhu cầu tìm kiếm và mua các đầu sách chính thống có bản quyền.

Khảo sát hiện trạng

Trên thị trường hiện nay, có nhiều website bán sách online như fahasa.com, cachep.vn và bookbuy.vn Tuy nhiên, hầu hết các trang web này không tập trung hoàn toàn vào việc bán sách mà thường kết hợp với các mặt hàng khác như đồ chơi và văn phòng phẩm Do đó, nhóm quyết định phát triển một website chuyên biệt chỉ phục vụ nhu cầu tìm kiếm và mua sách của khách hàng.

Đối tượng nghiên cứu

Đồ án này hướng đến nghiên cứu các đối tượng sau:

❖ Các công nghệ: o NodeJs o ExpressJs o JSON Web Token o MongoDB o Cloundinary o ReactJs o Redux o Ant design o Tailwind css

Đối tượng mà đề tài này hướng đến bao gồm các nhà sách có nhu cầu mở rộng kinh doanh sang hình thức trực tuyến và khách hàng muốn tìm kiếm, tra cứu và mua sách qua mạng.

Phạm vi nghiên cứu

Đề tài tập trung vào nghiên cứu về ứng dụng website bán sách, phục vụ việc kinh doanh online của các nhà sách.

Phương pháp nghiên cứu

Nhóm đã sử dụng các phương pháp nghiên cứu:

- Phương pháp đọc tài liệu

- Phương pháp phân tích các ứng dụng hiện có.

Nhiệm vụ của đề tài

Đề tài “Website bán sách” là một ứng dụng chạy trên nền web đáp ứng các yêu cầu sau:

- Cung cấp đầy đủ các tính năng tìm kiếm, mua bán sách cho nhiều đối tượng khách hàng khác nhau(có hoặc chưa có tài khoản)

- Cung cấp đầy đủ các tính năng phục vụ việc kiểm soát, quản lí tài nguyên và hoạt động kinh doanh của nhà sách.

Mục tiêu của đề tài

- Tìm hiểu cách xây dựng ứng dụng web

- Tìm hiểu về kiến trúc hệ thống, những công nghệ liên quan

- Xây dựng thành công ứng dụng website bán sách

2 Chương 2 - CƠ SỞ LÝ THUYẾT

Tổng quan về ReactJs

React.js là một thư viện JavaScript ngày càng phổ biến trong xu hướng phát triển ứng dụng một trang (Single Page Application) Khác với các framework khác tìm cách xây dựng mô hình MVC hoàn chỉnh, React nổi bật nhờ sự đơn giản và khả năng tích hợp dễ dàng với các thư viện JavaScript khác.

React là thư viện UI được phát triển bởi Facebook, giúp xây dựng các thành phần giao diện người dùng tương tác, có trạng thái và tái sử dụng Thư viện này không chỉ được sử dụng trong sản xuất tại Facebook mà còn là nền tảng chính cho Instagram, nơi toàn bộ ứng dụng được viết bằng React.

React là một thư viện hấp dẫn vì nó không chỉ hoạt động trên phía client mà còn có khả năng render trên server, cho phép kết nối linh hoạt giữa các phần Thư viện này so sánh sự thay đổi giữa các giá trị của lần render hiện tại và lần render trước, từ đó cập nhật một cách tối ưu nhất các thay đổi trên DOM.

Với React, người dùng có khả năng viết mã HTML thông qua Javascript, khác với các phần tử DOM của trình duyệt, các phần tử React được coi là những đối tượng đơn giản React DOM đảm nhận nhiệm vụ cập nhật DOM để tương thích với các phần tử React.

Một ứng dụng thường chỉ có một DOM node gốc Để render một React element vào node gốc ta cần tuyền tất cả vào hàm ReactDOM.render()

❖ Cách cập nhật một element

Tất cả các phần tử React đều không thay đổi (immutable), nghĩa là khi một phần tử được tạo ra, bạn không thể chỉnh sửa các thành phần con hoặc thuộc tính của nó Để cập nhật phần tử, cách duy nhất là truyền nó vào hàm ReactDOM.render().

React sẽ so sánh element và các thành phần con của nó với cái trước đó và chỉ cập nhật những node cần thiết lên DOM thật

React là một thư viện dễ sử dụng, đảm nhận vai trò 'V' (View) trong mô hình MVC (Model-View-Controller) Nó kết hợp HTML và JavaScript thuần, mang đến cú pháp dễ hiểu cho người dùng.

❖ Tăng tốc độ tải trang với Virtual DOM

Việc sử dụng Real DOM với cấu trúc cây lớn có thể gây tốn thời gian và rủi ro khi cập nhật, vì toàn bộ cây DOM phải được thay đổi Để khắc phục vấn đề này, React áp dụng Virtual DOM, nơi mỗi lần render, React tạo ra một DOM ảo và lưu trữ trong bộ nhớ Khi state của component thay đổi, DOM ảo sẽ được cập nhật và so sánh với phiên bản cũ thông qua thuật toán ‘diffing’, nhằm xác định các node cần thay đổi Cuối cùng, chỉ những node cần thiết sẽ được cập nhật trên DOM thật, giúp quá trình cập nhật diễn ra mượt mà và nhanh chóng, nâng cao hiệu suất hoạt động của website.

❖ Tái sử sụng dễ dàng với các Component

React cho phép lập trình viên tái sử dụng các component đã được định nghĩa trước đó, giúp phát triển các ứng dụng với chức năng tương tự một cách dễ dàng Đây là một trong những ưu điểm nổi bật của ReactJS, mang lại lợi thế cho lập trình viên trong việc thực hiện các dự án.

❖ Viết component dễ dàng với JSX

Khi nói đến React, JSX (Javascript + XML) là một phần không thể thiếu JSX là cú pháp mở rộng tương tự như XML, cho phép lập trình viên sử dụng cú pháp của XML để phát triển ứng dụng React mà không làm thay đổi ý nghĩa của Javascript Điều này giúp định nghĩa và quản lý các component phức tạp một cách dễ dàng hơn, đồng thời tăng tính dễ đọc và hiểu cho các component.

Tốc độ tải trang đóng vai trò quan trọng trong tối ưu hóa SEO React sử dụng Virtual DOM để cải thiện tốc độ tải trang của ứng dụng, từ đó nâng cao hiệu quả SEO.

React có khả năng tạo ra giao diện người dùng dễ dàng truy cập cho các công cụ tìm kiếm Tuy nhiên, để tối ưu hóa hoàn toàn khả năng SEO của trang web, cần phải sử dụng thêm các thư viện hỗ trợ, cùng với việc chú trọng vào nội dung, định tuyến và tương tác của người dùng.

❖ Dễ tích hợp và kiểm thử

React chỉ là một thư viện hỗ trợ tạo giao diện người dùng (View), vì vậy nó có thể dễ dàng tích hợp vào các framework khác như Angular, BackboneJS, giúp mở rộng khả năng phát triển ứng dụng web linh hoạt và hiệu quả.

React được thiết kế với việc tạo ra các component riêng lẻ, nên việc kiểm thử

Giao diện người dùng (UI) và chức năng đã được đơn giản hóa theo từng thành phần Việc tích hợp các thư viện kiểm thử như Jest, Enzyme và React Testing Library sẽ giúp quá trình kiểm thử trở nên dễ dàng và hiệu quả hơn.

ReactJS chỉ là thư viện cho tầng View, không phải là một framework MVC như các framework khác Được phát triển bởi Facebook, React giúp render phần view mà không bao gồm Model và Controller, do đó cần kết hợp với các thư viện khác Ngoài ra, React cũng không hỗ trợ hai chiều binding hay Ajax.

❖ Tích hợp Reactjs vào các framework MVC truyền thống yêu cầu cần phải cấu hình lại

React có kích thước tương đương với Angular, khoảng 35kb so với 39kb của Angular, tuy nhiên React được xem là nhẹ hơn so với nhiều framework khác Điều này cho thấy React là một lựa chọn hợp lý cho các dự án cần hiệu suất cao mà vẫn đảm bảo tính năng linh hoạt.

❖ Khó tiếp cận cho người mới học Web

Tổng quan về Redux Toolkit

Redux là một công cụ quản lý state phổ biến, nhưng thường bị chỉ trích vì sự phức tạp và độ dài của mã nguồn Để xây dựng một store hoàn chỉnh, người dùng phải thực hiện nhiều bước, tạo ra nhiều file và gặp phải tình trạng lặp lại mã Hơn nữa, Redux không cung cấp một quy chuẩn rõ ràng cho việc viết logic, và đôi khi cần phải cài đặt thêm các thư viện như middleware hay selectors để hoàn thiện quy trình quản lý state.

Redux Toolkit là một package được phát triển bởi đội ngũ reduxjs nhằm giải quyết hầu hết các vấn đề liên quan đến việc sử dụng Redux Nó giúp lập trình viên viết code Redux một cách nhanh chóng, gọn gàng và tuân thủ một quy chuẩn thống nhất.

Cài đặt redux toolkit bằng npm install @reduxjs/toolkit hoặc yarn add

- Khai báo createSlice của @reduxjs/toolkit

- Tạo 1 initialState: vai trò là khung dữ liệu của state và giữ giá trị khởi tạo

- Sử dụng createSlice định nghĩa các reducer thao tác với initialState

- Exports ra các action là các function viết trong createSlice reducer

Tạo file store.js, khai báo các reducer và bỏ các reducer vào rootReducer

Sử dụng redux persist để tránh mất dữ liệu state trong redux khi refresh page

Sử dụng các state và dispatch state bằng 2 hook của react-redux là useSelector và useDispatch

Redux toolkit giúp viết redux dễ dàng hơn, nhanh hơn và gọn hơn, có quy chuẩn rõ ràng, dễ tiếp cận

Tổng quan về Ant design

Ant Design là bộ công cụ các components React được phát triển theo tiêu chuẩn thiết kế của Ant UED Team Tương tự như Material Design, Ant Design cung cấp nhiều component phổ biến cho ứng dụng web hiện đại, bao gồm Layout, Button, Icon, và DatePicker Ngoài ra, Ant Design còn có những component độc đáo như LocaleProvider, cho phép người dùng thay đổi ngôn ngữ trên toàn bộ ứng dụng.

Chỉ cần tải thư viện Ant design về bằng lệnh npm install antd là có thể sử dụng các component của ant và có thể style lại cho nó

Thư viện UI Ant giúp xây dựng giao diện nhanh chóng với các component hỗ trợ nhiều API, cho phép người dùng dễ dàng tùy chỉnh kiểu dáng Các UI component của Ant nổi bật với thiết kế đẹp, gọn gàng và dễ dàng kết hợp với bất kỳ thành phần nào trong giao diện.

Ant design khá nặng, nhiều document còn tiếng trung đặc biệt là với Ant design pro nên gây khó khăn cho lập trình viên tìm hiểu trong document.

Tổng quan về NodeJs

NodeJS là một nền tảng mã nguồn mở, đa nền tảng, chạy trên môi trường JavaScript, được phát triển dựa trên động cơ V8 của Chrome, cho phép thực thi mã JavaScript bên ngoài trình duyệt Ra đời vào năm 2009, NodeJS nổi bật với khả năng lập trình bất đồng bộ, mang lại hiệu suất cao cho các ứng dụng web.

NodeJS là nền tảng phát triển ứng dụng mạng nhanh và dễ mở rộng, được xây dựng trên môi trường thực thi JavaScript của Chrome.

NodeJS là một công cụ mạnh mẽ cho các ứng dụng dữ liệu thời gian thực trên thiết bị phân tán, nhờ vào mô hình lập trình I/O theo sự kiện và không chặn Điều này giúp NodeJS trở nên gọn nhẹ và hiệu quả, phù hợp cho các ứng dụng yêu cầu xử lý nhanh chóng và linh hoạt.

NodeJS là một môi trường runtime mã nguồn mở, đa nền tảng, lý tưởng cho việc phát triển ứng dụng mạng và ứng dụng server-side Các ứng dụng NodeJS được lập trình bằng JavaScript và có khả năng hoạt động trên các hệ điều hành như OS X, Microsoft Windows và Linux.

NodeJS cung cấp một thư viện phong phú với nhiều module JavaScript khác nhau, giúp đơn giản hóa quá trình phát triển ứng dụng web và giảm thiểu việc sử dụng quá mức Node.js.

Node.js là một nền tảng phát triển ứng dụng mạnh mẽ, đáp ứng đầy đủ nhu cầu lập trình và phát triển ứng dụng Các chuyên gia công nghệ khuyến nghị sử dụng Node.js cho việc phát triển các ứng dụng như máy chủ Websocket và ứng dụng tải tệp nhanh.

Ad Server, Cloud Services, RESTful API, Any Real-time Data Application, …

Một module của Node.js có thể được coi như một thư viện của JavaScript, là tập hợp các hàm có thể được thêm vào ứng dụng để sử dụng Node.js cung cấp một tập hợp các module có sẵn mà bạn có thể sử dụng mà không cần cài đặt thêm, đồng thời cũng cho phép bạn tự viết các module riêng biệt để đáp ứng nhu cầu cụ thể của mình.

NPM là công cụ quản lý gói cho Node.js, cho phép người dùng tải về và sử dụng các package/module của Node Công cụ này đã được cài đặt sẵn khi bạn cài Node.js.

Node.js is ideal for event-driven applications, where every action on the server is treated as an event It includes a built-in module called Events, which enables developers to create, emit, and listen for custom events.

Node.js chủ yếu được phát triển bằng ngôn ngữ lập trình JavaScript, một ngôn ngữ phổ biến và được sử dụng rộng rãi, có khả năng hoạt động trên nhiều trình duyệt, nền tảng và hệ điều hành khác nhau.

❖ Nodejs khá nhẹ nhưng lại hiệu quả nhờ vào cơ chế non-blocking I/O, chạy đa nền tảng trên Server và dùng Event-driven

❖ Tương thích với nhiều thiết bị Bạn có thể chạy các ứng dụng phát triển bởi Nodejs trên bất cứ thiết bị nào, dù là Mac, Window, Linux,…

❖ Cộng đồng Nodejs khá lớn và được cung cấp miễn phí cho người dùng

❖ Ứng dụng NodeJS có khả năng chạy đa nền tảng, thiết bị, đồng thời đáp ứng được yêu cầu về thời gian thực

❖ Node.js có tốc độ cực kỳ nhanh, xử lý được nhu cầu sử dụng của lượng khách truy cập ‘khổng lồ’ trong thời gian cực ngắn

Ứng dụng được phát triển bằng Node.js có khả năng xử lý đồng thời nhiều yêu cầu truy cập, giúp bảo vệ website của bạn khỏi nguy cơ bị sập khi lượng truy cập tăng cao.

NodeJS có những hạn chế khi phát triển ứng dụng nặng và tốn tài nguyên, chẳng hạn như mã hóa video, chuyển đổi file và giải mã mã hóa Điều này xuất phát từ việc NodeJS được lập trình bằng C++ và JavaScript, yêu cầu phải thông qua một trình biên dịch của NodeJS, dẫn đến việc tiêu tốn nhiều thời gian hơn trong quá trình xử lý.

❖ Thiếu sự kiểm duyệt chất lượng các module NodeJS

NodeJS là lựa chọn lý tưởng cho các dự án liên quan đến MongoDB, ExpressJs, AngularJs, BackBoneJs, và ReactJs, giúp xây dựng hệ thống hoàn toàn bằng JavaScript Việc sử dụng chung một ngôn ngữ mang lại sự thuận lợi và dễ dàng trong quá trình phát triển.

❖ Realtime: NodeJS rất tốt cho các ứng dụng yêu cầu realtime

NodeJS không chỉ hỗ trợ giao thức HTTP mà còn cho phép phát triển các ứng dụng với nhiều giao thức kết nối khác nhau Với khả năng hỗ trợ giao thức TCP, NodeJS giúp bạn dễ dàng xây dựng các giao thức tùy chỉnh theo nhu cầu của mình.

Tổng quan về ExpressJs

ExpressJS là một framework ứng dụng web mã nguồn mở và miễn phí, được phát triển trên nền tảng Node.js, giúp thiết kế và phát triển ứng dụng web nhanh chóng Người dùng chỉ cần kiến thức về JavaScript để làm quen với ExpressJS, điều này làm cho việc xây dựng ứng dụng web và API trở nên đơn giản hơn cho các lập trình viên đã thành thạo ngôn ngữ này.

Cấu trúc cơ bản của một dự án sử dụng ExpressJs

Hình 2-1 Cấu trúc cơ bản của một dự án sử dụng ExpresJs

Vai trò các thành phần trong một dự án sử dụng ExpressJs

+ App.js chứa các thông tin về cấu hình, khai báo, các định nghĩa, để ứng dụng của chúng ta chạy ok

+ package.json chứa các package cho ứng dụng chạy

- Routers: Thư mục này sẽ chứa tất cả các tuyến đường mà bạn đã tạo bằng cách sử dụng Express Router và kết hợp với Controllers

- Controller: Thư mục này sẽ chứa tất cả các chức năng dể viết các API của ứng dụng

- Models: Thư mục này sẽ chứa tất cả các files như schema của và các chức năng cần thiết cho schema

Middleware là thư mục chứa toàn bộ phần mềm trung gian mà bạn đã phát triển, cho phép tái sử dụng các chức năng này nhiều lần trong suốt ứng dụng.

- Public: Thư mục này sẽ chứa các file css, js, images, cho ứng dụng 2.5.3 Ưu nhược điểm của ExpressJs

❖ Rất dễ học, chỉ cần bạn biết JavaScript, bạn sẽ không cần phải học một ngôn ngữ mới để học ExpressJS

❖ Giúp cho việc phát triển back-end dễ dàng hơn nhiều khi sử dụng ExpressJS

❖ Mã JavaScript được diễn giải thông qua Google V8 JavaScript Engine của Node.js Do đó, mã sẽ được thực hiện một cách nhanh chóng và dễ dàng

❖ ExpressJS rất đơn giản để tùy chỉnh và sử dụng theo nhu cầu

❖ Cung cấp một module phần mềm trung gian linh hoạt và rất hữu ích để thực hiện các tác vụ bổ sung theo phản hồi và yêu cầu

❖ Hỗ trợ phát triển ứng dụng theo mô hình MVC, đây là mô hình phổ biến cho việc lập trình web hiện nay

Do ExpressJs được xây dựng trên NodeJs nên nó cũng mang những nhược điểm vốn có của NodeJs như:

❖ Còn nhiều hạn chế khi xây dựng ứng dụng nặng, tốn tài nguyên như encoding video, convert file, decoding encryption

❖ Thiếu sự kiểm duyệt chất lượng các module NodeJS

Tổng quan về JSON Web Token

JWT, hay JSON Web Tokens, là một tiêu chuẩn mở theo RFC 7519, được sử dụng như một phương tiện nhỏ gọn để truyền tải thông tin giữa server và client thông qua chuỗi JSON.

Thông tin truyền qua JWT được bảo mật và tăng cường độ tin cậy nhờ vào chữ ký điện tử, sử dụng các khóa công khai và riêng tư với các thuật toán RSA, ECDSA và HMAC.

Một JWT có cấu trúc như sau:

..

Header của token bao gồm hai phần chính: loại token, mặc định là JWT, cho biết đây là một Token JWT, và thuật toán mã hóa được sử dụng, đó là HMAC SHA256.

The payload contains claims, which are expressions about an entity, such as a user, along with some supporting metadata There are three common types of claims found in a payload: reserved claims, public claims, and private claims.

Reserved claims are predefined metadata essential for ensuring the validity and completeness of a JWT (JSON Web Token) Key mandatory claims include "iss" (issuer), "iat" (issued-at time), "exp" (expiration time), "sub" (subject), "aud" (audience), and "jti" (unique identifier for the JWT), while additional claims may also be followed for optimal compliance.

- Public Claims: Claims được cộng đồng công nhận và sử dụng rộng rãi

Các yêu cầu riêng tư (Private Claims) là những yêu cầu tự định nghĩa, không được trùng lặp với các yêu cầu dự trữ (Reserved Claims) và yêu cầu công khai (Public Claims) Những yêu cầu này được thiết lập nhằm mục đích chia sẻ thông tin giữa hai bên đã có thỏa thuận và thống nhất trước đó.

Signature trong JWT là một chuỗi được mã hóa bởi header, payload cùng với một chuỗi bí mật theo nguyên tắc sau:

HMACSHA256(base64UrlEncode(header) + "." + base64UrlEncode(payload), secret)

Do bản thân Signature đã bao gồm cả header và payload nên Signature có thể dùng để kiểm tra tính toàn vẹn của dữ liệu khi truyền tải

Một trong những tình huống ứng dụng JWT thường gặp, đó là:

Xác thực là một tình huống phổ biến, khi người dùng đăng nhập, mỗi yêu cầu tiếp theo sẽ kèm theo chuỗi token JWT, cho phép truy cập vào các đường dẫn, dịch vụ và tài nguyên tương ứng với token đó Chức năng Single Sign On cũng sử dụng JWT một cách rộng rãi, nhờ vào kích thước nhỏ gọn của chuỗi JWT, giúp dễ dàng đính kèm trong yêu cầu và sử dụng trên nhiều hệ thống thuộc các miền khác nhau.

JSON Web Token (JWT) là phương pháp hiệu quả và an toàn để trao đổi thông tin giữa các ứng dụng, nhờ vào việc JWT được ký bằng cặp khóa công khai / riêng tư, giúp đảm bảo danh tính của người gửi Chữ ký của JWT được tính toán dựa trên nội dung của header và payload, cho phép xác thực rằng nội dung không bị chỉnh sửa Tuy nhiên, do cấu trúc đơn giản của JWT, nó có thể dễ dàng bị giải mã, vì vậy không nên sử dụng JWT để truyền tải thông tin nhạy cảm.

Tổng quan về MongoDB

MongoDB là một database hướng tài liệu (document), một dạng NoSQL database

MongoDB tránh cấu trúc bảng của cơ sở dữ liệu quan hệ để hỗ trợ tài liệu linh hoạt như JSON thông qua định dạng BSON Với việc lưu trữ dữ liệu dưới dạng tài liệu JSON, mỗi collection trong MongoDB có thể chứa các kích thước và tài liệu khác nhau Điều này giúp truy vấn dữ liệu diễn ra nhanh chóng và hiệu quả.

2.7.2 Một vài khái niệm cơ bản trong MongoDB

Cơ sở dữ liệu (Database) là nơi lưu trữ các Collection, tương tự như các bảng trong hệ thống quản lý cơ sở dữ liệu quan hệ (RDMS) Mỗi Database được lưu trữ trong một tập tin riêng biệt trên bộ nhớ vật lý Một máy chủ MongoDB có khả năng chứa nhiều Database khác nhau.

Collection là một nhóm dữ liệu cùng loại do người dùng xác định, khác với bảng (table) trong RDBMS, collection không có ràng buộc hay quan hệ với các collection khác Mỗi dữ liệu trong collection có thể có số trường không cố định, khác với các hàng (row) trong bảng.

Trong một Collection, mỗi bản ghi được gọi là một Document Các Document bao gồm các trường với tên và giá trị, tương tự như hàng trong bảng của RDBMS Tuy nhiên, dữ liệu trong Document rất linh hoạt, không bị giới hạn về số lượng trường và dữ liệu trong mỗi trường cũng không phải cố định.

Field Là một cặp name – value trong một document Một document có thể có không hoặc nhiều trường Các trường giống các cột ở cơ sở dữ liệu quan hệ

In RDBMS, tables can be joined, such as linking a person table with an address table to identify the addresses associated with each person In contrast, MongoDB stores this relationship by embedding an array of address documents directly within the person document.

Trường _id là một trường bắt buộc trong mỗi tài liệu MongoDB, đại diện cho giá trị duy nhất và hoạt động như khóa chính Khi bạn tạo một tài liệu mới, MongoDB sẽ tự động sinh ra một _id duy nhất cho tài liệu đó trong cơ sở dữ liệu.

❖ Dữ liệu lưu trữ phi cấu trúc, không có tính ràng buộc, toàn vẹn nên tính sẵn sàng cao, hiệu suất lớn và dễ dàng mở rộng lưu trữ

❖ Dữ liệu được caching (ghi đệm) lên RAM, hạn chế truy cập vào ổ cứng nên tốc độ đọc và ghi cao

❖ Không ứng dụng được cho các mô hình giao dịch nào có yêu cầu độ chính xác cao do không có ràng buộc

❖ Dữ liệu lấy RAM làm trọng tâm hoạt động vì vậy khi hoạt động yêu cầu một bộ nhớ RAM lớn

Mọi thay đổi đối với dữ liệu mặc định sẽ không được lưu trữ ngay lập tức trên ổ cứng, do đó, nguy cơ mất dữ liệu do sự cố mất điện đột ngột là rất cao.

3 Chương 3 - PHÂN TÍCH THIẾT KẾ HỆ THỐNG

Mô tả yêu cầu

Website bán sách được phát triển để hỗ trợ các nhà sách truyền thống tiếp cận khách hàng mua sắm online Ứng dụng này mang đến trải nghiệm mua sách tiện lợi và nhanh chóng cho người tiêu dùng, đồng thời giúp nhà sách quản lý hiệu quả các hoạt động kinh doanh trực tuyến Nhóm phát triển đã xác định một số chức năng chính để đáp ứng nhu cầu này.

Nhóm chức năng Chức năng Mô tả

Khách hàng Đăng kí tài khoản

Khách hàng có thể dễ dàng đăng ký tài khoản trên website bằng cách sử dụng email cá nhân Hệ thống sẽ tiếp nhận yêu cầu đăng ký và gửi email xác nhận đến khách hàng để hoàn tất quá trình Sau khi nhận được xác nhận, khách hàng có thể tiến hành đăng nhập để sử dụng các dịch vụ.

Sau khi khách hàng đăng ký và xác nhận email xác thực, họ có thể sử dụng tài khoản để đăng nhập và truy cập các dịch vụ mà website cung cấp.

Nếu khách hàng quên mật khẩu tài khoản, họ có thể gửi yêu cầu "quên mật khẩu" đến hệ thống Hệ thống sẽ tiếp nhận yêu cầu và gửi email xác nhận cho khách hàng Sau khi nhận được email xác nhận, người dùng có thể tạo mật khẩu mới cho tài khoản của mình.

Chỉnh sửa thông tin tài khoản

Khách hàng có thể chỉnh sửa thông tin cá nhận cũng như mật khẩu tài khoản của mình

Khách hàng có thể thêm sách muốn mua vào giỏ sách để thuận tiện cho các lần mua tiếp theo

Chức năng mua sách hỗ trợ cả hai đối tượng khách hàng đã có tài khoản và chưa có tài khoản

- Đối với các khách hàng đã có tài khoản: Yêu cầu mua sách sẽ được chuyển thẳng tới cho nhân viên quản lí

Hệ thống sẽ gửi email xác nhận đơn đặt hàng cho khách hàng chưa đăng ký tài khoản Sau khi khách hàng xác nhận email, đơn hàng sẽ được chuyển tới nhân viên quản lý.

Nhận xét Những khách hàng đã mua hàng thành công có thể để lại nhận xét cho sách mình đã mua

Quản lí sách Nhân viên quản lí có thể các thực hiện các chức năng thêm, sửa, xóa sách

Quản lí thể loại Nhân viên quản lí có thể các thực hiện các chức năng thêm, sửa, xóa thể loại

Quản lí tác giả Nhân viên quản lí có thể các thực hiện các chức năng thêm, sửa, xóa tác giả

Quản lí mã giảm Nhân viên quản lí có thể các thực hiện các

19 giá chức năng thêm, sửa, xóa các mã giảm giá

Nhân viên quản lí có thể thực hiện việc xem, chấp nhận, từ chối các yêu cầu mua sách hoặc cập nhật tình trạng các đơn hàng

Nếu đơn hàng đã thanh toán qua cổng PayPal bị từ chối bởi nhân viên quản lý, số tiền thanh toán sẽ được hoàn trả vào tài khoản PayPal của khách hàng.

Tiếp nhận yêu cầu đặt hàng từ các khách hàng chưa có tài khoản

Nhân viên quản lý có khả năng tra cứu, xem và xác thực các đơn đặt hàng từ khách hàng mới chưa đăng ký tài khoản trên hệ thống.

Hệ thống cung cấp các biểu đồ, số liệu trực quan giúp nhân viên quản lí dễ dàng nắm bắt được tình hình kinh doanh của nhà sách

Bảng 3-1 Mô tả yêu cầu chức năng của ứng dụng

3.1.2 Yêu cầu phi chức năng

Để đảm bảo tính bảo mật, hệ thống cần bảo vệ an toàn dữ liệu người dùng, ngăn chặn các tấn công từ bên ngoài và kiểm soát vận hành hiệu quả Việc giảm thiểu rủi ro và ngăn ngừa rò rỉ thông tin là rất quan trọng, thông qua các chức năng xác thực người dùng như đăng nhập, đăng ký và khôi phục mật khẩu.

- Tính tiện dụng: Phần mềm dễ sử dụng, tiện lợi trong việc mua sắm của sách hàng và quản lí của nhân viên

- Tính hiệu quả: Đảm bảo tốc độ xử lý ổn định, có thể lưu một lượng lớn dữ liệu, tránh xảy ra lỗi ngoại lệ

- Tính tương thích: Ứng dụng có thể chạy ổn định và tương thích với nhiều nền tảng hệ điều hành khác nhau

Kiến trúc hệ thống

3.2.1 Mô tả kiến trúc Front-End

- Frontend sử dụng thư viện React nên theo cấu trúc Flux

- Flux sử dụng cho việc xây dựng client-side web applications

- Flux bổ sung khả năng kết hợp các view components của React bằng việc sử dụng một unidirectional data flow(dữ liệu một chiều)

• View : là các React Component

• Store: là nơi chứa, xử lý dữ liệu cho App

• Action: là nơi khởi tạo action

• Dispatcher: là nơi phát action

- Sử dụng redux để lưu trữ global state

- Cấu trúc thư mục frontend:

Hình 3-1 Cấu trúc thư mục Frontend

- Các thư mục chính: component, pages, redux, config, utils

File App.js là nơi chưa các router, bọc toàn bộ trang web, mỗi router sẽ render ra 1 pages

Folder pages bao gồm các page là các file jsx

Hình 3-2 Cấu trúc thư mục Pages

Folder component bao gồm các component là các file jsx, được exports làm component cho các pages

Hình 3-3 Cấu trúc thư mục Component

Slice files serve as reducers and actions for managing and manipulating the global state in an application The request_api.js file is responsible for handling API calls, with all API requests defined within it Meanwhile, the store.js file connects the various slices (reducers) to the application, ensuring a cohesive state management system.

Hình 3-4 Cấu trúc thư mục Redux

- Folder config lưu trử path_name là các tên của đường dẫn router

- Folder utils lưu trữ các file thực hiện các function như định dạng ngày tháng, chuyển đổi tiếng việt sang tiếng anh

- Dự án sử dụng taiwinds để css

3.2.2 Mô tả kiến trúc Back-End

Back-End sử dụng công nghệ NodeJS xây dựng theo chuẩn RESTful API và được chia thành 3 thành phần chính như sau:

STT Thành phần Ý nghĩa, ghi chú

Là thành phần chủ yếu trong việc cung cấp dữ liệu và thực hiện kết nối, truy vấn cũng như thao tác với dữ liệu trong cơ sở dữ liệu, giúp tương tác hiệu quả với hệ quản trị cơ sở dữ liệu.

2 Controller Đảm nhiệm việc tiếp nhận các request từ các client, tiến hành xử lí và trả về kết quả cho client

3 Service Đảm nhiệm vai trò kết nối với các dịch vụ của bên thứ ba như các dịch vụ về cloudinary, các API,…

Bảng 3-2 Mô tả thành phần kiến trúc back-end

Mối quan hệ giữa các thành phần:

Controller tiếp nhận và điều hướng yêu cầu từ người dùng, giúp truy xuất dữ liệu chính xác dựa trên thông tin cần thiết Nhờ vào các nghiệp vụ của lớp Model, Controller hiển thị dữ liệu đó cho người dùng một cách hiệu quả.

- Service nhận yêu cầu sử dụng dịch vụ từ Controller và trả về kết quả để

- Model giúp cho Controllers có thể thực hiện kết nối, trích lọc, chèn, chỉnh sửa dữ liệu trong database, tương tác với file system, network

Hệ thống Back-End sử dụng JSON Web Token (JWT) để xác thực và cấp quyền cho từng yêu cầu từ Client, nhằm đảm bảo tính bảo mật và an toàn cho dữ liệu trong hệ thống.

Sơ đồ Use case

Hình 4-1 Sơ đồ use case

Tên chức năng Đăng ký

Tóm tắt Chức năng đăng ký sử dụng hệ thống

Dòng sự kiện chính 1 Người dùng nhấn vào “Đăng ký”

2 Hệ thống hiện thị from đăng ký của người dùng

3 Người dung điền thông tin đăng ký tài khoản

4 Người dùng chọn Đăng ký

5 Hệ thống kiểm tra thông tin và gửi email xác nhận về email đăng kí

Dòng sự kiện khác A1 Người dùng điền Email đã được sử dụng

1 Hiển thị thông báo email đã tồn tại cho người dùng

A2 Người dùng điền mật khẩu không hợp lệ

1 Hiển thị thông báo mật khẩu không hợp lệ

Các yêu cầu đặc biệt Email chưa được đăng kí

Trạng thái hệ thống trước khi thực hiện use case

Actor: Khách hàng Điều kiện: người dùng đã điền đầy đủ thông tin trên hệ thống, Email người dùng chưa được đăng kí

Trạng thái hệ thống sau khi thực hiện use case

Tài khoản được tạo và email xác thực được gửi đi Thông tin tài khoản được lưu vào hệ thống Điểm mở rộng Không có

Bảng 4-1 Mô tả use case đăng kí

Tên chức năng Xác thực đăng kí tài khoản

Người dùng kích hoạt tài khoản của mình thông qua email đăng ký bằng cách nhấn vào liên kết “Xác thực tài khoản” trong email xác thực.

2 Hệ thống kiểm tra và kích hoạt tài khoản

3 Chuyển về trang home Dòng sự kiện khác Không có

Các yêu cầu đặc biệt

Trạng thái hệ thống trước khi thực hiện use case

Actor: Khách hàng Điều kiện: Hệ thống đã gửi email tới địa chỉ email của khách hàng

Trạng thái hệ thống sau khi thực hiện use case

Tài khoản được kích hoạt thành công Điểm mở rộng Không có

Bảng 4-2 Mô tả use case xác thực tài khoản

Tên chức năng Đăng nhập

Tóm tắt Chức năng đăng nhập vào hệ thống

Dòng sự kiện chính 1 Hệ thống hiển thị form đăng nhập

2 Nhập email, mật khẩu và nhấn “Đăng nhập”

3 Hệ thống kiểm tra thông tin đăng nhập

4 Hệ thống hiển thị trang chính

Dòng sự kiện khác 2.1 Thông tin đăng nhập sai:

Hệ thống hiển thị thông báo tài khoản đăng nhập không hợp lệ Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Actor: tất cả các actor Điều kiện: không có Trạng thái hệ thống sau khi thực hiện use case

Người dùng đăng nhập thành công vào hệ thống, có thể sử dụng các quyền mà hệ thống cho phép Điểm mở rộng Không có

Bảng 4-3 Mô tả use case đăng nhập

Tên chức năng Quên mật khẩu

Tóm tắt Đặt lại mật khẩu cho tài khoản

Dòng sự kiện chính 1 Người dùng chọn “Quên mật khẩu”

2 Hệ thống hiển thị form đê người dùng nhập email của tài khoản đã đăng kí

3 Hệ thống gửi email chứa xác nhận quên mật khẩu vào địa chỉ email người dùng đã đăng kí và hiển thị form nhập mã xác nhận

4 Người dùng nhập mã xác nhận

5 Hệ thống kiểm tra mã xác nhận và hiển thị form tạo mới mật khẩu

6 Người dùng nhập mật khẩu mới

7 Hệ thống kiểm tra tính hợp lệ và cập nhật mật khẩu mới

Dòng sự kiện khác 2.1 Email không hợp lệ

Hệ thống thông báo email không hợp lệ 4.1 Mã xác nhận không hợp lệ

Hệ thống thông báo mã xác nhận không hợp lệ 6.1 Mật khẩu không hợp lệ

Hệ thống thông báo mật khẩu không hợp lệ Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Actor: tất cả các actor

Trạng thái hệ thống sau khi thực hiện use case

Mật khẩu tài khoản người dùng được thay đổi Điểm mở rộng Không có

Bảng 4-4 Mô tả use case quên mật khẩu

Tên chức năng Cập nhật mật khẩu

Tóm tắt Cập nhật mật khẩu tài khoản của người dùng

Dòng sự kiện chính 1 Người dùng nhấn vào phần thông tin tài khoản

2 Người dùng nhập tho mới và nhấp nút cập nhật

3 Hệ thống cập nhật lại mật khẩu tài khoản

Dòng sự kiện khác 2.1 Mật khẩu hiện tại không đúng

Hệ thống hiển thị thông báo sai mật khẩu

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Actor: khách hàng đã đăng kí tài khoản Điều kiện: người dùng đã đăng nhập hệ thống Trạng thái hệ thống sau khi thực hiện use case

Mật khẩu của người dùng được thay đổi Điểm mở rộng Không có

Bảng 4-5 Mô tả use case quên mật khẩu

4.1.6 Chỉnh sửa thông tin cá nhân

Tên chức năng Chỉnh sửa thông tin cá nhân

Tóm tắt Người dùng chỉnh sửa thông tin cá nhân của tài khoản

Dòng sự kiện chính 1 Người dùng nhấn vào phần thông tin tài khoản

2 Người dùng nhập thông tin cá nhân cần cập nhật và nhấn cập nhật

3 Hệ thống cập nhật lại thông tin cá nhân của tài khoản

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Actor: khách hàng đã đăng kí tài khoản Điều kiện: người dùng đã đăng nhập hệ thống Trạng thái hệ thống sau khi thực hiện use case

Thông tin cá nhân của người dùng được cập nhật Điểm mở rộng Không có

Bảng 4-6 Mô tả use case chỉnh sửa thông tin cá nhân

Tên chức năng Tìm kiếm sách

Tóm tắt Người dùng tìm kiếm sách

Dòng sự kiện chính 1 Người dùng nhập thông tin tìm kiếm và nhấn enter

2 Hệ thống hiển các sách phù hợp với từ khóa tìm kiếm

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Actor: Tất cả các actor Điều kiện: Không có Trạng thái hệ thống sau khi thực hiện use case

Không có Điểm mở rộng Không có

Bảng 4-7 Mô tả use case tìm kiếm sách

4.1.8 Thêm sách vào giỏ hàng

Tên chức năng Thêm sách vào giỏ hàng

Tóm tắt Người dùng thêm sách vào giỏ hàng của mình

Dòng sự kiện chính 1 Người dùng ở trang hiển thị danh sách sách và nhấn chọn biểu tượng giỏ hàng trên sách

2 Hệ thống thêm sách vào giỏ hàng và thông báo kết quả

Dòng sự kiện khác 1.1 Sách không có đủ số lượng

Hệ thống hiện thị thông báo không đủ số lượng Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Actor: Khách hàng Điều kiện: Không có Trạng thái hệ thống sau khi thực hiện use case

Không có Điểm mở rộng Không có

Bảng 4-8 Mô tả use case thêm sách vào giỏ hàng

Tên chức năng Mua hàng

Tóm tắt Người dùng mua sách

Dòng sự kiện chính 1 Người chọn các sách muốn mua trong trang giỏ hàng và chọn mua hàng

2 Hệ thống hiển thị trang xác nhận đơn hàng

3 Người dùng nhập thông tin vận chuyển, mã giảm giá và hình thức vận chuyển cho đơn hàng

4 Hệ thống tính toán phí vận chuyển, tiền được giảm và hiển thị cho người dùng

5 Người dùng nhấn chọn đặt hàng

6 Hệ thống kiểm tra, tiếp nhận đơn hàng và chuyển về trang home

Dòng sự kiện khác 3.1 Người dùng chọn thanh toán bằng paypal

Hệ thống chuyển đến trang thanh toán của paypal Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Actor: Khách hàng Điều kiện: Không có Trạng thái hệ thống sau khi thực hiện use case Đơn hàng được lưu vào hệ thống Điểm mở rộng Không có

Bảng 4-9 Mô tả use case mua hàng

Tên chức năng Xác thực đơn hàng

Người dùng chưa có tài khoản có thể xác nhận đơn hàng của mình qua email bằng cách chọn “Xác nhận đơn hàng” trong thông báo gửi đến.

2 Hệ thống kiểm tra thông tin, tình trạng đơn hàng và chuyển yêu cầu đến nhân viên

Dòng sự kiện khác A1 Đơn hàng đã được xác nhận

1 Thông báo đơn hàng đã được xác nhận cho người dùng Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Khách hàng có thể thực hiện đơn hàng khi chưa được xác nhận trước đó Sau khi thực hiện, trạng thái hệ thống sẽ được cập nhật và yêu cầu đặt hàng sẽ được chuyển cho nhân viên quản lý Không có điểm mở rộng nào trong quy trình này.

Bảng 4-10 Mô tả use case xác nhận đơn hàng

Tên chức năng Nhận xét đánh giá

Tóm tắt Người dùng đánh giá, nhận xét sách

Dòng sự kiện chính 1 Người dùng chọn mức đánh giá và nhập nội dung nhận xét trong trang chi tiết sách và chọn nhận xét

2 Hệ thống kiểm tra, thêm nhận xét và hiển thị nhận xét vừa được thêm

Các yêu cầu đặc biệt Khách hàng đã hoàn tất việc mua sách

Trạng thái hệ thống trước khi thực thiện use case

Actor: Khách hàng đã đăng kí tài khoản Điều kiện: Khách hàng đã đăng nhập vào hệ thống Trạng thái hệ thống sau khi thực hiện use case

Nhận xét được lưu vào hệ thống Điểm mở rộng Không có

Bảng 4-11 Mô tả use case đánh giá nhận xét

Tên chức năng Quản lí đơn hàng

Tóm tắt Người dùng xem các đơn hàng của mình

Dòng sự kiện chính 1 Người dùng chọn vào phần đơn hàng của bạn

2 Hệ thống hiển thị các đơn hàng của người dùng Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực thiện use case

Actor: Khách hàng đã đăng kí tài khoản Điều kiện: Khách hàng đã đăng nhập vào hệ thống Trạng thái hệ thống sau khi thực hiện use case

Không có Điểm mở rộng Không có

Bảng 4-12 Mô tả use case quản lí đơn hàng

Tên chức năng Thêm sách mới

Tóm tắt Thêm các thông tin sách như: Tên sách, tác giả, thể loại, số trang, giá tiền, nhà xuất bản, thời gian xuất bản,…

Dòng sự kiện chính 1 Vào trang quản lí sách và chọn thêm sách

2 Điền thông tin vào form và chọn “Thêm sách”

3 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

4 Hệ thống lưu dữ liệu và thông báo thành công

Dòng sự kiện khác 2.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Người dùng thêm thông tin thành công vào hệ thống Điểm mở rộng Không có

Bảng 4-13 Mô tả use case thêm sách mới

Tên chức năng Nhập sách

Tóm tắt Nhập thêm sách vào hệ thống

Dòng sự kiện chính 1 Vào trang quản lí sách và chọn nhập sách

2 Điền thông tin vào form và chọn “Nhập sách”

3 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

4 Hệ thống lưu dữ liệu phiếu nhập sách và cập nhật số lượng, giá của sách tương ứng với phiếu nhập

Dòng sự kiện khác 2.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Người dùng thêm thông tin thành công vào hệ thống Điểm mở rộng Không có

Bảng 4-14 Mô tả use case nhập sách

4.1.15 Chỉnh sửa thông tin sách

Tên chức năng Chỉnh sửa thông tin sách

Tóm tắt Chỉnh sửa các thông tin sách như: Tên sách, tác giả, thể loại, số trang, giá tiền, nhà xuất bản, thời gian xuất bản,…

Dòng sự kiện chính 1 Vào trang xem sách của phần quản lí sách chọn cập nhật ở sách muốn cập nhật

2 Hệ thống hiển thị form cập nhật sách

3 Điền thông tin muốn cập nhật vào form và chọn “Lưu”

4 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

5 Hệ thống lưu dữ liệu và thông báo thành công

Dòng sự kiện khác 4.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu thông tin sách được cập nhật Điểm mở rộng Không có

Bảng 4-15 Mô tả use case cập nhật sách

Tên chức năng Xóa sách

Tóm tắt Xóa thông tin sách, ẩn nó ra khỏi người dùng

Dòng sự kiện chính 1 Người dùng vào trang quản lí sách và chọn xem sách

2 Người dùng chọn button xóa tương ứng với sách muốn xóa

3 Hệ thống hiển thị thông báo xác nhận việc xóa sách

3 Người dùng xác nhận việc xóa sách

4 Hệ thống tiến hành xóa thông tin sách Dòng sự kiện khác

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Trạng thái của sách được cập nhật thành “Đã xóa” Điểm mở rộng Không có

Bảng 4-16 Mô tả use case xóa sách

Tên chức năng Thêm thể loại

Tóm tắt Thêm thông tin thể loại mới như: Tên thể loại, mô tả

Dòng sự kiện chính 1 Vào trang quản lí thể loại chọn nút Thêm thể loại (biểu tượng +)

2 Hệ thống hiển thị một dòng mới trong bảng thể loại để người dùng thêm mới

3 Người dùng điền thông tin thể loại mới và chọn Lưu

4 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

5 Hệ thống lưu dữ liệu và thông báo thành công

Dòng sự kiện khác 4.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu thể loại mới được thêm vào hệ thống Điểm mở rộng Không có

Bảng 4-17 Mô tả use case thêm thể loại

4.1.18 Chỉnh sửa thông tin thể loại

Tên chức năng Chỉnh sửa thể loại

Tóm tắt Chỉnh sửa thông tin thể loại như: Tên thể loại, mô tả

Dòng sự kiện chính 1 Vào trang quản lí thể loại chọn nút sửa ở thể loại muốn chỉnh sửa

2 Hệ thống hiển thị dòng chỉnh sửa để người dùng cập nhật

3 Người dùng điền thông tin cập nhật thể loại và chọn Lưu

4 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

5 Hệ thống lưu dữ liệu và thông báo thành công

Dòng sự kiện khác 4.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu thể loại được cập nhật vào hệ thống Điểm mở rộng Không có

Bảng 4-18 Mô tả use case chỉnh sửa thể loại

Tên chức năng Xóa mềm thể loại

Tóm tắt Xóa thông tin thể loại

Dòng sự kiện chính 1 Nhân viên vào trang quản lí thể loại, mở bảng thể loại và chọn xóa ở thể loại mình muốn xóa

2 Hệ thống hiển thị hộp thoại xác nhận

3 Người dùng xác nhận xóa

4 Hệ thống đổi trạng thái của thể loại

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Thể loại vừa xóa được chuyển sang trạng thái đã xóa Điểm mở rộng Không có

Bảng 4-19 Mô tả use case xóa mềm thể loại

4.1.19.2 Khôi phục thể loại đã xóa

Tên chức năng Xóa mềm thể loại

Tóm tắt Khôi phục thể loại đã bị “xóa mềm”

Dòng sự kiện chính 1 Nhân viên vào trang quản lí thể loại, mở bảng thùng rác và chọn khôi phục ở thể loại muốn khôi phục

2 Hệ thống khôi phục lại trạng thái ban đầu của thể loại

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Thể loại vừa xóa được chuyển sang trạng thái chưa xóa Điểm mở rộng Không có

Bảng 4-20 Mô tả use case khôi phục thể loại đã xóa

Tên chức năng Xóa cứng thể loại

Tóm tắt Xóa hoàn toàn thông tin thể loại ra khỏi hệ thống

Dòng sự kiện chính 1 Nhân viên vào trang quản lí thể loại, mở bảng thùng rác và chọn xóa ở thể loại mình muốn xóa

2 Hệ thống hiển thị hộp thoại xác nhận

3 Người dùng xác nhận xóa

4 Hệ thống xóa dữ liệu và thông báo thành công

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu thể loại được xóa hoàn toàn khỏi hệ thống Điểm mở rộng Không có

Bảng 4-21 Mô tả use case xóa cứng thể loại

Tên chức năng Thêm tác giả

Tóm tắt Thêm thông tin tác giả mới như: Ảnh, tên tác giả, ngày sinh, quê quán

Dòng sự kiện chính 1 Vào trang quản lí tác giả chọn nút Thêm tác giả (biểu tượng +)

2 Hệ thống hiển thị một dòng mới trong bảng tác giả để người dùng thêm mới

3 Người dùng điền thông tin tác giả và chọn Lưu

4 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

5 Hệ thống lưu dữ liệu và thông báo thành công

Dòng sự kiện khác 4.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu tác giả mới được thêm vào hệ thống Điểm mở rộng Không có

Bảng 4-22 Mô tả use case thêm tác giả

4.1.21 Chỉnh sửa thông tin tác giả

Tên chức năng Chỉnh sửa tác giả

Tóm tắt Chỉnh sửa thông tin tác giả như: Ảnh, tên tác giả, ngày sinh, quê quán

Dòng sự kiện chính 1 Vào trang quản lí tác giả chọn nút Chỉnh sửa ở tác giả muốn chỉnh sửa

2 Hệ thống hiển thị một dòng dòng chỉnh sửa để người dùng chỉnh sửa tác giả

3 Người dùng điền thông tin tác giả và chọn Lưu

4 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

5 Hệ thống lưu dữ liệu và thông báo thành công

Dòng sự kiện khác 4.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí

41 Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu tác giả được cập nhật vào hệ thống Điểm mở rộng Không có

Bảng 4-23 Mô tả use case chỉnh sửa thông tin tác giả

Tên chức năng Xóa mềm tác giả

Tóm tắt Xóa thông tin thể loại nhưng vẫn có thể khôi phục trở lại

Dòng sự kiện chính 5 Nhân viên vào trang quản lí tác giả, mở bảng tác giả và chọn xóa ở tác giả mình muốn xóa

1 Hệ thống hiển thị hộp thoại xác nhận

2 Người dùng xác nhận xóa

3 Hệ thống đổi trạng thái của tác giả

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Tác giả vừa xóa được chuyển sang trạng thái đã xóa Điểm mở rộng Không có

Bảng 4-24 Mô tả use case xóa mềm tác giả

4.1.22.2 Khôi phục thể loại đã xóa

Tên chức năng Xóa mềm thể loại

Tóm tắt Khôi phục thể loại đã bị “Xóa mềm”

Dòng sự kiện chính 3 Nhân viên vào trang quản lí tác giả, mở bảng thùng rác và chọn khôi phục ở tác giả muốn khôi phục

1 Hệ thống khôi phục lại trạng thái ban đầu của tác giả

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Tác giả vừa khôi phục được chuyển sang trạng thái chưa xóa Điểm mở rộng Không có

Bảng 4-25 Mô tả use case khôi phục tác giả đã xóa

Tên chức năng Xóa cứng tác giả

Tóm tắt Xóa hoàn toàn thông tin tác giả ra khỏi hệ thống

Dòng sự kiện chính 1 Vào trang quản lí thể loại, mở thùng rác và chọn xóa ở tác giả muốn xóa

2 Hệ thống hiển thị hộp thoại xác nhận

3 Người dùng xác nhận xóa

4 Hệ thống xóa dữ liệu và thông báo thành công

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu tác giả được xóa khỏi hệ thống Điểm mở rộng Không có

Bảng 4-26 Mô tả use case xóa cứng tác giả

Tên chức năng Thêm mã giảm giá

Tóm tắt Thêm thông tin mã giảm giá mới

Dòng sự kiện chính 1 Người dùng vào trang quản lí giảm giá chọn thêm mã giảm

2 Hệ thống hiển thị form thêm mã giảm mới

3 Người dùng điền thông tin tác giả và chọn Lưu

4 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

5 Hệ thống lưu dữ liệu và thông báo thành công

Dòng sự kiện khác 4.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu mã giảm mới được thêm vào hệ thống Điểm mở rộng Không có

Bảng 4-27 Mô tả use case thêm mã giảm giá

4.1.24 Chỉnh sửa thông tin mã giảm giá

Tên chức năng Chỉnh sửa mã giảm

Tóm tắt Chỉnh sửa thông tin mã giảm

Dòng sự kiện chính 1 Người dùng vào trang quản lí mã giảm chọn chỉnh sửa mã mà họ muốn cập nhật

2 Hệ thống hiển thị form cập nhật thông tin mã giảm

3 Người dùng điền thông tin mã giảm và chọn Lưu

4 Hệ thống kiểm tra thông tin, nếu các thông tin hợp lệ sẽ tiến hành bước tiếp theo

5 Hệ thống lưu dữ liệu và thông báo thành công

Dòng sự kiện khác 4.1 Thông tin không hợp lệ:

Hệ thống hiển thị thông báo lỗi và yêu cầu nhập lại thông tin

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu mã giảm được cập nhật vào hệ thống Điểm mở rộng Không có

Bảng 4-28 Mô tả use case chỉnh sửa thông tin mã giảm giá

4.1.25 Xóa thông tin mã giảm giá

Tên chức năng Xóa mã giảm

Tóm tắt Xóa thông tin mã giảm

Dòng sự kiện chính 5 Người dùng vào trang quản lí mã giảm chọn xóa ở mã giảm mà mình muốn xóa

6 Hệ thống hiển thị hộp thoại xác nhận

7 Người dùng xác nhận xóa

8 Hệ thống xóa dữ liệu và thông báo thành công

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Dữ liệu mã giảm được xóa khỏi hệ thống Điểm mở rộng Không có

Bảng 4-29 Mô tả use case xóa thông tin mã giảm giá

Tên chức năng Xác nhận đơn hàng

Tóm tắt Người quản lí có thể chấp nhận hoặc xác nhận hoàn thành các bước của đơn đặt hàng

Dòng sự kiện chính 1 Người dùng vào trang quản lí đơn hàng và chọn xác nhận (dấu ✔

2 Hệ thống hiển thị bảng chi tiết đơn hàng để người dùng xác nhận

3 Người dùng xác nhận việc chấp nhận

4 Hệ thống cập nhật trạng thái đơn hàng sang trạng thái tiếp theo

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Trạng thái đơn hàng được cập nhật Điểm mở rộng Không có

Bảng 4-30 Mô tả use case xác nhận đơn hàng

Tên chức năng Hủy đơn hàng

Tóm tắt Người quản lí có thể từ chối hoặc xác nhận việc không thể hoản thành đơn đặt hàng

Dòng sự kiện chính 1 Người dùng vào trang quản lí đơn hàng và chọn hủy (dấu )

2 Hệ thống hiển thị bảng chi tiết đơn hàng để người dùng xác nhận việc không thể hoàn thành đơn hàng

4 Hệ thống kiểm tra hình thức thanh toán của đơn hàng là COD và chuyển đến bước tiếp theo

5 Hệ thống cập nhật trạng thái đơn hàng và các thành phần liên quan

Dòng sự kiện khác 4.1 Hình thức thanh toán của đơn hàng là thanh toán qua paypal

Hệ thống tiến hành hoàn tiền cho khách hàng và chuyển đến bước tiếp theo

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Trạng thái đơn hàng và các thành phần liên quan được cập nhật Điểm mở rộng Không có

Bảng 4-31 Mô tả use case hủy đơn hàng

4.1.28 Xem chi tiết đơn đặt hàng

Tên chức năng Xem chi tiết đơn hàng

Tóm tắt Người quản lí có thể xem chi tiết đơn đặt hàng

Dòng sự kiện chính 1 Người dùng vào trang quản lí đơn hàng và chọn hủy (dấu )

2 Hệ thống hiển thị bảng chi tiết đơn hàng

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Không có Điểm mở rộng Không có

Bảng 4-32 Mô tả use case xem chi tiết đơn hàng

4.1.29 Xác thực đơn đặt hàng từ các khách hàng chưa đăng kí tài khoản

Tên chức năng Xác thực đơn hàng đơn hàng

Tóm tắt Người quản lí xác thực đơn đặt hàng từ các khách hàng chưa đăng kí tài khoản

Dòng sự kiện chính 1 Người dùng vào trang quản lí đơn hàng và chọn xác nhận (dấu ✔

2 Hệ thống hiển thị bảng chi tiết đơn hàng để người dùng xác nhận

3 Người dùng xác nhận việc chấp nhận

4 Hệ thống xác thực đơn đặt hàng và chuyển yêu cầu đặt hàng cho nhân viên quản lí

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Sau khi thực hiện use case Đơn đặt hàng, trạng thái hệ thống sẽ được cập nhật và yêu cầu sẽ được chuyển giao cho nhân viên quản lý Điểm mở rộng không có.

Bảng 4-33 Mô tả use case xác thưc đơn đặt hàng

Tên chức năng Báo cáo

Tóm tắt Người quản lí có thể xem các số liệu, biểu đồ báo cáo trực quan phục vụ cho việc kinh doanh của nhà sách

Dòng sự kiện chính 5 Người dùng vào trang dashboard

6 Hệ thống hiển thị số liệu và các biểu đồ

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống trước khi thực hiện use case

Actor: Nhân viên quản lí Điều kiện: Người dùng đã đăng nhập vào hệ thống và có quyền sử dụng chức năng này

Trạng thái hệ thống sau khi thực thiện use case

Không có Điểm mở rộng Không có

Bảng 4-34 Mô tả use case báo cáo

Thiết kế dữ liệu

Hệ thống sử dụng MongoDB để lưu trữ dữ liệu liên quan đến sách, thể loại, phiếu giảm giá và thông tin khách hàng Các dữ liệu khác như hình ảnh, địa chỉ, giá cước vận chuyển và tỉ giá hối đoái sẽ được lấy từ API của bên thứ ba và không được lưu trữ trong hệ thống.

Hình 4-2 Các đối tượng trong hệ thống

4.2.1 Danh sách các đối tượng trong hệ thống

STT Tên đối tượng Ý nghĩa, ghi chú

1 Account Lưu trữ dữ liệu người dùng

2 Book Lưu trữ dữ liệu sách

3 Author Lưu trữ dữ liệu về tác giả

4 Genre Lưu trữ dữ liệu về

5 Review Lưu trữ dữ liệu về các nhận xét, đánh giá của khách hàng

6 Order Lưu trữ thông tin liên quan đến các hóa đơn mua hàng

7 Voucher Lưu trữ dữ liệu về các mã giảm giá

8 GoodsReceived Lưu trữ dư liệu về các phiếu nhập sách

Bảng 4-35 Danh sách các đối tượng trong hệ thống

STT Tên thuộc tính Kiểu dữ liệu Ràng buộc Ý nghĩa, ghi chú

Unique id nhận biết người dùng

2 name String Tên người dùng

4 id_avatar String Id ảnh đại diện được lưu trên cloudinary

5 avatar_url String Url ảnh đại diện được lưu trên cloudinary

6 Library Array Danh sách các sách mà người dùng đã mua

7 Cart Array Danh sách các sách đã được người dùng đã thêm giỏ hàng

8 Review Array Danh sách các nhận xét của người dùng

9 Birthdate Date Ngày sinh của người dùng

10 Address Object Địa chỉ của người dùng

11 phoneNumber String Số điện thoại của người dùng

Unique Token phục vụ việc xác thực tài khoản và quên mật khẩu

13 isVerify Boolean Trang thái xác thực của tài khoản

Bảng 4-36 Mô tả dữ liệu người dùng

STT Tên thuộc tính Kiểu dữ liệu Ràng buộc Ý nghĩa, ghi chú

2 Name string Not Null Tên sách

Unique Tên rút gọn của sách

4 Genres Array Danh sách thể loại của sách

5 Author Array Danh sách tác giả của sách

6 Pages Number Not Null Số trang sách

7 publishedBy String Not Null Nhà xuất bản của sách

8 publishedDate Date Not Null Ngày xuất bản của sách

9 Amount Number Not Null Số lượng sách

10 Price Number Not Null Giá sách

11 Rating Number Mức độ đánh giá của khách hàng

12 Reviews Array Danh sách các nhận xét của sách

13 CoverID String Not Null ID ảnh bìa được lưu trên cloudinary

14 CoverUrl String Not Null url ảnh bìa được lưu trên cloudinary

15 HistoricalSold Number Số lượng sách đã bán

16 HistoricalReview Number Số lượng đánh giá của sách

17 Deleted Boolean Not Null Trạng thái xóa của sách

Bảng 4-37 Mô tả dữ liệu sách

STT Tên thuộc tính Kiểu dữ liệu Ràng buộc Ý nghĩa, ghi chú

2 Name string Not Null Tên thể loại

Tên rút gọn của thể loại

4 Books Array Danh sách sách của thể loại

5 Deleted Boolean Not Null Trạng thái xóa của thê loại

Bảng 4-38 Mô tả dữ liệu thể loại

STT Tên thuộc tính Kiểu dữ liệu Ràng buộc Ý nghĩa, ghi chú

Unique Id của tác giả

2 FullName string Not Null Tên tác giả

Unique Tên rút gọn của tác giả

4 BirthDate Date Not Null Ngày sinh của tác giả

5 AvatarId String Not Null Id ảnh tác giả lưu trên cloudinary

6 AvataUrl String Not Null Url ảnh tác giả lưu trên cloudinary

7 Address String Nơi sinh của tác giả

8 Books Array Danh sách sách của tác giả

9 Deleted Boolean Not Null Trạng thái xóa của tác giả

Bảng 4-39 Mô tả dữ liệu tác giả

STT Tên thuộc tính Kiểu dữ liệu Ràng buộc Ý nghĩa, ghi chú

Unique Id của đánh giá

2 Book ObjectId Not Null Id sách được đánh giá

3 Account ObjectId Not Null Id tài khoản đánh giá

4 Rating Number Not Null Số sao đánh giá

5 Content String Nội dung nhận xét

Bảng 4-40 Mô tả dữ liệu đánh giá

4.2.7 Dữ liệu mã giảm giá

STT Tên thuộc tính Kiểu dữ liệu Ràng buộc Ý nghĩa, ghi chú

Unique Id của đánh giá

2 StartTime Date Not Null Thời gian bắt đầu khuyến mãi

3 endTime Date Not Null Thời gian kết thúc khuyến mãi

5 discountCap Number Số tiền giảm tối đa

6 discountPecentage Number Phần tram giảm giá

7 minSpend Number Not Null Mức chi tiêu tối thiểu

8 Used Number Số lượng mã đã được sử dụng

9 Limit Number Số lượng mã tối đa

10 Description String Not Null Mô tả của mã giảm

Bảng 4-41 Mô tả giữ liệu mã giảm giá

STT Tên thuộc tính Kiểu dữ liệu Ràng buộc Ý nghĩa, ghi chú

Unique Id của đơn hàng

2 User ObjectId Not Null Id khách hàng

3 Customer String Not Null Tên khách hàng

4 Books Array Not Null Danh sách sách mua

5 Status Number Not Null Trạng thái đơn hàng

6 Payment Number Not Null Hình thức thanh toán

7 Paypal Object Thông tin liên quan đến thanh toán paypal

8 Paid Boolean Not Null Trạng thái thanh toán

9 Refund Boolean Not Null Trạng thái hoàn tiền

10 phoneNumber String Not Null Số điện thoại liên hệ

11 Address Object Not Null Địa chỉ giao hàng

12 subTotal Number Not Null Tổng tiền tạm tính

13 shippingCost Number Not Null Phí vận chuyển

14 Total Number Not Null Tổng tiền

15 Voucher Object Thông tin giảm giá của đơn hàng

Bảng 4-42 Mô tả dữ liệu đơn đặt hàng

4.2.9 Dữ liệu phiếu nhập sách

STT Tên thuộc tính Kiểu dữ liệu Ràng buộc Ý nghĩa, ghi chú

Unique Id của phiếu nhập sách

2 Book ObjectId Not Null ID sách nhập vào

3 Quantity Number Not Null Số lượng sách nhập vào

4 Price Number Not Null Giá sách nhập vào

5 Date Date Not Null Ngày nhập sách

Bảng 4-43 Mô tả dữ liệu đơn đặt hàng

Thiết kế giao diện

4.3.1 Giao diện của người dùng

Các trang của người dùng đều có:

Menu bên phải giúp người dùng dễ dàng truy cập các trang tìm kiếm sách, giỏ hàng, đơn hàng, trang cá nhân và các trang sách theo thể loại hoặc tác giả.

• Navbar trên cùng bao gồm:

- Breadcrumb: Người dùng biết mình đang ở đâu trong trang web và có thể di chuyển sang trang khác

- Ô tìm kiếm: Người dùng có thể tìm kiếm sách nhanh bằng cách nhập tên sách vào ô tìm kiếm

- Giỏ hàng: Người dùng click vào để vào giỏ hàng của mình

- Đăng nhập/ đăng kí: Nếu người dùng chưa đăng nhập thì sẽ hiện ra dangnhap/dangki để người dùng click vào để đăng nhập cũng như đăng

Để đăng nhập, người dùng cần sử dụng email thật để xác thực tài khoản, vì chúng tôi sẽ gửi email xác nhận Sau khi đăng nhập thành công, người dùng sẽ thấy avatar của mình và có thể nhấp vào đó để truy cập trang cá nhân, nơi có thể xem và thay đổi thông tin cá nhân.

Hình 4-3 Màn hình homepage cho user

Hình 4-4 Màn hình homepage cho user

Hình 4-5 Giao diện đăng kí

Giao diện đăng nhập của bookSto hiển thị danh sách tất cả sách có trong cửa hàng, bao gồm cả những cuốn sách được đánh giá cao nhất Tất cả người dùng, bao gồm cả những người không có tài khoản, người dùng đã đăng ký và quản trị viên, đều có quyền truy cập vào trang này.

- Người dùng có thể tìm kiếm nhanh những cuốn sách bằng sách nhập tên sách trên ô tìm kiếm

- Người dùng có thể xem những cuốn sách được đánh giá cao nhất, được yêu thích nhất

Người dùng có thể dễ dàng thêm sách vào giỏ hàng bằng cách di chuột lên bìa sách, nơi sẽ hiển thị nút "Thêm vào giỏ hàng" Ngoài ra, họ cũng có thể nhấp vào bìa sách để xem chi tiết thông tin về sách.

- Người dùng click vào đăngkí/đăngnhập để tạo tài khoản hoặc đăng nhập vào hệ thống

Trang thể loại của bookSto được thiết kế để giúp người dùng dễ dàng tìm kiếm và lọc sách theo tác giả, thể loại, tên sách hoặc kết hợp cả ba tiêu chí này.

- Hổ trợ tìm kiếm đa dạng

- Người dùng có thể đăng nhâp/đăng kí bằng cách click vào dangnhap/dangki bên trên

- Người dùng có thể thêm sách vào giỏ hàng, xem chi tiết sách bằng cách di chuột vào bìa sách

Hình 4-8 Trang chi tiết sách 1

Hình 4-9 Trang chi tiết sách 2

Hình 4-10 Trang chi tiết sách 3

Trang chi tiết sách cung cấp thông tin quan trọng như giá cả, ngày xuất bản, nhà xuất bản và nội dung sách Ngoài ra, trang này còn hiển thị các đánh giá từ những người dùng đã mua sách, giúp người đọc có cái nhìn tổng quan và đáng tin cậy hơn về sản phẩm.

- Người dùng có thể thêm vào giỏ hàng bằng cách click vào button thêm vào giỏ hàng

- Người dùng có thể đánh giá, chỉnh sửa đánh giá và xóa đánh giá của mình ở những sách mà họ đã mua

Hình 4-12 Trang đơn hàng Đây là trang đơn hàng mục đích để người dùng có thể theo dõi đơn hàng của mình sau khi mua

- Người dùng có thể lọc các đơn hàng của mình theo tình trạng như đã xác nhận, đã giao, đã nhận hàng,

- Người dùng click vào bìa sách để vào trang chi tiết sách, tham gia đánh giá sách nếu sách đã giao thành công cho người dùng

4.3.1.5 Trang thông tin cá nhân

Hình 4-13 Trang thông tin cá nhân

Hình 4-14 Trang khôi phục mật khẩu 1

Hình 4-15 Trang khôi phục mật khẩu 2 Đây là trang thông tin cá nhân mục đích để cho người dùng có thể thay đổi thông tin của họ

- Chỉnh sửa thông tin cá nhân như email, số điện thoại, tên, ngày sinh, avatar, địa chỉ, mật khẩu

- Có thể reset mật khẩu qua email

Trang giỏ hàng dùng để lưu sách mà người dùng chọn mua, người dùng đặt mua sách tại đây

- Người dùng có thể tăng, giảm số lượng sách hoặc xóa sách

- Người dùng có thể thay đổi thông tin địa chỉ cá nhân

- Sau khi chọn sách cần mua, có thể click vào nút mua hàng để đặt mua sách

Hình 4-17 Màn hình thanh toán 1

Hình 4-18 Màn hình thanh toán 2

Sau khi nhấn nút mua sách trên trang giỏ hàng, khách hàng sẽ được chuyển đến trang thanh toán, nơi họ có thể cập nhật thông tin cá nhân, địa chỉ giao hàng và nhập mã giảm giá Tại đây, khách hàng có thể chọn phương thức thanh toán online qua PayPal hoặc thanh toán khi nhận sách BookSto hỗ trợ cả khách hàng đã đăng nhập và chưa đăng nhập trong việc mua sách.

- Người dùng có thể thay đổi địa chỉ nhận hàng, số điện thoại, email thông qua nút thay đổi phía trên

- Khách hàng có thể chọn tiến hàng thanh toán qua paypal hoặc thanh toán khi nhận hàng

- Khách hàng có thể sử dung mã khuyến mãi của shop để được giảm chi phí

Các trang của admin đều có thanh menu bên trái, thuận tiện cho quá trình di chuyển qua trang khác

Trang dashboard cung cấp thống kê chi tiết về số lượng người dùng trong hệ thống, số lượng đầu sách, đơn đặt hàng và sách đã bán thành công Ngoài ra, trang còn hiển thị biểu đồ thống kê các sách bán chạy nhất và những sách được yêu thích nhất dựa trên đánh giá của khách hàng.

Trang thêm sách dùng để thêm mới 1 đầu sách vào kho sách

+ Thêm sách mới vào kho sách

Hình 4-23 Giao diện chỉnh sửa sách

Trang xem sách sẽ hiển thị ra tất cả sách theo dạng bảng, admin có thể xem thông tin sách và chỉnh sửa sách

Hình 4-25 Giao diện form nhập sách

Trang xem sách sẽ hiển thị ra tất cả phiếu nhập sách theo dạng bảng, admin có thể thêm phiếu nhập sách bằng cách nhấn vào nut “Nhập sách”

+ Tra cứu phiếu nhập sách

+ Tạo mới phiếu nhập sách

4.3.2.5 Trang quản lý thể loại

Hình 4-26 Trang quản lí thể loại

Mỗi cuốn sách thuộc một thể loại cụ thể, và trang quản lý thể loại sẽ thực hiện các thao tác như thêm, xóa và sửa đổi các thể loại đó.

+ Thêm, xóa, sửa các thể loại sách

4.3.2.6 Trang quản lý tác giả

Hình 4-27 Trang quản lí tác giả

Mỗi cuốn sách sẽ gắn liền với một tác giả cụ thể, và trang quản lý tác giả sẽ hỗ trợ các thao tác như thêm, xóa và sửa thông tin của tác giả.

+Thêm, sửa, xóa tác giả

4.3.2.7 Trang phê duyệt đơn hàng dành cho người dùng có đăng nhập khi đặt sách

Hình 4-28 Trang quản lí đơn hàng

Hình 4-29 Giao diện xem chi tiết đơn hàng

Giao diện xác nhận và từ chối đơn hàng cho phép admin phê duyệt các đơn hàng của người dùng đã đăng nhập Tại đây, admin có thể nhanh chóng tìm kiếm đơn hàng nhờ vào tính năng lọc đa dạng, bao gồm việc lọc theo tên đơn hàng, tên người dùng, ngày đặt hàng, tình trạng đơn hàng và phương thức thanh toán Điều này giúp kiểm soát hiệu quả các đơn hàng.

- Phê duyệt đơn hàng hoặc hủy đơn

- Tìm kiếm các đơn hàng

4.3.2.8 Trang phê duyệt đơn hàng dành cho người dùng không đăng nhập khi đặt sách

Hình 4-31 Trang xác thực đơn hàng của khách chưa đăng kí tài khoản

Hình 4-32 Giao diện chi tiết đơn hàng của khách hàng chưa đăng kí tài khoản

Giao diện xác thực đơn hàng cho khách hàng chưa đăng ký tài khoản cho phép admin dễ dàng phê duyệt và kiểm soát các đơn hàng Tại đây, admin có thể tìm kiếm đơn hàng nhanh chóng nhờ vào tính năng lọc đa dạng, bao gồm lọc theo tên đơn hàng, tên người dùng, ngày đặt hàng, tình trạng đơn hàng và phương thức thanh toán.

- Phê duyệt đơn hàng hoặc hủy đơn

- Tìm kiếm các đơn hàng

4.3.2.9 Trang quản lý mã khuyến mãi

Hình 4-34 Trang quản lí mã khuyến mãi

Hình 4-35 Giao diện thêm mới mã khuyến mãi

Hình 4-36 Giao diện chỉnh sửa thông tin mã khuyến mãi

Giao diện xóa mã giảm giá cho phép người dùng tạo mã khuyến mãi, giúp khách hàng tiết kiệm chi phí khi mua sách.

- Thêm, xóa, sửa mã khuyến mãi

Đánh giá

- Giảng viên hướng dẫn tận tình, hỗ trợ và định hướng nhóm nghiên cứu và thực hiện đề tài

Các tài liệu về ngôn ngữ và công nghệ hiện nay được chia sẻ rộng rãi trên Internet, tạo điều kiện thuận lợi cho người dùng Cộng đồng lớn này đóng vai trò quan trọng trong việc nhanh chóng giải quyết các vấn đề thường gặp khi sử dụng công nghệ.

- Vận dụng được các kiến thức, quy trình phát triển đã được học

- Dữ liệu API hỗ trợ đa dạng và phong phú

- Bước đầu tiếp cận công nghệ ReactJs, NodeJs, nên quá trình tìm hiểu, nghiên cứu và hiện thực mất nhiều thời gian

Vấn đề chính hiện nay là dữ liệu từ API không được cung cấp đầy đủ và chính xác, dẫn đến hạn chế trong quyền thao tác Điều này ảnh hưởng đến khả năng hỗ trợ các vấn đề của ứng dụng, khiến cho hiệu suất và trải nghiệm người dùng không đạt yêu cầu.

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

- Hoàn thành yêu cầu đặt ra ban đầu, đáp ứng được đầy đủ tính năng cần thiết của một ứng dụng website bán sách

- Tốc độ phản hồi các thao tác nhanh, tối ưu hóa trải nghiệm của người dùng

Sinh viên đã học cách tổ chức và xây dựng một hệ thống hoàn chỉnh, từ đó phát triển ứng dụng web đáp ứng nhu cầu của người dùng.

- Sinh viên nắm được các công nghệ phổ biến hiện nay như ReactJs, NodeJs, MongoDB và một số kỹ thuật xác thực người dùng

- Dữ liệu còn ít và chưa đầy đủ để đáp ứng nhu cầu người dùng

- Dữ liệu tổ chức chưa được tối ưu nên việc truy vấn còn chậm

- Chưa có phần hướng dẫn cho người mới sử dụng

Hướng phát triển

Xây dựng và mở rộng các chức năng như hỗ trợ gợi ý sản phẩm cho khách hàng, theo dõi vị trí đơn hàng, đăng nhập bằng tài khoản Google, Facebook, và tạo bộ sưu tập sách yêu thích sẽ nâng cao trải nghiệm người dùng và tăng cường sự tương tác trên nền tảng.

- Hoàn thiện hơn nữa các chức năng đã có

- Tối ưu hóa code để dễ cập nhật và mở rộng tính năng

- Tổ chức dữ liệu hợp lý hơn để tăng tốc độ truy xuất

[1] Tìm hiểu cơ bản về Node.js – Viblo.asia: https://viblo.asia/p/tim-hieu-co-ban-ve-nodejs-E375zeQ1lGW

[2] Tổng quan về NodeJS - Một số điểm khác biệt với PHP – Viblo.asia: https://viblo.asia/p/tong-quan-ve-nodejs-mot-so-diem-khac-biet-voi-php-

[3] Tìm hiểu về json web token (JWT) – Viblo.asia: https://viblo.asia/p/tim-hieu-ve-json-web-token-jwt-7rVRqp73v4bP

[4] Nodejs best practice - Cấu trúc tốt là components - Phần 1 – anonystick.com:

80 https://anonystick.com/blog-developer/nodejs-best-practice-cau-truc-tot-la- components-phan-1-2021060299169462

The article discusses how to effectively structure a project using Express and Node.js, emphasizing best practices for building scalable and maintainable applications It highlights the importance of organizing code into clear components, such as controllers, services, and models, to enhance collaboration and streamline development processes Additionally, the article underscores the significance of following conventions and utilizing tools that promote efficiency, ultimately guiding developers to create high-quality, robust applications.

[6] JWT là gì? Toàn tập về JWT từ cơ bản đến chi tiết – tino.org: https://wiki.tino.org/jwt-la-gi/

[7] Tổng quan về MongoDB - MongoDB là gì? - freetuts.net: https://freetuts.net/tong-quan-ve-mongodb-203.html

[8] Expressjs là gì? Tại sao nên sử dụng Expressjs trong lập trình? - itnavi.com.vn: https:///blog/expressjs-la-gi/?amp

[9] NodeJs & ExpressJs: https://www.youtube.com/watch?v=z2f7RHgvddc&list=PL_-

[9] Mongoose v6.3.5 - mongoosejs.com: https://mongoosejs.com/

[10] Documentation – Nodejs.org: https://nodejs.org/en/docs/

[11] Node.js SDK – Node.js Upload + Image, Video Transformations - cloudinary.com: https://cloudinary.com/documentation/node_integration

[11] React – A JavaScript library for building user interfaces – reactjs.org: https://reactjs.org/

[12] Node.js SDK – Node.js Upload + Image, Video Transformations - cloudinary.com: https://cloudinary.com/documentation/node_integration

[13] Ant Design - The world's second most popular React UI framework – ant.design: https://ant.design/

Ngày đăng: 16/06/2022, 20:35

Nguồn tham khảo

Tài liệu tham khảo Loại Chi tiết
[1] Tìm hiểu cơ bản về Node.js – Viblo.asia: https://viblo.asia/p/tim-hieu-co-ban-ve-nodejs-E375zeQ1lGW Link
[2] Tổng quan về NodeJS - Một số điểm khác biệt với PHP – Viblo.asia: https://viblo.asia/p/tong-quan-ve-nodejs-mot-so-diem-khac-biet-voi-php-1Je5E9945nL Link
[3] Tìm hiểu về json web token (JWT) – Viblo.asia: https://viblo.asia/p/tim-hieu-ve-json-web-token-jwt-7rVRqp73v4bP Link
[5] Express và Node.Js xây dựng cấu trúc một dự án chuẩn? – anonystick.com: https://anonystick.com/blog-developer/project-express-va-nodejs-co-kien-truc-tot-la-nhu-the-nao-2021040967257708 Link
[6] JWT là gì? Toàn tập về JWT từ cơ bản đến chi tiết – tino.org: https://wiki.tino.org/jwt-la-gi/ Link
[7] Tổng quan về MongoDB - MongoDB là gì? - freetuts.net: https://freetuts.net/tong-quan-ve-mongodb-203.html Link
[9] Mongoose v6.3.5 - mongoosejs.com: https://mongoosejs.com/ Link
[10] Documentation – Nodejs.org: https://nodejs.org/en/docs/ Link
[11] Node.js SDK – Node.js Upload + Image, Video Transformations - cloudinary.com:https://cloudinary.com/documentation/node_integration Link
[11] React – A JavaScript library for building user interfaces – reactjs.org: https://reactjs.org/ Link
[12] Node.js SDK – Node.js Upload + Image, Video Transformations - cloudinary.com:https://cloudinary.com/documentation/node_integration Link
[13] Ant Design - The world's second most popular React UI framework – ant.design:https://ant.design/ Link
[4] Nodejs best practice - Cấu trúc tốt là components - Phần 1 – anonystick.com Khác

HÌNH ẢNH LIÊN QUAN

Bảng 3-1  Mô tả yêu cầu chức năng của ứng dụng - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Bảng 3 1 Mô tả yêu cầu chức năng của ứng dụng (Trang 33)
Hình 3-2 Cấu trúc thư mục Pages - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 3 2 Cấu trúc thư mục Pages (Trang 35)
Hình 3-3 Cấu trúc thư mục Component - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 3 3 Cấu trúc thư mục Component (Trang 36)
Hình 3-4 Cấu trúc thư mục Redux - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 3 4 Cấu trúc thư mục Redux (Trang 37)
Hình 4-1 Sơ đồ use case - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 1 Sơ đồ use case (Trang 39)
Bảng 4-1 Mô tả use case đăng kí - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Bảng 4 1 Mô tả use case đăng kí (Trang 40)
Bảng 4-2 Mô tả use case xác thực tài khoản - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Bảng 4 2 Mô tả use case xác thực tài khoản (Trang 41)
Hình 4-2 Các đối tượng trong hệ thống - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 2 Các đối tượng trong hệ thống (Trang 63)
Hình 4-3 Màn hình homepage cho user - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 3 Màn hình homepage cho user (Trang 71)
Hình 4-5 Giao diện đăng kí - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 5 Giao diện đăng kí (Trang 72)
Hình 4-6 Giao diện đăng nhập - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 6 Giao diện đăng nhập (Trang 72)
Hình 4-7 Trang thể loại - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 7 Trang thể loại (Trang 73)
Hình 4-8 Trang chi tiết sách 1 - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 8 Trang chi tiết sách 1 (Trang 74)
Hình 4-10 Trang chi tiết sách 3 - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 10 Trang chi tiết sách 3 (Trang 75)
Hình 4-12 Trang đơn hàng - Xây dựng website bán sách điện tử (báo cáo cuối kì đồ án 1)
Hình 4 12 Trang đơn hàng (Trang 76)

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

w