Đồ án ứng dụng hỗ trợ mua bán đa nền tảng

ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA CÔNG NGHỆ PHẦN MỀM

VŨ ĐỨC MẠNH
ĐINH QUANG MẠNH

ĐỒ ÁN 1

ỨNG DỤNG HỖ TRỢ MUA BÁN ĐA NỀN TẢNG
The Application supports Cross-Platform Buying and Selling

KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM

GIẢNG VIÊN HƯỚNG DẪN
Th.S TRẦN ANH DŨNG

TP. HỒ CHÍ MINH, 2023


ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA CÔNG NGHỆ PHẦN MỀM

VŨ ĐỨC MẠNH
ĐINH QUANG MẠNH

ĐỒ ÁN 1

ỨNG DỤNG HỖ TRỢ MUA BÁN ĐA NỀN TẢNG
The Application supports Cross-Platform Buying and Selling

KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM

GIẢNG VIÊN HƯỚNG DẪN
Th.S TRẦN ANH DŨNG

TP. HỒ CHÍ MINH, 2023


NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN

............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................
............................................................................................................................................

Tp.HCM, ngày

tháng

năm 2023

Giảng Viên Hướng Dẫn

Ths. Trần Anh Dũng


LỜI CẢM ƠN
Trước hết, nhóm chúng em xin gửi lời cảm ơn đến Trường Đại học Công nghệ
thông tin – ĐHQGTPHCM và các thầy cô là giảng viên của khoa Cơng nghệ phần
mềm đã tạo điều kiện để nhóm chúng em hồn thành đồ án 1 – Chủ đề Tìm hiểu về
React Native và xây dựng ứng dụng.
Nhóm em xin gửi lời cảm ơn chân thành và sự tri ân sâu sắc đến thầy Nguyễn
Công Hoan là giảng viên hướng dẫn trực tiếp và trang bị cho chúng em những kiến
thức căn bản vững chắc để thực hiện đồ án này.
Trong khoảng thời gian thực hiện đồ án, chúng em đã học hỏi thêm được nhiều
kiến thức, kinh nghiệm, biết được thêm về nhiều cơng nghệ mới. Nhóm em đã vận
dụng những kiến thức nền tảng đã tích lũy đồng thời kết hợp với việc học hỏi và
nghiên cứu những kiến thức mới. Từ đó, vận dụng tối đa những gì đã học hỏi được
để hồn thành báo cáo đồ án này.
Mặc dù đã cố gắng hoàn thành báo cáo với tất cả nỗ lực song báo cáo của
nhóm chúng em chắc chắn khơng tránh khỏi những thiếu sót, chúng em rất mong
nhận được sự thơng cảm và góp ý chân thành từ q thầy, cơ. Nhóm em xin chân
thành cảm ơn.
Thành phố Hồ Chí Minh, 30 tháng 6 năm 2023
Sinh viên

Vũ Đức Mạnh
Đinh Quang Mạnh


MỤC LỤC
NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN ..................................................1
LỜI CẢM ƠN ............................................................................................................1
MỤC LỤC ..................................................................................................................2
DANH MỤC HÌNH ...................................................................................................6
DANH MỤC BẢNG ..................................................................................................8
NỘI DUNG ĐỀ TÀI ................................................................................................16
CHƯƠNG 1: MỞ ĐẦU.......................................................................................16
1.1. Lý do chọn đề tài ..........................................................................................16
1.2. Mục đích nghiên cứu....................................................................................17
1.2.1. Khách quan ............................................................................................17
1.2.2. Chủ quan ...............................................................................................17
1.3. Đối tượng nghiên cứu ..................................................................................18
1.3.1. Các công nghệ nghiên cứu: ...................................................................18
1.3.2. Đối tượng sử dụng đề tài hướng đến: ..................................................19
1.4. Phạm vi nghiên cứu ......................................................................................20
1.4.1. Phạm vi môi trường: .............................................................................20
1.4.2. Phạm vi chức năng: ...............................................................................20
CHƯƠNG 2: KIẾN THỨC NỀN TẢNG ..........................................................21
2.1. React native ..................................................................................................21
2.2. JavaScript ......................................................................................................22
2.3. React Navigation ..........................................................................................23
2.4. Expo Go ........................................................................................................24


