TỔNG QUAN
Đặt vấn đề
Hiện nay, sự bùng nổ của công nghệ thông tin và thương mại điện tử đã nâng cao mức sống của con người, đưa đến những trải nghiệm hiện đại hơn Trong đó, nhu cầu mua sắm trực tuyến, đặc biệt là đặt đồ ăn và thức uống, ngày càng trở nên phổ biến.
Mô hình cho thuê văn phòng trong các cao ốc, nơi tập trung nhiều công ty, ngày càng trở nên phổ biến tại các thành phố lớn Những tòa nhà này thường có nhu cầu cao về dịch vụ ăn uống cho nhân viên, với một hoặc vài quán ăn ngay trong hoặc dưới tòa nhà Nhân viên thường phải xếp hàng để đặt đồ ăn và thức uống, nhưng phương thức này gặp phải một số bất tiện như tốn thời gian chờ đợi và không biết rõ tình trạng hàng hóa.
Nhóm đã phát triển một hệ thống cho phép người dùng dễ dàng chọn và đặt món ăn yêu thích, theo dõi đơn hàng theo thời gian thực Hệ thống cũng hỗ trợ chủ cửa hàng trong việc xử lý đơn hàng nhanh chóng và thuận tiện, đồng thời cho phép tạo và cài đặt thực đơn món ăn dễ dàng Đặc biệt, tính năng chia sẻ giỏ hàng giữa nhiều thiết bị là điểm nổi bật mà chưa có hệ thống nào khác hiện có cung cấp.
Sử dụng công nghệ tiên tiến như Golang, React và React Native, dịch vụ này hứa hẹn mang đến trải nghiệm người dùng tối ưu và tuyệt vời Nhóm phát triển tự tin rằng sản phẩm sẽ là bước đột phá trong lĩnh vực thương mại điện tử, nơi có nhiều cơ hội nhưng cũng đầy cạnh tranh Dịch vụ này nhằm phục vụ nhu cầu thực tiễn của xã hội, hướng đến nhóm khách hàng cụ thể và tiềm năng.
Mục tiêu và phạm vi đề tài
- Tìm hiểu mô hình pick up later
- Tìm hiểu về Golang và framework Gin-gonic
- Xây dựng ứng dụng tìm kiếm và đặt các món ăn trên nền tảng web
- Xây dựng hệ thống quản lý các món ăn, đơn hàng theo thời gian thực
- Có khả năng thực hiện các chương trình khuyến mãi, giảm giá trên các món ăn
- Khắc phục các hạn chế như: chờ đợi đơn hàng xử lý quá lâu, bom hàng, chủ động thời gian để nhận đơn hàng
- Công cụ để tìm kiếm những quán ăn mới trong khu vực lân cận theo một số tiêu chí đề ra
Sau khi nghiên cứu và tìm hiểu sơ bộ về nhu cầu sử dụng của người dùng, nhóm quyết định phạm vi thực hiện đề tài như sau:
- Phạm vi địa lý: Ứng dụng được sử dụng tại Thành phố Hồ Chí Minh
+ Quản lý các món ăn
+ Tìm kiếm các món ăn và đặt hàng (cá nhân hoặc theo nhóm)
+ Theo dõi tình trạng đơn hàng theo thời gian thực
+ Chống tình trạng bom hàng, quên nhận hàng.
Đối tượng sử dụng
- Các chủ cửa hàng bán thực phẩm, đồ ăn
- Sinh viên, nhân viên văn phòng có nhu cầu tìm kiếm các quán ăn trong khu vực lân cận
Phương thức thực hiện
- Xây dựng web server bằng Golang với framework Gin-gonic
- Xây dựng web client bằng ReactJS
- Database xây dựng bằng PostgreSQL.
Kết quả dự kiến
Hoàn thiện ứng dụng web giúp khách hàng dễ dàng lựa chọn món ăn yêu thích và theo dõi trạng thái đơn hàng của mình.
Xây dựng một trang quản lý trên nền tảng web giúp chủ cửa hàng dễ dàng thiết lập thực đơn, quản lý sản phẩm và theo dõi đơn hàng một cách hiệu quả.
- Công cụ tìm kiếm các quán ăn mới trong khu vực lân cận
TÌM HIỂU VỀ MÔ HÌNH PICK UP LATER
2.1 - Giới thiệu về mô hình Pickup Later
Hiện nay, các tòa nhà văn phòng ngày càng phổ biến với nhu cầu ăn uống cao của nhân viên Thông thường, các tòa nhà này có một vài quán ăn phục vụ nhu cầu này, nhưng việc xếp hàng để mua đồ ăn thường gây tốn thời gian và không đảm bảo thông tin về tình trạng món ăn Điều này dẫn đến tình trạng thời gian chết trong lúc chờ đợi.
Mô hình Pickup Later đã được phát triển nhằm cho phép khách hàng đặt hàng từ xa qua website hoặc ứng dụng di động, và sau đó tới quầy để nhận món khi cửa tiệm đã chuẩn bị xong.
2.2 - Sơ đồ mô hình Pickup Later
Hình 2.1: Sơ đồ mô hình Pickup later 1
1 Sơ đồ mô hình Pickup later nhóm triển khai
Người dùng có nhu cầu ăn uống có thể dễ dàng truy cập web app Pickup Later để chọn món ăn ngay trên điện thoại, thay vì phải đến cửa tiệm và xếp hàng thanh toán Ứng dụng cũng cung cấp thông tin về tình trạng còn hàng hoặc hết hàng của món ăn.
Bước 4: Người dùng chốt món (giỏ hàng) bằng cách đặt đơn trên web app Có thể lựa chọn hình thức thanh toán khi nhận hàng COD
Bước 5: Chủ cửa hàng sẽ nhận được đơn hàng ngay sau khi khách hàng đặt đơn (cập nhật danh sách đơn hàng thời gian thực)
Bước 6: Cửa hàng sẽ phản hồi đơn hàng này theo 1 trong 2 cách:
- Xác nhận đơn: tiếp tục thực hiện và hoàn thành đơn Sau bước này, đơn hàng sẽ không thể huỷ nữa
- Huỷ đơn: Không thực hiện đơn nữa và báo cho khách hàng biết Cửa hàng phải nêu rõ lý do huỷ đơn
Bước 7: Sau khi đã xác nhận đơn hàng, cửa hàng sẽ tiến hành chuẩn bị món cho đơn
Sau khi đơn hàng được chuẩn bị xong, cửa hàng sẽ đánh dấu đơn hàng là sẵn sàng giao và gửi thông báo qua tin nhắn SMS đến số điện thoại đã đăng ký của khách hàng để khách xuống lấy.
Bước 9: Khách hàng tới quầy thanh toán (nếu chọn hình thức thanh toán là COD) và nhận món Đơn hàng hoàn tất
2.4 - Ưu điểm của mô hình
● Tiết kiệm thời gian ở công đoạn chờ chuẩn bị món Khách hàng có thể tiếp tục công việc của mình trong lúc chờ cửa hàng chuẩn bị đơn hàng
Khách hàng sẽ không cần xếp hàng để đặt món tại cửa tiệm, mà có thể nhận ngay món ăn vì đã được chuẩn bị sẵn.
● Loại bỏ được tình trạng xuống tận nơi mới biết là món đã hết (out of stock)
Khách hàng hiện nay có nhiều sự lựa chọn hơn và cảm thấy thuận tiện hơn khi có thể lướt thực đơn trực tuyến, giúp họ dễ dàng chọn món ăn yêu thích mà không cần phải đến cửa tiệm.
CÁC CÔNG NGHỆ ÁP DỤNG
Go và Gin Framework
Go, hay còn gọi là Golang, là ngôn ngữ lập trình mã nguồn mở được phát triển bởi Google bởi các nhà sáng lập Robert Griesemer, Rob Pike và Ken Thompson Ngôn ngữ này cho phép lập trình viên xây dựng phần mềm một cách đơn giản, đáng tin cậy và hiệu quả.
- Go có cú pháp giống với C và là ngôn ngữ lập trình biên dịch (compiled programming language)
Hình 3.1: Giới thiệu về Go 2
Go ra mắt phiên bản đầu tiên vào ngày 10 tháng 11 năm 2009, với thiết kế và phát triển chú trọng đến khả năng xử lý đa luồng Ngôn ngữ lập trình Go cung cấp hai tính năng hỗ trợ concurrency mạnh mẽ là goroutine và channel.
Goroutines utilize growable segmented stacks, allowing them to expand their memory usage as needed This feature ensures efficient use of RAM, adapting to the demands of the program.
+ Goroutines có thời gian khởi động nhanh hơn là threads
Goroutines sử dụng các kênh (channel) để giao tiếp với nhau, cho phép truyền dữ liệu một cách hiệu quả Để đảm bảo an toàn khi truy cập vào các cấu trúc dữ liệu hoặc biến chung, goroutines áp dụng khóa mutex (mutex locking), giúp ngăn chặn xung đột giữa các thao tác đọc và ghi.
- Go giao tiếp trực tiếp với vi xử lý bằng mã nhị phân (binaries)
Hình 3.2: Biên dịch và thông dịch 3 Một số đặc điểm nổi bật của Golang:
● Go là ngôn ngữ lập trình biên soạn (compiled language) Phần mềm viết bởi Go cần được biên soạn sử dụng Go compile trước khi có thể chạy được
● Go có cú pháp tương tự như C
● Go là một ngôn ngữ lập trình kiểu tĩnh (hay static type), các biến hoặc dữ liệu trong Golang sẽ không thay đổi trong suốt chương trình
● Golang hỗ trợ xử lý đa luồng multi-threading
● Golang hỗ trợ tính năng quản lý bộ nhớ mạnh mẽ
● Golang sở hữu một bộ thư viện phong phú mà lập trình viên có thể tận dụng
● Golang nhỏ gọn và đơn giản
● Go hỗ trợ phát triển ứng dụng nhanh
● Khả năng mở rộng dễ dàng
● Mã nguồn mở, các công cụ có sẵn miễn phí
3 https://topdev.vn/blog/golang-la-gi-va-tai-sao-ban-nen-hoc-go
Gin là một framework web được phát triển bằng ngôn ngữ Go (Golang), nổi bật với tính năng tối giản khi chỉ bao gồm các thư viện và chức năng cần thiết Điều này giúp Gin Gonic trở thành lựa chọn lý tưởng cho việc phát triển các API REST có hiệu suất cao.
Gin Gonic cho phép thêm middlewares và xác thực JSON mà vẫn giữ được hiệu suất tối ưu Nó sử dụng httprouter, bộ định tuyến HTTP nhanh nhất cho Go.
Một số đặc điểm quan trọng mà Go rất đáng để nghiên cứu và sử dụng đó là:
Go là một ngôn ngữ lập trình tiện lợi, được so sánh với các ngôn ngữ kịch bản nhờ khả năng đáp ứng nhiều nhu cầu lập trình phổ biến Ngôn ngữ này tích hợp nhiều tính năng hữu ích, bao gồm khả năng quản lý bộ nhớ tự động và garbage collection (dọn file rác), giúp lập trình viên tối ưu hóa hiệu suất ứng dụng.
Ngôn ngữ Go là một ngôn ngữ biên lập trình biên dịch, nổi bật với khả năng biên dịch trực tiếp ra mã máy thay vì bytecode như Java Điều này cho phép Go chạy ngay trên hệ điều hành mà không cần cài đặt thêm phần mềm Sau khi biên dịch, ứng dụng Go có thể hoạt động trên nhiều hệ điều hành khác nhau như Windows, Mac OS và Linux mà không gặp trở ngại.
1 file duy nhất, copy đến hệ điều hành đích là chạy, rất đơn giản
Go là một ngôn ngữ lập trình biên dịch, cho phép chuyển đổi mã nguồn thành mã máy dưới dạng các bit nhị phân, nhờ đó mang lại hiệu suất xử lý nhanh chóng và hiệu quả.
- Concurrency và goroutine: Concurrency là tính năng chủ lực của ngôn ngữ lập trình
Go tối ưu hóa khả năng xử lý của CPU bằng cách cho phép chạy concurrency mà không cần phụ thuộc vào việc cấp phát tài nguyên của hệ điều hành, điều này khác biệt so với các ngôn ngữ lập trình khác.
Khi sử dụng bộ vi xử lý đa nhân, goroutines có thể thay thế hoàn toàn cho các luồng Mỗi goroutine chỉ tiêu tốn khoảng 2KB bộ nhớ từ heap, so với khoảng 1MB của Java, cho phép bạn tạo ra hàng triệu goroutines một cách dễ dàng.
3.1.4 Áp dụng vào đề tài
Nhóm quyết định sử dụng Go để xây dựng server cho ứng dụng, nhằm tạo ra các phương thức hiệu quả trong việc nhận và gửi kết quả đến client.
Ngôn ngữ lập trình Go kết hợp với Gin-gonic cung cấp tốc độ xử lý nhanh chóng, cho phép thực hiện nhiều yêu cầu đồng thời và dễ dàng sử dụng Thêm vào đó, Go sở hữu một thư viện phong phú và cộng đồng hỗ trợ mạnh mẽ, giúp người dùng dễ dàng tìm kiếm giải pháp và tài nguyên.
PostgreSQL
PostgreSQL is an advanced open-source object-relational database management system, developed by the PostgreSQL Global Development Group and first released on July 8, 1996.
PostgreSQL được phát triển để hoạt động trên các hệ điều hành tương tự UNIX, nhưng cũng đã được tối ưu hóa để hỗ trợ nhiều nền tảng khác như Mac OS X, Solaris và Windows.
PostgreSQL là phần mềm mã nguồn mở miễn phí, cho phép người dùng tự do sử dụng, sửa đổi và phân phối theo giấy phép PostgreSQL.
PostgreSQL nổi bật với tính ổn định cao, giúp giảm thiểu công tác bảo trì Điều này mang lại lợi ích cho các ứng dụng phát triển trên nền tảng này, khiến chi phí sở hữu thấp hơn so với các hệ thống quản trị dữ liệu khác.
PostgreSQL được xây dựng theo chuẩn SQL99 và có nhiều đặc điểm hiện đại:
● Câu truy vấn phức hợp (complex query)
● Thủ tục sự kiện (trigger)
● Tính toàn vẹn của các giao dịch (integrity transactions)
● Việc kiểm tra truy cập đồng thời đa phiên bản (multiversion concurrency control)
Hình 3.6: Các hệ quản trị cơ sở dữ liệu phổ biến hiện nay 4
- PostgreSQL cung cấp cho người dùng nhiều tính năng hiện đại, khả năng ổn định cao, tốc độ nhanh
- Bảo mật dữ liệu, an toàn
- Toàn vẹn dữ liệu: Ràng buộc loại từ, Primary Keys, Foreign Keys, UNIQUE, NOT NULL, Khóa khuyến nghị/ Advisory Locks, Khóa hàm số/ Explicit Locks,…
- Kiểu dữ liệu đa dạng: nguyên hàm (các nguyên số, boolean, số, chuỗi), cấu trúc (UUID, Phạm vi, Array, Datetime, JSON)
- Mã nguồn mở và miễn phí
- Phù hợp với Golang để xử lý dữ liệu thông qua thư viện GORM
GORM là thư viện ORM xuất sắc cho Golang, giúp xử lý quan hệ cơ sở dữ liệu hiệu quả Thư viện này được xây dựng trên các package cơ sở dữ liệu/SQL và sở hữu nhiều tính năng nổi bật.
4 https://www.enterprisedb.com/blog/get-your-postgresql-12-now
- Associations (has one, has many, belongs to, many too many, polymorphism)
- Callbacks (Before/After Create/Save/Update/Delete/Find)
3.2.3 Áp dụng vào đề tài
Nhờ vào các tính năng vượt trội của PostgreSQL, nhóm đã tích hợp hệ thống này vào ứng dụng với các bảng tương ứng với các mô hình quản lý chức năng Việc kết nối PostgreSQL với server Golang được thực hiện thông qua thư viện GORM Ứng dụng sử dụng PostgreSQL để lưu trữ dữ liệu, và dữ liệu được trả về cho người dùng dưới định dạng JSON từ hệ quản trị cơ sở dữ liệu PostgreSQL.
React
React (hay ReactJS) là một thư viện JavaScript nổi bật trong xu hướng phát triển ứng dụng đơn trang (Single Page Application - SPA) những năm gần đây Khác với các framework khác tập trung vào mô hình MVC phức tạp, React thu hút người dùng nhờ vào 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 do Facebook phát triển, 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à có thể tái sử dụng Thư viện này được Facebook áp dụng trong môi trường sản xuất, và Instagram cũng được phát triển hoàn toàn dựa trên React.
React so sánh sự khác biệt giữa các giá trị của lần render hiện tại và lần render trước đó, từ đó chỉ cập nhật những thay đổi tối thiểu trên DOM Trước khi tiến hành cài đặt và cấu hình, chúng ta cần tìm hiểu một số khái niệm cơ bản.
Công nghệ DOM ảo nâng cao hiệu năng ứng dụng bằng cách chỉ thay đổi node gốc khi có sự thay đổi, dẫn đến việc tái cấu trúc toàn bộ DOM tree React áp dụng DOM ảo, một đối tượng JavaScript chứa thông tin cần thiết để tạo DOM, giúp tính toán sự khác biệt giữa object và DOM thật khi dữ liệu thay đổi Nhờ đó, trang web không cần tải lại hoàn toàn mà chỉ cập nhật các phần cần thiết, cải thiện tốc độ xử lý.
Để cải thiện tốc độ hoạt động của trang web, cần thay đổi 11 phần quan trọng, giúp giảm thiểu việc server phải truy vấn lại dữ liệu từ các thành phần khác.
Hình 3.7: Cơ chế cập nhật DOM của React 5
JSX, viết tắt của JavaScript XML, là một ngôn ngữ cho phép viết mã HTML trong JavaScript, giúp lập trình viên sử dụng cú pháp XML để phát triển ứng dụng React thay vì chỉ dùng JavaScript.
5 https://techmaster.vn/posts/34344/react-dom-ao
Trong React, dữ liệu được truyền theo một chiều từ component cha xuống component con thông qua props, một khái niệm quan trọng sẽ được giải thích sau.
Data binding trong React giúp trang web hoạt động một cách khoa học, dễ dàng bảo trì và nâng cấp tính năng Nhờ đặc điểm này, React hỗ trợ hiệu quả trong việc xây dựng các trang web có lượng người dùng và dữ liệu lớn.
React được xây dựng dựa trên các component thay vì sử dụng rendering template như các framework khác Người dùng có thể tạo ra các trang web bằng cách sử dụng các thành phần nhỏ, có thể tái sử dụng ở nhiều vị trí với các trạng thái và thuộc tính khác nhau Mỗi component trong React có trạng thái riêng, có thể thay đổi, và React tự động cập nhật component khi có sự thay đổi Tất cả mọi thứ trong React đều là component, giúp dễ dàng bảo trì mã code trong các dự án lớn Một component đơn giản chỉ cần một phương thức render, mặc dù còn nhiều phương thức khác nhưng render là phương thức chủ đạo.
Props là một yếu tố quan trọng giúp các component trong ứng dụng tương tác với nhau Chúng cho phép component nhận đầu vào và trả về các thuộc tính mô tả nội dung mà component con sẽ hiển thị Đặc biệt, props là bất biến, nghĩa là chúng không thay đổi trong quá trình hoạt động của component.
- State: thể hiện trạng thái của ứng dụng, khi state thay đổi thì component đồng thời render lại để cập nhật UI
6 https://viblo.asia/p/gioi-thieu-ve-reactjs-phan-i-cac-khai-niem-co-ban-V3m5WzjblO7
3.3.8 - Áp dụng vào đề tài
Nhóm yêu cầu web app đặt hàng phải là một SPA (Single Page Application) với tốc độ nhanh và phản hồi tốt Ứng dụng cần được chia thành nhiều thành phần (component) con, đảm bảo khả năng tái sử dụng và tùy biến cao.
Nhóm đã quyết định sử dụng thư viện React để xây dựng giao diện người dùng cho ứng dụng đặt món, nhờ vào những ưu điểm nổi bật của nó, phù hợp với các yêu cầu mà nhóm đề ra.
MQTT
3.4.1 - Giới thiệu về Message Queue
Message queue là một hệ thống hộp thư cho phép các thành phần hoặc dịch vụ trong một hoặc nhiều hệ thống gửi thông tin cho nhau Nó hoạt động theo cơ chế FIFO (First In First Out), tức là thông điệp được xử lý theo thứ tự vào trước ra trước Hệ thống sử dụng Message Queue thường bao gồm các thành phần quan trọng để đảm bảo việc truyền tải thông tin hiệu quả.
- Message: Thông tin được gửi đi (có thể là text, binary hoặc JSON)
- Message Queue: Nơi chứa những message này, cho phép producer và consumer có thể trao đổi với nhau
- Producer (hay Publisher): Chương trình/service tạo ra thông tin, đưa thông tin vào message queue
- Consumer: Chương trình/service nhận message từ message queue và xử lý
Một chương trình/service có thể vừa là producer, vừa là consumer
Hình 3.10: Các thành phần trong MQTT 7
3.4.2 - Giới thiệu về MQTT - Message Queuing Telemetry Transport
MQTT (Message Queuing Telemetry Transport) là giao thức truyền thông theo mô hình publish/subscribe, lý tưởng cho các thiết bị IoT với băng thông thấp và độ tin cậy cao Giao thức này hoạt động trên nền tảng một Broker nhẹ, dễ cài đặt và không đặc trưng cho ứng dụng cụ thể nào, giúp hoạt động hiệu quả trong các mạng lưới không ổn định.
7 https://toidicodedao.com/2019/10/08/message-queue-la-gi-ung-dung-microservice/
- Những nơi mà giá mạng viễn thông đắt đỏ hoặc băng thông thấp hay thiếu tin cậy
- Khi chạy trên thiết bị nhúng bị giới hạn về tài nguyên tốc độ và bộ nhớ
Giao thức MQTT là lựa chọn lý tưởng cho các ứng dụng M2M (Machine to Machine) nhờ khả năng sử dụng băng thông thấp trong môi trường có độ trễ cao Ngoài ra, MQTT cũng được áp dụng trong các ứng dụng nhắn tin như Facebook Messenger.
3.4.3 - Vị trí của MQTT trong mô hình IoT
MQTT có nhiều ưu điểm nổi bật như băng thông thấp, độ tin cậy cao và khả năng hoạt động hiệu quả trong môi trường mạng không ổn định Giao thức này tốn rất ít byte để kết nối với server và duy trì trạng thái kết nối mở liên tục Nó cho phép nhiều thiết bị (MQTT client) kết nối thông qua một MQTT server (broker) Với khả năng sử dụng băng thông thấp trong điều kiện có độ trễ cao, MQTT trở thành lựa chọn lý tưởng cho các ứng dụng IoT.
Hình 3.11: Vị trí của MQTT trong hệ thống IoT 8
3.4.4 - Tính năng và đặc điểm nổi bật
- Dạng truyền thông điệp theo mô hình Pub/Sub cung cấp việc truyền tin phân tán một chiều, tách biệt với phần ứng dụng
- Việc truyền thông điệp là ngay lập tức, không quan tâm đến nội dung được truyền
- Sử dụng TCP/IP là giao thức nền
- Tồn tại ba mức độ tin cậy cho việc truyền dữ liệu (QoS: Quality of service)
+ QoS 0: Broker/Client sẽ gửi dữ liệu đúng một lần, quá trình gửi được xác nhận bởi chỉ giao thức TCP/IP
QoS 1 trong giao thức MQTT yêu cầu Broker/Client gửi dữ liệu với ít nhất một lần xác nhận từ phía bên nhận, điều này có nghĩa là có thể nhận được nhiều hơn một lần xác nhận cho cùng một dữ liệu.
+ QoS 2: Broker/Client đảm bảo khi gửi dữ liệu thì phía nhận chỉ nhận được đúng một lần, quá trình này phải trải qua 4 bước bắt tay
8 https://viblo.asia/p/mqtt-la-gi-vai-tro-cua-mqtt-trong-iot-V3m5WL3bKO7
- Phần bao bọc dữ liệu truyền nhỏ và được giảm đến mức tối thiểu để giảm tải cho đường truyền
MQTT với những tính năng và đặc điểm nổi bật, mang lại nhiều lợi ích cho hệ thống SCADA (Supervisory Control And Data Acquisition) trong việc truy cập dữ liệu IoT.
- Truyền thông tin hiệu quả hơn
- Tăng khả năng mở rộng
- Giảm đáng kể tiêu thụ băng thông mạng
- Rất phù hợp cho điều khiển và do thám
- Tối đa hóa băng thông có sẵn
- Rất an toàn, bảo mật
- Được sử dụng trong các công ty lớn như Amazon, Facebook,
- Tiết kiệm thời gian phát triển
- Giao thức publish/subscribe thu thập nhiều dữ liệu hơn và tốn ít băng thông hơn so với giao thức cũ
+ Publisher - Nơi gửi thông điệp
+ Subscriber - Nơi nhận thông điệp
- Broker - Máy chủ môi giới
Broker là trung tâm kết nối giữa Client (Publisher/Subscriber), có nhiệm vụ chính là nhận và chuyển tiếp thông điệp từ Publisher đến địa điểm cụ thể Ngoài ra, Broker còn đảm nhận các tính năng phụ như bảo mật thông điệp, lưu trữ và ghi lại nhật ký (logs) trong quá trình truyền thông.
Client được phân thành hai nhóm: Publisher và Subscriber Publisher có nhiệm vụ phát hành thông điệp lên một hoặc nhiều chủ đề cụ thể, trong khi Subscriber đăng ký theo dõi một hoặc nhiều chủ đề để nhận thông điệp từ các chủ đề đó.
+ MQTT Clients tương thích với hầu hết các nền tảng hệ điều hành hiện có: MAC
OS, Windows, Linux, Android, iOS,
Hình 3.12: Mô hình publish và subcribe qua broker trong MQTT 9
3.4.6.2 - Cơ chế hoạt động của MQTT theo mô hình Pub/Sub
MQTT là một giao thức hoạt động theo mô hình client/server, trong đó mỗi cảm biến được xem như một khách hàng (client) kết nối tới một máy chủ, hay còn gọi là máy chủ môi giới (broker), thông qua giao thức TCP (Transmission Control Protocol) Vai trò của broker là điều phối và chuyển tiếp tất cả các thông điệp từ phía gửi đến đúng phía nhận.
MQTT là giao thức truyền thông dựa trên bản tin, trong đó mỗi bản tin là một tín hiệu riêng biệt mà broker không thể nhìn thấy Mỗi bản tin được phát hành trên một địa chỉ cụ thể, được gọi là kênh (Topic) Các client có thể đăng ký (subscribe) vào nhiều kênh để nhận và gửi dữ liệu Khi một client gửi bản tin đến một kênh, hành động này được gọi là publish Client sẽ nhận dữ liệu khi bất kỳ trạm nào khác gửi thông tin vào kênh mà họ đã đăng ký.
3.4.7 - Áp dụng vào đề tài
Nhóm đã quyết định sử dụng công nghệ MQTT để truyền tải thông tin giữa ba thành phần trong hệ thống, bao gồm web app đặt món cho khách hàng (subscriber), server (publisher/subscriber) và mobile app xử lý đơn hàng (subscriber), nhờ vào những ưu điểm như gọn nhẹ, tiết kiệm băng thông, chi phí thấp và thời gian phát triển ngắn.
JWT
JSON Web Token (JWT) là một tiêu chuẩn mở (RFC 7519) cho phép truyền tải thông tin an toàn giữa các bên thông qua một đối tượng JSON Thông tin trong JWT có thể được xác thực và đảm bảo tính tin cậy nhờ vào phần "chữ ký" của nó.
17 sẽ được mã hóa lại bằng HMAC hoặc RSA Trong đó chuỗi Token phải có 3 phần là header , phần payload và phần signature được ngăn bằng dấu “.”
- Phần header sẽ chứa kiểu dữ liệu, và thuật toán sử dụng để mã hóa ra chuỗi JWT
- Phần payload sẽ chứa các thông tin mình muốn đặt trong chuỗi Token như id, username, exp (expired time) … ví dụ:
The Signature section is generated by encoding the header and payload along with a secret key using a specific encryption algorithm For example, the process can be described as: data = base64urlEncode(header) + "." + base64urlEncode(payload), followed by signature = Hash(data, secret).
- Kết hợp 3 chuỗi trên lại ta sẽ có được một chuỗi JWT hoàn chỉnh
3.5.2 Khi nào nên dùng JSON Web Token?
Xác thực là một ứng dụng phổ biến của JWT, cho phép người dùng đã đăng nhập gửi các yêu cầu tiếp theo kèm theo mã JWT Điều này giúp cấp quyền truy cập vào các URL, dịch vụ và tài nguyên mà mã Token cho phép Phương pháp này không bị ảnh hưởng bởi Cross-Origin Resource Sharing (CORS) vì không sử dụng cookie.
10 https://topdev.vn/blog/jwt-la-gi/
JSON Web Token (JWT) là phương thức hiệu quả để truyền tải thông tin an toàn giữa các thành viên, nhờ vào phần chữ ký (signature) của nó Người nhận có thể xác định danh tính người gửi thông qua chữ ký, được tạo ra bằng cách kết hợp phần header và payload Điều này cho phép xác minh tính toàn vẹn của chữ ký, đảm bảo rằng thông tin không bị giả mạo.
3.5.3 Áp dụng vào đề tài
Với những đặc điểm của JWT, nhóm quyết định sử dụng vào đề tài nhằm mục đích Authentication:
- Xác thực các request từ client (ứng dụng mobile, web client) đến server
- Định danh đối tượng gửi request để trả về dữ liệu phù hợp
- Bảo mật thông tin, tránh việc giả mạo dữ liệu
- Server không cần lưu trữ data session để xác thực client
PHÁT BIỂU BÀI TOÁN
Giới thiệu về ứng dụng
Ứng dụng mà nhóm phát triển nhằm khắc phục những bất cập trong hình thức mua bán truyền thống tại các cửa tiệm ăn uống Các tính năng nổi bật của ứng dụng bao gồm việc cải thiện trải nghiệm khách hàng, tối ưu hóa quy trình đặt hàng và thanh toán, đồng thời nâng cao hiệu quả quản lý cho các chủ cửa tiệm.
Web app SPA (Single Page Application) được xây dựng bằng React mang lại hiệu suất cao và không yêu cầu cài đặt trên thiết bị, chỉ cần sử dụng trình duyệt web Nó hoạt động tốt trên các trình duyệt hiện đại, đồng thời hiệu năng và trải nghiệm người dùng của web app hiện nay, đặc biệt khi sử dụng các công nghệ như React hay Vue.js, gần như không thua kém gì so với ứng dụng di động gốc.
● Cung cấp thực đơn món ăn trực quan, dễ duyệt và chọn món
● Giỏ hàng có thể được chia sẻ giữa nhiều thiết bị khác nhau (tính năng giỏ hàng và đặt hàng theo nhóm)
● Đặt (order) món và giao tại quầy, thanh toán khi nhận hàng tại quầy
Khách hàng có thể theo dõi đơn hàng của mình theo thời gian thực, với những cập nhật trạng thái từ cửa hàng được hiển thị ngay lập tức, bao gồm các thông tin như huỷ đơn hàng và xác nhận đơn hàng.
● Khách hàng có thể hủy đơn hàng khi cửa tiệm chưa xác nhận đơn
● Khách hàng có thể dễ dàng xem lịch sử mua hàng và mọi chi tiết về đơn hàng của mình
- Yêu cầu lưu trữ: Hệ thống đáp ứng yêu cầu lưu trữ các thông tin như:
+ Thông tin sản phẩm: tên, giá, hình ảnh,
+ Thông tin cửa hàng: tên, địa chỉ, vị trí,
+ Thông tin khách hàng: tên, địa chỉ, số điện thoại,
+ Thông tin đơn hàng: khách hàng, cửa hàng, phương thức thanh toán,
+ Tìm kiếm các món ăn trong thực đơn
+ Tìm kiếm các đơn hàng
- Yêu cầu báo cáo thống kê:
+ Doanh thu của cửa hàng
- Yêu cầu về bảo mật thông tin:
+ Bảo mật thông tin khách hàng
- Yêu cầu về tốc độ xử lý:
+ Các thay đổi về thực đơn được cập nhật theo thời gian thực
+ Trạng thái các đơn hàng cập nhật theo thời gian thực
4.3.2 Yêu cầu phi chức năng
Giao diện hệ thống cần phải trực quan, dễ gần và đơn giản để phù hợp với đại đa số người dùng Nó nên tạo cảm giác thân thiện, hướng đến người sử dụng và dễ dàng thao tác.
● Dễ dàng nâng cấp khi muốn nâng cao tính năng sẵn có nhờ vào sự hệ thống hóa trong việc xử lý
● Dễ dàng mở rộng khi ứng dụng được đón nhận rộng rãi và nhu cầu người dùng tăng lên
● Hệ thống có giao diện trực quan, thân thiện và dễ sử dụng
● Các nút ấn và dòng text hiển thị trực quan nội dung muốn truyền đạt
Hệ thống tự động hóa cao giúp tính toán tổng số tiền đơn hàng, cập nhật trạng thái đơn hàng, tìm kiếm các cửa hàng lân cận và tự động hủy đơn hàng khi vượt quá thời gian lấy hàng.
● Hệ thống hiển trị trực quan và chi tiết các sản phẩm, đơn hàng
● Hệ thống hoạt động ổn định, có độ chính xác cao
● Tìm kiếm trả về kết quả đúng nhất
● Hoạt động tốt trên nhiều môi trường (window, macOS, ubuntu, )
● Hoạt động trên hầu hết các trình duyệt web phổ biến như: Chrome, Microsoft Edge, Safari
PHÂN TÍCH THIẾT KẾ HỆ THỐNG
Sơ đồ phân rã chức năng
Hệ thống Pickup later Đăng nhập Giỏ hàng
Chỉnh sửa giỏ hàng Xóa giỏ hàng Chia sẻ giỏ hàng Thanh toán
Xem chi tiết đơn hàng
Xử lý đơn hàng Báo cáo, thống kê
Xem danh sách sản phẩm
Xem chi tiết sản phẩm Tạo sản phẩm
Quản lý danh mục sản phẩm
Xem chi tiết danh mục sản phẩm Tạo danh mục sản phẩm Chỉnh sửa danh mục sản phẩm Quản lý thực đơn
Xem danh sách danh mục sản phẩm Cập nhật thực đơn
Xem chi tiết khách hàng Lịch sử đơn hàng
Quản lý cửa hàng Danh sách cửa hàng
Chi tiết cửa hàng Tìm kiếm cửa hàng mới
Mô hình Use-case
*Chủ cửa hàng phải đăng nhập để thực hiện các hành động
1 Admin Là quản trị viên của ứng dụng, người có tất cả các quyền trên ứng dụng
2 Khách hàng Là người dùng trực tiếp của ứng dụng, với các tính năng như tìm kiếm, đặt hàng, …
3 Chủ cửa hàng Là quản lý của các cửa hàng trên ứng dụng, với các tính năng như quản lý thực đơn, quản lý đơn hàng, …
Bảng 5.1: Danh sách người dùng
5.2.3 Danh sách các use-case
STT Tên use case Mô tả use case
1 Đăng nhập - Đối với khách hàng: Cho phép đăng nhập bằng
- Đối với chủ cửa hàng: Cho phép đăng nhập bằng username và password
2 Tìm kiếm sản phẩm Cho phép người dùng tìm kiếm sản phẩm trong hệ thống
3 Quản lý giỏ hàng Cho phép người dùng quản lý giỏ hàng như: tạo mới, chỉnh sửa, chia sẻ giỏ hàng
4 Theo dõi đơn hàng Cho phép người dùng quản lý đơn hàng như: xem chi tiết đơn hàng, lịch sử đơn hàng, …
5 Thanh toán Cho phép người dùng chọn phương thức thanh toán
6 Quản lý sản phẩm Cho phép người dùng quản lý các sản phẩm trong hệ thống như: tạo mới, chỉnh sửa, …
7 Quản lý danh mục sản phẩm
Cho phép người dùng quản lý các danh mục sản phẩm trong hệ thống như: tạo mới, chỉnh sửa, …
8 Quản lý thực đơn Cho phép người dùng quản lý các sản phẩm trong hệ thống như: tạo mới, chỉnh sửa, …
9 Quản lý khách hàng Cho phép người dùng quản lý khách hàng: xem chi tiết thông tin khách hàng, lịch sử giao dịch
10 Đăng xuất Cho phép người dùng đăng xuất khỏi hệ thống
11 Quản lý cửa hàng Cho phép người dùng quản lý cửa hàng: xem danh sách cửa hàng, thông tin chi tiết cửa hàng, …
12 Tìm kiếm cửa hàng mới
Cho phép người dùng tìm kiếm các cửa hàng mới trong khu vực lân cận theo một số tiêu chí nhất định
Bảng 5.2: Bảng danh sách use-case
Các sơ đồ và luồng xử lý
+ Là chức năng cho phép người dùng sử dụng số điện thoại để đăng nhập vào web app
+ Sau khi submit số điện thoại, người dùng sử dụng OTP trong tin nhắn SMS gửi đến số điện thoại để xác thực đăng nhập
+ Là chức năng cho phép người dùng sử dụng tài khoản đã tạo để đăng nhập vào ứng dụng
+ Người dùng sử dụng tên đăng nhập và mật khẩu đã đăng ký để đăng nhập 5.3.1.2 Activity diagrams
Khách hàng Chủ cửa hàng
- Là chức năng cho phép người dùng tìm kiếm sản phẩm
- Người dùng nhập từ khoá dài hơn 2 ký tự để tìm kiếm sản phẩm
- Là chức năng giỏ hàng của trang thương mại điện tử
- Bấm nút (+) hoặc (-) trên sản phẩm để tăng/giảm số lượng sản phẩm trong giỏ hàng
- Truy cập giỏ hàng, chọn “Xoá giỏ hàng” để xoá tất cả sản phẩm khỏi giỏ
Truy cập vào giỏ hàng và chọn “Chia sẻ giỏ hàng” để nhận link giỏ hàng Với link này, bạn có thể truy cập và chỉnh sửa giỏ hàng từ nhiều thiết bị khác nhau.
- Là chức năng xem danh sách và chi tiết đơn hàng, yêu cầu phải đăng nhập trước
- Truy cập trang lịch sử mua hàng và chọn một đơn hàng để xem thông tin chi tiết về order đó
- Là chức năng quản lý sản phẩm (product) dành cho chủ cửa hàng Yêu cầu phải đăng nhập tài khoản STORE MANAGER trước
- Truy cập trang danh sách sản phẩm để xem tất cả sản phẩm trong cơ sở dữ liệu:
+ Chọn tạo sản phẩm mới và nhập các thông tin sản phẩm rồi chọn lưu lại để tạo sản phẩm
+ Chọn một sản phẩm để xem chi tiết sản phẩm đó, có thể sửa thông tin sản phẩm và chọn lưu lại để chỉnh sửa sản phẩm
- Là chức năng quản lý danh mục sản phẩm (category) dành cho chủ cửa hàng Yêu cầu phải đăng nhập tài khoản STORE MANAGER trước
- Truy cập trang danh sách sản phẩm để xem tất cả danh mục sản phẩm trong cơ sở dữ liệu:
+ Chọn tạo danh mục mới và nhập các thông tin rồi chọn lưu lại để tạo danh mục
+ Chọn một danh mục để xem chi tiết danh mục đó, có thể sửa thông tin và chọn lưu lại để chỉnh sửa danh mục
Thiết kế kiến trúc
Hình 5.2: Mô hình kiến trúc hệ thống
- Client được xây dựng bằng ReactJS, là nơi khách hàng tương tác trực tiếp để thực hiện các thao tác tìm kiếm, đặt món
- Client giao tiếp với Go server bằng Restful API
Trong hệ thống này, server được xây dựng bằng Go và Gin-gonic framework Server bao gồm 3 phần:
- Web service: chứa các giao thức nhận và gửi dữ liệu, đảm bảo giao tiếp giữa client và cơ sở dữ liệu
- MQTT: sử dụng MQTT để giao tiếp với ứng dụng quản lý đơn hàng trên mobile theo thời gian thực
- Ứng dụng quản lý đơn hàng tại cửa hàng
- Ứng dụng được xây dựng bằng React Native, sử dụng MQTT để nhận và cập nhật dữ liệu từ Go server theo thời gian thực
5.4.2.5 Hệ quản trị cơ sở dữ liệu PostgreSQL
- Hệ thống sử dụng hệ quản trị cơ sở dữ liệu PostgreSQL để lưu trữ và xử lý dữ liệu
Dữ liệu từ cơ sở dữ liệu PostgreSQL được truy xuất và lưu trữ thông qua thư viện GORM, cung cấp các phương thức như create, update, delete và find, giúp việc thao tác với cơ sở dữ liệu trở nên thuận tiện hơn.
Thiết kế cơ sở dữ liệu
Hình 5.3: Sơ đồ lớp trong hệ thống
5.5.2 Tổng quan cơ sở dữ liệu
STT Tên lớp Mô tả
1 Stores Quản lý thông tin cửa hàng
2 Products Quản lý thông tin sản phẩm
3 Combos Quản lý thông tin combo sản phẩm
4 Groups Quản lý thông tin group các sản phẩm
5 Orders Quản lý thông tin đơn hàng
6 Order details Quản lý thông tin chi tiết đơn hàng
7 Order audits Quản lý thông tin trạng thái đơn hàng
8 Carts Quản lý thông tin giỏ hàng
9 Cart details Quản lý thông tin ch tiết giỏ hàng
10 User Quản lý thông tin người dùng
11 Locations Quản lý thông tin các địa điểm trong khu vực
Dự án được phát triển trên nền tảng quản trị cơ sở dữ liệu PostgreSQL, với danh sách các lớp (class) mà nhóm đã áp dụng cho đề tài.
Thiết kế giao diện
Mô tả: Đây là giao diện người dùng sẽ nhìn thấy đầu tiên khi truy cập vào web app
● Thanh tìm kiếm ở trên cùng, chạm vào để chuyển sang trang tìm kiếm
● Nút truy cập vào trang đăng nhập (nếu chưa đăng nhập) hoặc hiển thị giao diện tài khoản (nếu đã đăng nhập)
● Các danh mục sản phẩm
● Sản phẩm của một vài danh mục tiêu biểu
● Nút truy cập giỏ hàng ở dưới cùng bên phải
Trang tìm kiếm sản phẩm cho phép bạn nhập từ khóa vào hộp tìm kiếm Ngay sau khi bạn nhập từ khóa, kết quả tìm kiếm sẽ được hiển thị ngay lập tức.
Mô tả: Liệt kê tất cả sản phẩm thuộc một danh mục
Mô tả: Hiển thị tất cả thông tin của một sản phẩm bao gồm hình ảnh, tên giá (gốc và sale)
Tất cả sản phẩm được thêm vào giỏ hàng sẽ được hiển thị tại đây
● Trên cùng là danh sách sản phẩm
● Ngay bên dưới là nút Xoá tất cả Chạm vào để xoá tất cả sản phẩm khỏi giỏ hàng
● Khu vực dưới cùng màn hình bao gồm tổng giá trị của giỏ hàng và nút chuyển đến trang Thanh toán
Trang nhập thông tin đơn hàng và thanh toán là bước cuối cùng và quan trọng nhất trước khi hoàn tất đặt hàng, được chia thành 4 phần chính.
Thông tin người nhận hàng bao gồm tên và số điện thoại của người nhận tại quầy, cùng với lưu ý của khách hàng về đơn hàng Số điện thoại này chính là số mà khách hàng đã sử dụng để đăng nhập.
● Tóm tắt (summary) về đơn hàng: sản phẩm, tổng tạm tính, discounted price…
● Chọn hình thức thanh toán (CoD) và khuyến mãi nếu có
Khu vực dưới cùng màn hình hiển thị tổng giá trị đơn hàng cùng với nút đặt hàng Khi khách hàng chạm vào nút này, họ sẽ được chuyển đến trang chi tiết của đơn hàng vừa đặt.
Để đăng nhập, người dùng cần nhập số điện thoại và nhấn nút Gửi mã OTP Sau đó, một tin nhắn SMS chứa mã OTP sẽ được gửi đến số điện thoại đã nhập Sử dụng mã này để xác thực với hệ thống, người dùng sẽ thành công trong việc đăng nhập và có thể thực hiện mua hàng.
Khi người dùng đăng nhập, họ sẽ thấy giao diện tài khoản, được thiết kế dưới dạng sidebar, bao gồm nhiều tính năng hữu ích.
● Thông tin người dùng - tên và số điện thoại đăng nhập
● Nút đăng xuất: đăng xuất khỏi số điện thoại hiện tại
● Liên kết đến trang Lịch sử mua hàng
Mô tả: Hiển thị tất cả đơn hàng được đặt bởi số điện thoại đang đăng nhập
Mô tả: Trang nhập thông tin chi tiết về một đơn hàng Trang được chia thành các phần:
● Thông tin đơn hàng: Bao gồm các thông tin như ID đơn hàng, ngày đặt đơn, thông tin người nhận
● Trạng thái đơn hàng: cho phép khách hàng theo dõi thời gian thực tình trạng đơn hàng của mình
● Tóm tắt (summary) về đơn hàng: sản phẩm, tổng tạm tính, discounted price…
● Thông tin thanh toán, bao gồm các thông tin:
● Số tiền cần phải trả cho đơn hàng
● Nút Huỷ đơn hàng dành cho những đơn hàng chưa được cửa hàng xác nhận khi khách hàng không muốn đặt hàng nữa
5.6.10 Danh sách đơn hàng (cửa hàng)
Mô tả: Hiển thị tất cả đơn hàng cửa hàng đang có trên hệ thống, được chia thành 3 nhóm
(ứng với 3 tab trong hình):
● “Mới”: hiển thị các đơn mới tạo và và các đơn hệ thống vừa mới nhận
● “Đang thực hiện”: hiển thị các đơn đã được xác nhận và các đơn đã được chuẩn bị và sẵn sàng giao tới tay khách hàng
● “Đã hoàn thành”: hiển thị các đơn đã được hoàn thành (đã giao) và các đơn bị huỷ (bởi cả cửa hàng lẫn khách hàng)
5.6.11 Chi tiết đơn hàng (cửa hàng)
Mô tả: Trang nhập thông tin chi tiết về một đơn hàng dành cho chủ cửa hàng Trang được chia thành các phần sau:
● Thông tin đơn hàng: Bao gồm các thông tin như ID đơn hàng, ngày đặt đơn, thông tin người nhận
● Trạng thái đơn hàng: cho phép theo dõi thời gian thực tình trạng đơn hàng của mình
● Tóm tắt (summary) về đơn hàng: sản phẩm và giá trị đơn hàng
● Thông tin thanh toán, bao gồm các thông tin:
● Số tiền cần phải trả cho đơn hàng
Cửa hàng có thể thực hiện nhiều hành động trên đơn hàng hiện tại, bao gồm xác nhận đơn, huỷ đơn, và đánh dấu đơn hàng là sẵn sàng giao hoặc đã hoàn tất Những thao tác này giúp quản lý đơn hàng hiệu quả và nâng cao trải nghiệm khách hàng.
KIỂM THỬ ỨNG DỤNG
Môi trường kiểm thử
STT Tên thiết bị Hệ điều hành Màn hình Cấu hình
1 iPhone 8 Plus iOS 13.5 Full HD
Apple A11, RAM 3GB, Storage 64GB
Snapdragon 845, RAM 4GB, Storage 128GB
Thực thi kiểm thử
STT Yêu cầu Test Yêu cầu kết quả Kết quả
1 Màu sắc hiển thị trên ứng dụng
Màu sắc cần phải phản ánh đúng ý tưởng thiết kế ban đầu, với tông màu chủ đạo là trắng và xám nhạt, kết hợp cùng màu xanh lá cây làm màu phụ Sự phối hợp này tạo nên một tổng thể giao diện người dùng (UI) hài hòa và nổi bật.
2 Hiển thị của các thành phần phần tử UI
Kích thước các đối tượng đúng với ý tưởng thiết kế, vị trí hợp lý, tương quan hài hoà với nhau
Không có hiện tượng các phần tử
UI chồng lấn lên nhau
3 Trải nghiệm người dùng (UX) tốt, phù hợp
Các phần tử phải được bố trí hợp lý trên mọi màn hình trong phần mềm để người dùng có thể thao tác thuận tiện nhất
STT Yêu cầu Test Yêu cầu kết quả Kết quả
1 Kiểm tra chức năng Đăng nhập
Người dùng nhập số điện thoại hợp lệ và OTP hoặc tên đăng nhập và mật khẩu chính xác thì sẽ đăng nhập được vào hệ thống
2 Kiểm thử chức năng tìm kiếm nhanh
- Người dùng nhập từ khoá 2 ký tự trở xuống, trang web sẽ không tìm kiếm
- Người dùng nhập từ khoá dài hơn 2 ký tự, kết quả tìm kiếm sản phẩm hiển thị sau vài giây
3 Kiểm thử chức năng chỉnh sửa giỏ hàng
- Bấm vào nút (+) trên sản phẩm, số lượng sản phẩm trong giỏ hàng tăng lên 1
- Bấm vào nút (-) trên sản phẩm, số lượng sản phẩm trong giỏ hàng giảm đi 1
4 Kiểm thử chức năng xem chi tiết đơn hàng
- Tất cả thông tin của đơn hàng được hiển thị chính xác (ID, ngày tạo, thông tin người nhận, đơn hàng, thông tin thanh toán)
5 Kiểm thử chức năng quản lý đơn hàng
- Đơn hàng mới, đang xử lý, đã hoàn thành được hiển thị đầy đủ chính xác có phân trang
- Thông tin đơn hàng được hiển thị đầy đủ chính xác,
- Trạng thái đơn hàng được cập nhật chính xác
6 Kiểm chức năng quản lý sản phẩm
- Danh sách sản phẩm được hiển thị đầy đủ, có phân trang
- Chi tiết sản phẩm được hiển thị đầy đủ chính xác
- Sau khi chỉnh sửa thông tin sản phẩm, có thể nhìn thấy thay đổi ngay lập tức
7 Kiểm thử chức năng quản lý danh mục
- Danh sách các danh mục được hiển thị đầy đủ, có phân trang
- Chi tiết danh mục được hiển thị đầy đủ chính xác
- Sau khi chỉnh sửa thông tin danh mục, có thể nhìn thấy thay đổi ngay lập tức