2.5. Firebase ........................................................................................................25

CHƯƠNG 3: XÂY DỰNG HỆ THỐNG...........................................................26
3.1. Kiến trúc của React Native: ..........................................................................26
3.1.1. Kiến trúc cũ ...........................................................................................26
3.1.2. Kiến trúc mới .........................................................................................28
3.2. Cách thức hoạt động của React Native .......................................................29
3.3. Sơ đồ Use case .............................................................................................30
3.3.1. Danh sách tác nhân ...............................................................................31
STT .......................................................................................................................31
Tác nhân ...............................................................................................................31
Mô tả/ Ghi chú .....................................................................................................31
1 .............................................................................................................................31
Người dùng...........................................................................................................31
Người dùng, là người dùng khi không đăng nhập ...........................................31
2 .............................................................................................................................31
Khách hàng ..........................................................................................................31
Khách hàng, là người dùng có thể đăng nhập vào ứng dụng và sử dụng các
chức năng của ứng dụng .....................................................................................31
3.3.2. Danh sách Use case ...............................................................................31
3.3.3. Mô tả chi tiết Use case..........................................................................33
3.4. Class Diagram ...............................................................................................43
3.5. Sequence Diagram .......................................................................................44
3.5.1. Sequence Diagram Đăng nhập..............................................................44


3.5.2. Sequence Diagram Đăng ký ..................................................................45
3.5.3. Sequence Diagram Cập nhật tài khoản ................................................46
3.5.4. Sequence Diagram Đặt hàng ................................................................47
3.5.5. Sequence Diagram Đăng bán ................................................................48
CHƯƠNG 4: THIẾT KẾ GIAO DIỆN NGƯỜI DÙNG .................................49
4.1. Sơ đồ liên kết màn hình ...............................................................................49

4.2. Danh sách các màn hình ..............................................................................50
4.3. Mơ tả chi tiết các màn hình .........................................................................52
4.3.1. Màn hình Onboarding ...........................................................................52
4.3.2. Màn hình Home ....................................................................................53
4.3.3. Màn hình Shopping ...............................................................................54
4.3.4. Màn hình Detail Product .......................................................................55
4.3.5. Màn hình Favorite .................................................................................56
4.3.6. Màn hình Cart .......................................................................................57
4.3.7. Màn hình Payment ................................................................................58
4.3.8. Màn hình Login .....................................................................................59
4.3.9. Màn hình Register .................................................................................60
4.3.10. Màn hình Profile..................................................................................61
4.3.11. Màn hình Information Account ..........................................................62
4.3.12. Màn hình Secondhand ........................................................................63
4.3.13. Màn hình Add Post..............................................................................64
4.3.14. Màn hình My Order ............................................................................65
4.3.15. Màn hình Detail Order ........................................................................66


4.3.16. Màn hình Address ...............................................................................67
4.3.17. Màn hình Add Address........................................................................68
4.3.18. Màn hình Card.....................................................................................69
4.3.19. Màn hình Add Card .............................................................................70
CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ .........................................................71
5.1. Môi trường cài đặt và kiểm thử: ..................................................................71
5.2. Kết quả kiểm thử ..........................................................................................71
CHƯƠNG 6: TỔNG KẾT ..................................................................................72
6.1. Kết quả đạt được ..........................................................................................72
6.1.1. Thành quả..............................................................................................72
6.1.2. Hạn chế..................................................................................................72

6.2. Hướng phát triển ..........................................................................................72
TÀI LIỆU THAM KHẢO ......................................................................................74


DANH MỤC HÌNH
Hình 2.1: React Native .................................................................................................21
Hình 2.2: JavaScript .....................................................................................................22
Hình 2.3: React Navigation ..........................................................................................23
Hình 2.4: Expo Go ........................................................................................................24
Hình 2.5: Firebase ........................................................................................................25
Hình 3.1: Kiến trúc cũ React Native ............................................................................26
Hình 3.2: Kiến trúc mới React Native ..........................................................................28
Hình 3.3: Sơ đồ Use case............................................................................................30
Bảng 3.4: Danh sách tác nhân .....................................................................................31
Bảng 3.5: Danh sách Use case .....................................................................................32
Hình 3.6: Sequence Diagram Đăng nhập ....................................................................44
Hình 3.7: Sequence Diagram Đăng ký .........................................................................45
Hình 3.8: Sequence Diagram Cập nhật tài khoản .....................................................46
Hình 3.9: Sequence Diagram Đặt hàng .....................................................................47
Hình 3.10: Sequence Diagram Đăng bán ..................................................................48
Hình 4.1: Sơ đồ liên kết các màn hình.........................................................................49
Hình 4.2: Màn hình Onboarding .................................................................................52
Hình 4.3: Màn hình Home ...........................................................................................53
Hình 4.4: Màn hình Shopping......................................................................................54
Hình 4.5: Màn hình Detail Product .............................................................................55
Hình 4.6: Màn hình Favorite........................................................................................56
Hình 4.7: Màn hình Cart ..............................................................................................57
Hình 4.8: Màn hình Payment ......................................................................................58
Hình 4.9: Màn hình Login ............................................................................................59
Hình 4.10: Màn hình Register......................................................................................60

Hình 4.11: Màn hình Profile ........................................................................................61


Hình 4.12: Màn hình Information Account .................................................................62
Hình 4.13: Màn hình Secondhand...............................................................................63
Hình 4.14: Màn hình Add Post ....................................................................................64
Hình 4.15: Màn hình My Order ...................................................................................65
Hình 4.16: Màn hình Detail Order ...............................................................................66
Hình 4.17: Màn hình Address ......................................................................................67
Hình 4.18: Màn hình Add Address ..............................................................................68
Hình 4.19: Màn hình Card ...........................................................................................69
Hình 4.20: Màn hình Add Card ....................................................................................70


DANH MỤC BẢNG
Bảng 3.1: Danh sách tác nhân.............................................................................................. 31
Bảng 3.2: Danh sách Use case ............................................................................................. 32
Bảng 3.3: Đặc tả use case dăng nhập .................................................................................. 33
Bảng 3.4: Đặc tả use case đăng ký tài khoản ....................................................................... 34
Bảng 3.5: Đặc tả use case quên mật khẩu ........................................................................... 36
Bảng 3.6: Đặc tả use case cập nhật thông tin tài khoản ..................................................... 36
Bảng 3.7: Đặc tả use case tìm kiếm sản phẩm .................................................................... 37
Bảng 3.8: Đặc tả use case sản phẩm yêu thích.................................................................... 38
Bảng 3.9: Đặc tả use case thêm sản phẩm vào giỏ hàng .................................................... 38
Bảng 3.10: Đặc tả use case xem thông tin chi tiết sản phẩm.............................................. 39
Bảng 3.11: Đặc tả use case xóa sản phẩm trong giỏ hàng .................................................. 40
Bảng 3.12: Đặc tả use case xóa sản phẩm trong danh sách yêu thích ............................... 40
Bảng 3.13: Đặc tả use case thêm sản phẩm muốn bán ...................................................... 41
Bảng 3.14: Đặc tả use case xóa sản phẩm muốn bán ......................................................... 42
Bảng 4.1: Danh sách các màn hình ...................................................................................... 52

Bảng 5.1: Kết quả kiểm thử ................................................................................................. 71


ĐỀ CƯƠNG CHI TIẾT
TÊN ĐỀ TÀI: Ứng dụng hỗ trợ mua bán đa nền tảng.
Cán bộ hướng dẫn:
- ThS. Trần Anh Dũng

Thời gian thực hiện: Từ ngày 9/3/2023 đến ngày kết thúc Đồ án 1
Sinh viên thực hiện:
Vũ Đức Mạnh – 20520630
Đinh Quang Mạnh – 20520628
Nội dung đề tài
1. Lý do chọn đề tài:
Hiện nay, thị trường mua bán qua internet đang phát triển rất mạnh. Người dùng có
nhu cầu mua bán các sản phẩm trực tuyến ngày càng tăng, đặc biệt là với tình hình
dịch bệnh hiện nay. Một ứng dụng mua bán đa nền tảng là một giải pháp hiệu quả
để giúp người dùng tiếp cận với những sản phẩm mà họ cần một cách dễ dàng và
thuận tiện trên nhiều nền tảng khác nhau như website, ứng dụng trên di động, hoặc
trên các nền tảng mạng xã hội. Vì vậy, nghiên cứu về Ứng dụng mua bán đa nền
tảng là rất cần thiết và có tính ứng dụng cao trong thực tế. Điều này đảm bảo cho
người dùng sẽ tiếp cận đến nhiều khách hàng hơn và nâng cao khả năng bán hàng
của họ. Ngoài ra, ứng dụng mua bán đa nền tảng còn giúp cho người tiêu dùng dễ
dàng tìm kiếm sản phẩm mà họ muốn mua trên nhiều nền tảng khác nhau, đồng
thời giúp họ so sánh giá cả và chất lượng sản phẩm. Để giải quyết vấn đề trên,
nhóm em quyết định chọn đề tài Ứng dụng mua bán đa nền tảng, nhằm phát triển
một ứng dụng cung cấp môi trường, cũng như một thị trường online để người dùng
có thể trao đổi, mua bán các loại mặt hàng sản phẩm trên nền tảng di động IOS và
Android.
2. Mục tiêu:

Xây dựng ứng dụng:
Ứng dụng có thể chạy trên ios và android mobile, 2 phiên bản có sự đồng bộ về cơ
sở dữ liệu
Tạo ra một môi trường mua bán, trao đổi tất cả các mặt hàng, sản phẩm đúng với
nhu cầu của người dùng.
Tương tác giữa người mua và người bán.
Cung cấp giao diện thân thiện, tiện dụng, phù hợp với mọi đối tượng khách hàng.
Cung cấp giao diện quản lý tài khoản nội bộ, đăng và chỉnh sửa tin tức, quản lý hỏi
đáp, giải quyết thắc mắc dành cho nhân viên trung tâm, phân quyền theo từng vị
trí.
Cung cấp các thống kê, biểu đồ trực quan số liệu, từ đó đề xuất ra các mặt hàng
đang được nhiều người quan tâm nhất.
3. Phạm vi:
Phạm vi môi trường: IOS và Android Mobile
Phạm vi chức năng:
Đối với ứng dụng:
Giao diện thân thiện, tiện dụng hướng người dùng, cung cấp đầy đủ thông tin về
sản phẩm, người mua và người bán
Cung cấp chat box tương tác giữa người mua và người bán.
Cung cấp các chức năng hủy đơn, mua lại, hoặc hoàn trả cho người mua.
Cung cấp các chức năng quản lí giảm giá, vận chuyển.
Cung cấp chức năng quản lý tài khoản nội bộ trong trung tâm
Cung cấp biểu đồ và thống kê số liệu, từ đó đề xuất các mặt hàng đang được nhiều
người quan tâm nhất.
4. Đối tượng sử dụng:
Tất cả mọi người muốn trao đổi các sản phẩm, có nhu cầu mua hoặc bán những
mặt hàng mà bản thân đang cần hoặc đang có.

Nhà vận chuyển muốn trở thành đơn vị vận chuyển sản phẩm của ứng dụng.
5. Phương pháp thực hiện:
Phương pháp làm việc:
Làm việc nhóm 2 thành viên thơng qua cả 2 phương thức online và offline dưới sự
hướng dẫn của giảng viên hướng dẫn.
Phương pháp nghiên cứu:
Phân tích nhu cầu sử dụng của đối tượng người dùng.
Nghiên cứu tài liệu các công nghệ liên quan.
Phương pháp công nghệ:
Xây dựng giao diện IOS và Android Mobile để người dùng có thể tương tác với
ứng dụng.
Tìm hiểu về React Native.
Quản lý source code thông qua Github
Sử dụng Google doc, Office 365 Word… để quản lý tiến trình và tài liệu
6. Nền tảng công nghệ:
Front-end: ReactJS
Back-end: NodeJSs
Database: MySQL
Hỗ trợ liên kết ExpressJS
Visual Studio Code
Android Studio
7. Kết quả mong đợi:
Giao diện dễ nhìn, trải nghiệm người dùng tốt
Triển khai được trên nền tảng Android và IOS
Ứng dụng di động hoạt động ổn định, có thể xử lý thơng tin nhanh chóng…
8. Hướng phát triển của đề tài:


Thêm tính năng chat để trao đổi giữa người mua và người bán

Nâng cấp giao diện, thêm bộ chuyển đổi sang nhiều ngôn ngữ khác
Nâng cấp source code, tăng tốc độ xử lý nhanh chóng, ổn định
9. Kế hoạch làm việc:
Thời gian thực hiện từ ngày 10/3/2023 đến ngày kết thúc Đồ án 1
Nhóm chia thành 2 giai đoạn cụ thể:
Giai đoạn 1: Gồm 4 sprint với thời gian từ 10/3/2023 đến 23/4/2023
Sprint 1: Tìm hiểu và định hình yêu cầu cho ứng dụng
Sprint 2: Thiết kế giao diện người dùng
Sprint 3: Thiết kế cơ sở dữ liệu
Sprint 4: Xác định và xây dựng các chức năng cơ bản của ứng dụng
Sprint

Thời gian

Cơng việc dự kiến

Sprint 1

10/3/2023 – 19/3/2023

Tìm hiểu đề tài.
Xác định phạm vi, hướng phát triển
của đề tài.
Tìm hiểu và phân tích các yêu cầu
nghiệp vụ của đề tài.
Xác định các công nghệ sẽ sử dụng
để xây dựng ứng dụng.
Viết tài liệu, đề cương chi tiết.

Sprint 2

20/3/2023 – 2/4/2023

Tìm hiểu các nguyên tắc thiết kế
UI/UX cho ứng dụng di động.
Xác định các thành phần của giao
diện ứng dụng và thiết kế các màn


hình, layout, icon, font chữ, màu
sắc, hình ảnh,… cho ứng dụng.
Sử dụng công cụ thiết kế như
Adobe XD hoặc Figma để tạo ra
bản thiết kế mô phỏng cho ứng
dụng.
Thực hiện việc đánh giá và cải thiện
bản thiết kế để đảm bảo tính thẩm
mỹ, trải nghiệm người dùng và đảm
bảo tính thực tiễn cho ứng dụng.
Sprint 3

3/4/2023 – 9/4/2023

Xây dựng CSDL cho ứng dụng:
• Tạo bảng
• Cập nhật dữ liệu
Liên kết CSDL vào ứng dụng

Sprint 4

10/4/2023 – 31/4/2023

Xây dựng các chức năng cơ bản của
ứng dụng:
• Đăng nhập, đăng ký tài
khoản.
• Tìm kiếm sản phẩm và xem
sản phẩm.
• Đặt hàng, thanh tốn.
• Quản lí hóa đơn đã đặt
• Quản lý tài khoản.
• Đăng bán sản phẩm
• Quản lý sản phẩm đã đăng
bán

Giai đoạn 2: Gồm 5 sprint với thời gian từ 24/4/2023 đến kết thúc Đồ án 1


Sprint 5: Hồn thiện tính năng của ứng dụng và kiểm thử
Sprint 6: Hồn thiện tính năng của ứng dụng và kiểm thử
Sprint 7: Hồn thiện tính năng của ứng dụng và kiểm thử
Sprint 8: Tổng kiểm thử và sửa lỗi, tối ưu hóa hiệu suất ứng dụng
Sprint 9: Triển khai ứng dụng và viết báo cáo
Sprint

Thời gian

Công việc dự kiến

Sprint 5

1/5/2023 – 19/5/2022

Tiếp tục hồn thiện các
tính năng của ứng dụng
Kiểm thử ứng dụng.

Sprint 6

20/5/2023 – 6/6/2023

Tiếp tục hoàn thiện các
tính năng của ứng dụng
Kiểm thử ứng dụng.

Sprint 7

7/6/2023 – 22/6/2023

Tiếp tục hồn thiện các
tính năng của ứng dụng
Kiểm thử ứng dụng.

Sprint 8

23/6/2023 – 30/6/2023

Thực hiện kiểm thử chức
năng, kiểm tra tính năng,
khả năng tương thích

trên các thiết bị khác
nhau.
Sửa lỗi và cải thiện tính
ổn định của ứng dụng.
Tối ưu hóa hiệu suất ứng
dụng để đảm bảo tốc độ


và độ mượt của ứng
dụng.
Sprint 9

1/7/2023 – kết thúc

Triển khai ứng dụng trên
nền tảng IOS và Android
Viết báo cáo

10. Phân cơng cơng việc:
Cơng việc

Mơ tả cơng việc

Cơng việc chung

Tìm hiểu cơng nghệ
Phân tích u cầu
Kiểm thử ứng dụng
Triển khai ứng dụng
Chuẩn bị tài liệu, viết báo cáo

Công việc cá nhân

Vũ Đức Mạnh

Đinh Quang Mạnh

Thiết kế CSDL

Thiết kế giao diện

Lập trình Back-end

Lập trình Front-end

Tp.Hồ Chí Minh, ngày tháng năm 2023


NỘI DUNG ĐỀ TÀI
CHƯƠNG 1: MỞ ĐẦU
1.1. Lý do chọn đề tài
Hiện nay, thương mại điện tử đang ngày càng phát triển, và người mua hàng ngày
càng tìm kiếm các nền tảng mua bán trực tuyến để mua sản phẩm và dịch vụ. Việc phát
triển một ứng dụng mua bán đa nền tảng có thể giúp chúng ta tận dụng cơ hội thị trường
và thu hút một số lượng lớn khách hàng tiềm năng. Ngoài ra, người dùng truy cập Internet
chủ yếu thông qua các thiết bị di động như điện thoại thơng minh và máy tính bảng. Một
ứng dụng mua bán đa nền tảng cho phép khách hàng truy cập và mua hàng từ bất kỳ thiết
bị di động nào, tạo ra trải nghiệm mua sắm thuận tiện và tiện ích. Với một ứng dụng mua
bán đa nền tảng, chúng ta có thể tiếp cận và phục vụ khách hàng trên nhiều nền tảng khác
nhau, bao gồm các hệ điều hành di động (Android, iOS), trình duyệt web và có thể mở rộng

thậm chí đến các nền tảng điện tử khác như smart TV hoặc thiết bị đeo.
Mặc khác, ứng dụng giúp tạo ra một trải nghiệm mua sắm nhất quán cho khách hàng
trên tất cả các nền tảng. Điều này đảm bảo rằng khách hàng có thể truy cập vào các sản
phẩm và dịch vụ của bạn một cách dễ dàng và thuận tiện, không phụ thuộc vào thiết bị
hoặc nền tảng mà họ đang sử dụng.
Sử dụng một ứng dụng mua bán đa nền tảng có thể giúp mở rộng phạm vi kinh
doanh và tăng doanh số bán hàng. Bằng cách tiếp cận các khách hàng trên nhiều nền tảng,
bạn có thể thu hút đối tượng khách hàng mới và tạo ra một kênh bán hàng bổ sung để tăng
doanh thu và lợi nhuận.


1.2. Mục đích nghiên cứu
1.2.1. Khách quan
Ứng dụng mua bán đa nền tảng tạo ra một cộng đồng trực tuyến cho người mua và
người bán giao dịch với nhau. Nó cung cấp một phương tiện để người mua tìm kiếm và
tương tác với người bán có hàng hóa hoặc dịch vụ phù hợp với nhu cầu của họ.
Giúp tăng tính minh bạch và tin cậy trong quá trình mua bán trực tuyến. Người dùng
có thể xem thơng tin chi tiết về sản phẩm, đánh giá và nhận xét từ người dùng khác để có
cái nhìn tổng quan về người bán và chất lượng sản phẩm.
Người dùng khơng cần phải tìm kiếm qua nhiều nguồn thông tin khác nhau hoặc di
chuyển đến các cửa hàng vật lý để mua hàng.
1.2.2. Chủ quan
Nhóm muốn áp dụng kiến thức đã học được trong lĩnh vực lập trình và phát triển
phần mềm để xây dựng một ứng dụng thực tế. Việc tham gia vào việc phát triển một ứng
dụng mua bán đa nền tảng giúp các thành viên trong nhóm rèn kỹ năng lập trình, phát triển
phần mềm và quản lý dự án.
Các thành viên có thể rèn kỹ năng làm việc nhóm, học cách phân công nhiệm vụ,
tương tác với thành viên khác và giải quyết các vấn đề phát sinh trong quá trình phát triển.

1.3. Đối tượng nghiên cứu
1.3.1. Các công nghệ nghiên cứu:
-

React Native: React Native là framework phát triển ứng dụng di động đa nền tảng
sử dụng JavaScript. Nó cho phép bạn xây dựng các thành phần giao diện người dùng
tương tự như React, nhưng với khả năng hoạt động trên cả hai nền tảng iOS và
Android.

-

Expo: Expo là một nền tảng phát triển ứng dụng React Native. Nó cung cấp một bộ
công cụ và dịch vụ hỗ trợ cho việc phát triển, xây dựng và triển khai ứng dụng React
Native một cách nhanh chóng và dễ dàng.

-

Firebase: Firebase là một nền tảng phát triển ứng dụng di động của Google. Nó cung
cấp các dịch vụ như cơ sở dữ liệu thời gian thực, xác thực người dùng, lưu trữ đám
mây và thông báo đẩy. Firebase rất phổ biến trong việc phát triển ứng dụng mua bán
đa nền tảng để quản lý dữ liệu người dùng, danh mục sản phẩm, đăng nhập và đăng
ký người dùng, v.v.

-

React Navigation: Đây là một thư viện điều hướng (navigation) phổ biến trong ứng
dụng React Native. React Navigation cung cấp các thành phần và công cụ giúp bạn
xây dựng các luồng điều hướng trong ứng dụng của mình, chẳng hạn như màn hình
chuyển đổi, thanh điều hướng, tab navigation, stack navigation, v.v.

1.3.2. Đối tượng sử dụng đề tài hướng đến:
Người mua: Đây là nhóm người sử dụng chính của ứng dụng. Người mua muốn tìm
kiếm và mua các sản phẩm hoặc dịch vụ trực tuyến một cách thuận tiện và dễ dàng. Họ
muốn có trải nghiệm mua sắm trực tuyến tốt, tìm kiếm sản phẩm dễ dàng, so sánh giá cả,
đánh giá và đánh giá sản phẩm, và thực hiện thanh tốn an tồn.
Người bán: Đối tượng này bao gồm các doanh nghiệp, cửa hàng, người bán lẻ hoặc
cá nhân muốn tiếp cận thị trường trực tuyến và bán hàng qua ứng dụng. Họ muốn có một
nền tảng để quảng bá, quản lý và bán sản phẩm hoặc dịch vụ của mình. Người bán muốn
có cơ hội tiếp cận đến một số lượng lớn khách hàng tiềm năng, quản lý đơn hàng, cung cấp
hỗ trợ sau bán hàng và tăng doanh thu.
Người quản lý hệ thống: Đối tượng này là nhóm người quản lý và điều hành ứng
dụng mua bán đa nền tảng. Họ có nhiệm vụ quản lý cơ sở dữ liệu, quản lý tài khoản người
dùng, theo dõi hoạt động giao dịch, đảm bảo an ninh và bảo mật dữ liệu, cung cấp hỗ trợ
kỹ thuật và đảm bảo sự ổn định và hiệu suất của hệ thống.


1.4. Phạm vi nghiên cứu
1.4.1. Phạm vi môi trường:
Ứng dụng mua bán đa nền tảng sẽ hoạt động trên các nền tảng di động chính, bao
gồm hệ điều hành iOS và Android.
1.4.2. Phạm vi chức năng:
Đăng nhập và Đăng ký: Ứng dụng cần cung cấp chức năng đăng nhập và đăng ký
cho người dùng. Điều này cho phép người dùng tạo tài khoản mới hoặc đăng nhập bằng
thông tin đăng nhập đã có.
Tìm kiếm và Lọc sản phẩm: Người dùng cần có khả năng tìm kiếm và lọc sản phẩm
theo các tiêu chí như tên, loại, giá, v.v. Điều này giúp người dùng dễ dàng tìm thấy sản
phẩm mà họ quan tâm.
Xem chi tiết sản phẩm: Người dùng có thể xem thơng tin chi tiết, hình ảnh và mơ tả
sản phẩm để có cái nhìn rõ ràng trước khi quyết định mua hàng.

Giỏ hàng: Chức năng giỏ hàng cho phép người dùng thêm sản phẩm vào giỏ hàng,
quản lý số lượng sản phẩm và tiến hành thanh toán.
Thanh toán: Ứng dụng cần tích hợp các phương thức thanh tốn trực tuyến an tồn
để người dùng có thể thanh tốn cho đơn hàng của mình.
Đơn hàng và Vận chuyển: Người dùng cần có khả năng xem và quản lý đơn hàng
của mình, bao gồm thơng tin vận chuyển và trạng thái giao hàng.


CHƯƠNG 2: KIẾN THỨC NỀN TẢNG
2.1. React native

Hình 2.1: React Native
React Native là các đoạn code đã được viết sẵn (framework) do công ty công nghệ
Facebook phát triển. Các lập trình viên React Native là người sử dụng những framework
này để phát triển nên các hệ thống, nền tảng ứng dụng trên các hệ điều hành như IOS và
Android. Ngôn ngữ lập trình được sử dụng nhiều nhất là Javascript.
Sự ra đời của React Native đã giải quyết được bài tốn về hiệu năng và sự phức tạp
khi trước đó người ta phải dùng nhiều loại ngôn ngữ native cho mỗi nền tảng di động.
Chính vì thế lập trình React Native sẽ giúp tiết kiệm được phần lớn thời gian và công sức
khi thiết kế và xây dựng nên một ứng dụng đa nền tảng. Javascript phù hợp với rất nhiều
nền tảng khác nhau.


2.2. JavaScript

Hình 2.2: JavaScript
JavaScript là một ngơn ngữ lập trình thơng dịch phía client (thơng thường chạy trong
trình duyệt web) hoặc phía server (với Node.js). Nó được sử dụng rộng rãi để tạo ra các
ứng dụng web động, tương tác và đáp ứng.
Ban đầu, JavaScript được phát triển để thực hiện các tính tốn đơn giản trên trang

web và cung cấp các hiệu ứng động. Tuy nhiên, với sự phát triển của web, JavaScript đã
trở thành một ngôn ngữ mạnh mẽ cho phép viết ứng dụng web phức tạp hơn.
JavaScript có cú pháp dễ học và linh hoạt, cho phép lập trình viên tương tác với các
phần tử trong trang web, thay đổi nội dung, xử lý sự kiện và giao tiếp với máy chủ để trao
đổi dữ liệu.
Với JavaScript, bạn có thể thực hiện các tác vụ như kiểm tra dữ liệu đầu vào, xử lý
sự kiện người dùng, thay đổi nội dung trang web động, tạo hiệu ứng đồ họa, giao tiếp với
máy chủ và nhiều hơn nữa.
JavaScript cũng có nhiều thư viện và frameworks phổ biến như React, Angular và
Vue.js, giúp phát triển ứng dụng web phức tạp một cách dễ dàng và hiệu quả.