1. Trang chủ
  2. » Giáo Dục - Đào Tạo

Xây dựng website bán sách điện tử

96 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

Định dạng
Số trang 96
Dung lượng 3,9 MB

Các công cụ chuyển đổi và chỉnh sửa cho tài liệu này

Nội dung

1.6 Nhiệm vụ của đề tài Đề tài “Xây dựng 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 đố

Trang 1

ĐẠI HỌC QUỐC GIA THÀNH PHỐ HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

BÁO CÁO ĐỒ ÁN 1 XÂY DỰNG WEBSITE BÁN SÁCH ĐIỆN TỬ

Giảng viên hướng dẫn: ThS Trần Thị Hồng Yến Sinh viên thực hiện: Trần Lương Nguyên 19521922

Nguyễn Quốc Dũng 19521396

Thành phố Hồ Chí Minh, 10 tháng 06 năm 2022

Trang 2

Đề tài được nhóm thực hiện trong khoảng thời gian 3 tháng, các thành viên nhóm lần đầu tiếp cận các công nghệ mới, bước đầu đi vào thực tế nên còn nhiều hạn chế về kiến thức cũng như kinh nghiệm thực tiễn Do vậy, chắc chắn không thể tránh khỏi những sai sót, nhóm rất mong nhận được những sự chỉ bảo, ý kiến đóng góp quý báu của cô và các bạn học cùng lớp để chúng em có thể bổ sung, cải tiến sản phẩm cũng như nâng cao kiến thức, hoàn thiện bản thân và tích lũy thêm cho bản thân nhiều kinh nghiệm, phục vụ tốt hơn cho công việc thực tế sau này

Chúng em xin chân thành cảm ơn!

Nhóm sinh viên thực hiện

Sinh viên 1 Sinh viên 2

Trần Lương Nguyên Nguyễn Quốc Dũng

Trang 3

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

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

………

Giảng viên hướng dẫn

ThS Trần Thị Hồng Yến

Trang 4

ĐỀ CƯƠNG CHI TIẾT Tên dề tài: Xây dựng website bán sách điện tử

Cán bộ hướng dẫn: ThS Trần Thị Hồng Yến

Thời gian thực hiện: Từ ngày 21/2/2022 đến ngày 10/6/2022

Sinh viên thực hiện:

Trần Lương Nguyên - 19521922

Nguyễn Quốc Dũng - 19521396

Nội dung đề tài:

1 Giới thiệu bài toán

Hiện nay với sự phát triển vượt bậc của internet cũng như hệ thống vận tải logictics thì các ngành nghề kinh doanh, thương mại điện tử đang ngày càng phát triển Các công ti, tập đoàn sẵn sàng chi lượng lớn tiền vào ngành này

Hệ thống thương mại điện tử hiện nay có nhiều sự vượt trội hơn so với các ngành nghề thương mại truyền thống Chỉ với vài thao tác đơn giản trên các thiết bị thông minh người dùng dễ dàng lựa chọn các sản phẩm mình mong muốn, chúng sẽ được vận chuyển đến tận nhà của họ

Khi xã hội ngày càng phát triển, nhu cầu học tập của con người ngày càng được chú trọng Nhu cầu tra cứu, tìm kiếm tài liệu là vô cùng lớn Với tình hình dịch bệnh Covid-19 diễn ra hết sức phức tạp, người dân buộc phải lựa chọn hình thức học tập và làm việc trực tuyến Nhu cầu tìm kiếm tài liệu lại càng lớn hơn Hiểu được nhu cầu đó nhóm chúng em quyết định lựa chọn đề tài “Xây dựng website bán sách điện tử” để phục vụ nhu cầu tìm kiếm và mua tài liệu, sách, truyện của người dùng

2 Mục tiêu

Xây dựng được website bán sách điện tử với nội dung phong phú, giao diện thân thiện, bố cục được sắp xếp hợp lí thân thiện với người dùng

Trang 5

Xây dựng website quản trị cho nhân viên với các chức năng quản lý thông tin đa dạng và tiện dụng

3 Phạm vi

Phạm vi môi trường: Triển khai sản phẩm trên môi trường web

Phạm vi chức năng:

- Đăng nhập, đăng kí tài khoản

- Quản lí danh mục, thể loại sách

- Quản lí sách

- Thống kê

- Tìm kiếm, tra cứu sách

- Thêm đánh giá, nhận xét

- Thêm vào giỏ hàng, thanh toán

- Quản lí tài khoản

4 Đối tượng:

Website dành cho người dung có nhu cầu tìm kiếm, mua sách, tài liệu có bản quyền và hỗ trợ các nhà sách tiếp cạnh đên các đối tượng người dùng trực tiếp

5 Phương pháp thực hiện:

- Tìm hiểu về Nodejs, expressJs, ReactJs, MongoDB, TaiwindCss

- Khảo sát thực trạng các website bán sách đang có trên thị trường, từ đó

phân tích, xác định các yêu cầu cụ thể của đề tài

- Phân tích thiết kế hệ thống và xây dựng website

- Tìm hiểu về thiết kế UX/UI và tiến hành thiết kế giao diện cho website

- Xây dựng website cho người dung và nhân viên

- Tiến hành triển khai và kiểm thử

6 Công nghệ dự kiến sử dụng:

- Back-end: NodeJs, ExpressJs

- DataBase: MongoDB, Cloudinary

- Front-end: ReactJs, Redux, TaiwindCss

7 Kết quả mong đợi

Trang 6

- Nắm bắt và ứng dụng được các công nghệ mà nhóm tìm hiểu để xây dựng

hoàn thiện sản phẩm đề tài

- Hiểu rõ các nghiệp vụ, chức năng của một website bán sách trực tuyến

- Ứng dụng được các kiến thức đã học về phân tích và thiết kế hệ thống

phần mềm vào việc xây dựng và triển khai website sản phẩm đề tài

- Có thể mở rộng thêm các chức năng mới cho website sản phẩm đề tài để

đáp ứng nhu cầu mới trong tương lai

Kế hoạch thực hiện:

Trần Lương Nguyên Nguyễn Quốc Dũng

21/2/2022 – 28/2/2022 Tìm hiểu đề tài, xác định các

chức năng của hệ thống

Tìm hiểu đề tài, xác định các chức năng của hệ thống

28/2/2022 – 7/3/2022

Tìm hiểu, nghiên cứu công nghệ áp dụng trong sản phẩm đồ án

Tìm hiểu, nghiên cứu công nghệ áp dụng trong sản phẩm

liệu, phác thảo layout giao

Xây dựng chức năng đăng kí, đăng nhập và chỉnh sửa tài khoản phía front-end 28/3/2022 – 4/4/2022 Xây dựng chức năng thêm

sách phía back-end

Xây dựng chức năng thêm sách phía front-end

Trang 7

4/3/2022 – 11/4/2022 Xây dựng chức năng tìm

kiếm sách phía back-end

Xây dựng chức năng tìm kiếm sách phía front-end 11/4/2022 – 18/4/2022 Xây dựng chức năng giỏ

hàng phía back-end

Xây dựng chức năng giỏ hàng

phía front-end 18/4/2022 – 25/4/2022 Xây dựng chức năng mua

hàng phía back-end

Xây dựng chức năng mua hàng phía front-end 25/4/2022 – 2/5/2022 Xây dựng chức năng đánh

giá, nhận xét sách phía

back-end

Xây dựng chức năng đánh giá, nhận xét sách phía front-

end 2/5/2022 – 9/5/2022 Xây dựng chức năng quản lí

thể loại phía back-end

Xây dựng chức năng quản lí thể loại phía front-end 9/5/2022 – 16/5/2022 Xây dựng chức năng quản lí

tác giả phía back-end

Xây dựng chức năng quản lí tác giả phía front-end 16/5/2022 – 23/5/2022 Xây dựng chức năng

dashboard phía back-end

Xây dựng chức năng dashboard phía front-end 25/5/2022 – 2/6/2022 Kiểm thử và hoàn thiện báo

(Ký tên và ghi rõ họ tên)

Trần Lương Nguyên Nguyễn Quốc Dũng

Trang 8

MỤC LỤC

LỜI CẢM ƠN 2

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

ĐỀ CƯƠNG CHI TIẾT 4

MỤC LỤC 8

DANH MỤC BẢNG 12

DANH MỤC HÌNH ẢNH 14

Chương 1 - TỔNG QUAN VỀ ĐỀ TÀI 1

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

1.1.1 Tầm quan trọng sách 1

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

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

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

1.4 Phạm vi nghiên cứu 3

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

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

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

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

2.1 Tổng quan về ReactJs 4

2.1.1 Giới thiệu 4

2.1.2 Cách hoạt động 4

2.1.3 Ưu nhược điểm 5

2.2 Tổng quan về Redux Toolkit 7

2.2.1 Giới thiệu 7

2.2.2 Cách sử dụng 7

2.2.3 Ưu điểm 7

2.3 Tổng quan về Ant design 8

Trang 9

2.3.2 Cách hoạt động 8

2.3.3 Ưu nhược điểm 8

2.4 Tổng quan về NodeJs 8

2.4.1 Giới thiệu 8

2.4.2 Khả năng sử dụng 9

2.4.3 Thành phần 9

2.4.4 Lợi ích của 10

2.4.5 Trường hợp sử dụng 10

2.5 Tổng quan về ExpressJs 11

2.5.1 Giới thiệu 11

2.5.2 Cấu trúc của ExpressJs 11

2.5.3 Ưu nhược điểm của ExpressJs 12

2.6 Tổng quan về JSON Web Token 13

2.6.1 Giới thiệu 13

2.6.2 Cấu trúc của JWT 13

2.6.3 Trường hợp sử dụng 14

2.7 Tổng quan về MongoDB 14

2.7.1 Giới thiệu 14

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

2.7.3 Ưu nhược điểm 16

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

3.1 Mô tả yêu cầu 17

3.1.1 Yêu cầu chức năng 17

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

3.2 Kiến trúc hệ thống 20

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

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

Chương 4 - HIỆN THỰC HỆ THỐNG 25

4.1 Sơ đồ Use case 25

4.1.1 Đăng kí 26

4.1.2 Xác thực tài khoản 26

Trang 10

4.1.3 Đăng nhập 27

4.1.4 Quên mật khẩu 28

4.1.5 Cập nhật mật khẩu 29

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

4.1.7 Tìm kiếm sách 30

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

4.1.9 Mua hàng 31

4.1.10 Xác thực đơn hàng 31

4.1.11 Nhận xét đánh giá 32

4.1.12 Quản lí đơn hàng 32

4.1.13 Thêm sách mới 33

4.1.14 Nhập sách 34

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

4.1.16 Nhập sách 35

4.1.17 Thêm thể loại mới 36

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

4.1.19 Xóa thể loại 37

4.1.20 Thêm tác giả 39

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

4.1.22 Xóa tác giả 41

4.1.23 Thêm mã giảm giá 43

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

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

4.1.26 Xác nhận đơn hàng 45

4.1.27 Hủy đơn đặt hàng 46

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

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 47

4.1.30 Báo cáo 48

4.2 Thiết kế dữ liệu 49

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

4.2.2 Dữ liệu người dùng 50

Trang 11

4.2.3 Dữ liệu sách 51

4.2.4 Dữ liệu thể loại 52

4.2.5 Dữ liệu tác giả 53

4.2.6 Dữ liệu đánh giá 54

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

4.2.8 Dữ liệu đơn hàng 55

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

4.3 Thiết kế giao diện 56

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

4.3.2 Giao diện của admin 66

KẾT LUẬN 78

❖ Đánh giá 78

➢ Thuận lợi 78

➢ Khó khăn 78

❖ Kết quả đạt được 78

➢ Ưu điểm 78

➢ Nhược điểm 78

❖ Hướng phát triển 79

TÀI LIỆU THAM KHẢO 80

Trang 12

DANH MỤC BẢNG

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Trang 13

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Trang 14

DANH MỤC HÌNH ẢNH

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

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

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

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

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

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

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

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

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

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

Hình 4-6 Giao diện đăng nhập 58

Hình 4-7 Trang thể loại 59

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

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

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

Hình 4-11 Trang chi tiết sách 4 61

Hình 4-12 Trang đơn hàng 62

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

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

Hình 4-15 Trang khôi phục mật khẩu 2 64

Hình 4-16 Trang giỏ hàng 64

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

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

Hình 4-19 Trang admin 1 66

Hình 4-20 Trang admin 2 67

Hình 4-21 Trang thêm sách 68

Hình 4-22 Trang xem sách 68

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

Hình 4-24 Trang nhập hàng 69

Trang 15

Hình 4-25 Giao diện form nhập sách 70

Hình 4-26 Trang quản lí thể loại 70

Hình 4-27 Trang quản lí tác giả 71

Hình 4-28 Trang quản lí đơn hàng 72

Hình 4-29 Giao diện xem chi tiết đơn hàng 72

Hình 4-30 Giao diện xác nhận và từ chối đơn hàng 73

Hình 4-31 Trang xác thực đơn hàng của khách chưa đăng kí tài khoản 74

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 74

Hình 4-33 Giao diện xác thực đơn hàng của khách hàng chưa đăng kí tài khoản 75

Hình 4-34 Trang quản lí mã khuyến mãi 76

Hình 4-35 Giao diện thêm mới mã khuyến mãi 76

Hình 4-36 Giao diện chỉnh sửa thông tin mã khuyến mãi 77

Hình 4-37 Giao diện xóa mã giảm giá 77

Trang 16

Chương 1 - TỔNG QUAN VỀ ĐỀ TÀI 1.1 Giới thiệu về đề tài

1.1.1 Tầm quan trọng sách

Từ trước đến nay sự phát triển của nhân loại luôn gắn liền với sách Sách được con người sử dụng để lưu giữ lại những kiến thức và truyền lại cho các thế hệ sau Sách chứa đựng những thông tin, giá trị vật chất và tinh thần của nhân loại, chứa đựng những tình cảm vào trong những vấn đề của cuộc sống Mỗi cuốn sách lại là những chủ đề, lĩnh vực khác nhau nhưng đều với mục đích hướng tới cho bạn đọc những tri thức mới, giá trị nhân loại

Sách chứa đựng nguồn kiến thức khổng lồ và giúp con người giao lưu với thế giới bên ngoài, tiếp cận với nền văn minh của nhân loại, nhờ có sách mà xã hội mới có thể phát triển được Cho dù xã hội có phát triển tới đâu thì những giá trị to lớn mà sách đem lại cho con người vẫn không thể nào xóa bỏ được

Việc gìn giữ những giá trị lịch sử cho đời sau và là nguồn tri thức quý giá thì chỉ có sách mới có thể đem lại cho con người được Sách đóng vai trò tất yếu trong quá trình phát triển của xã hội loài người

Đi cùng với sự phát triển của xã hội, nhu cầu về sách ngày càng lớn Sách không chỉ được sử dụng để phục vụ mục đích học tập và tra cứu thông tin mà sách còn được sử

Trang 17

sách truyền thống càng bộc lộ nhiều điểm yếu như nguồn sách thiếu phong phú, khó tiếp cận đối với các khách hàng ở xa Nắm bắt được các yếu tố trên nhóm chúng em quyết định lựa chọn để tài “Xây dựng website bán sách điện tử” để phục vụ cho nhu cầu tìm kiếm và mua các đầu sách chính thống có bản quyền của sách hàng

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

Hiện nay trên thị trường có nhiều website bán sách online như “fahasa.com, cachep.vn, bookbuy.vn” nhưng hầu hết các website vẫn chưa tập trung hoàn toàn vào việc bán sách mà thường kết hợp với một vài ngành hàng khác như đồ chơi, văn phòng phẩm Do vậy nhóm quyết định xây dựng một website chỉ chuyên phục vụ khách hàng tìm kiếm, mua sách

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

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

❖ Đối tượng trong phạm vi đề tài hướng đến:

o Các nhà sách mong muốn mở rộng việc kinh doanh của mình sang hình thức online

o Các khách hàng mong muốn tìm kiếm, tra cứu mà mua sách theo hình thức

online

Trang 18

1.4 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

1.5 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ó

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

Đề tài “Xây dựng 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

1.7 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

Trang 19

Chương 2 - CƠ SỞ LÝ THUYẾT 2.1 Tổng quan về ReactJs

2.1.1 Giới thiệu

React.js là một thư viện Javascript đang nổi lên trong những năm gần đây với xu hướng Single Page Application Trong khi những framework khác cố gắng hướng đến một mô hình MVC hoàn thiện thì React nổi bật với sự đơn giản và dễ dàng phối hợp với những thư viện Javascript khác

React là một thư viện UI phát triển tại Facebook để hỗ trợ việc xây dựng những thành phần (components) UI có tính tương tác cao, có trạng thái và có thể sử dụng lại được React được sử dụng tại Facebook trong production, và instagram được viết hoàn toàn trên React

Một trong những điểm hấp dẫn của React là thư viện này không chỉ hoạt động trên phía client, mà còn được render trên server và có thể kết nối với nhau React so sánh sự thay đổi giữa các giá trị của lần render này với lần render trước và cập nhật ít thay đổi nhất trên DOM

2.1.2 Cách hoạt động

Với React, chúng ta hoàn toàn có thể viết code HTML bằng Javascript Không giống như những DOM element của trình duyệt, React element là những “plain object” (đối tượng đơn giản) React DOM giữ vai trò cập nhật DOM để phù hợp với các React element

Trang 20

2.1.3 Ưu nhược điểm

2.1.3.1 Ưu điểm

❖ Dễ tiếp cận

React là thư viện khá dễ tiếp cận và sử dụng Trong mô hình MVC View-control) thì React đảm nhận nhiệm vụ ‘V’ (View) Nó hoạt động bằng cách kết hợp HTML và Javascript thuần, vì thế cú pháp trong React khá là dễ hiểu

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

Việc sử dụng Real DOM cấu trúc dạng tree với kích thước lớn, khi thay đổi gía trị, cây DOM được cập nhật lại toàn bộ gây tốn thời gian và rủi ro

Để giải quyêt vấn đề trên, React sử dụng Virual DOM (DOM ảo), mỗi khi render thì React sẽ tạo ra một DOM ảo và lưu nó vào trong bộ nhớ, khi thay đổi state của component thì DOM ảo sẽ được cập nhật lại và so sách với DOM ảo cũ (được đồng bộ với DOM thật trước đó) bằng thuật toán “diffing”, để tìm ra những node cần thay đổi và cuối cùng cập nhật lại những node đó trên DOM thật Vì thế quá trình cập nhật lại cây DOM sẽ không bị gián đoạn và làm chậm phản hồi, giúp website chạy mượt mà và nhanh hơn

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

React giúp lập trình viên hoàn toàn có thể sử dụng lại các component đã khai báo trước đó để phát triển các ứng dụng khác nhau có cùng chứ năng Đây là một điểm mạnh cũng như lợi thế của ReactJS giúp các lập trình viên có thể dễ thở hơn trong các dự án

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

Khi nhắc đến React ta không thể bỏ qua JSX (Javascript + XML), đây là cú pháp mở rộng gần giống XML, người dùng có thể lập trình React bằng cú pháp của XML thay vì sử dụng Javascript mà không làm thay đổi ý nghĩa của Javascript, nó giúp chúng ta dễ dàng định nghĩa và quản lý các component phức tạp cũng như việc dễ dàng đọc hiểu được ý nghĩa của các component hơn

Trang 21

❖ Thân thiện với SEO

Một vai trò quan trọng trong tối ưu SEO là tốc độ tải trang React có thể tăng tốc dộ tải trang của ứng dụng thông qua Virtual DOM, nên rất có hiệu quả với việc cải thiện kết quả SEO

Mặt khác, React có khả năng tạo ra các giao diện người dùng có thể truy cập vào các công cụ tìm kiếm Tuy nhiên React không thể cải thiện 100% khả năng SEO của trang web, còn cần phải phụ thuộc vào các thư viện bổ sung, nội dung trang web, định tuyến, tương tác người dùng, …

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

Như đã giới thiệu ở trên, React chỉ là một thư viện giúp tạo ra giao diện người dùng (View) nên có thể dễ dàng tích hợp vào các framework khác như Angular, BackbooneJS, …

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ử

UI, chức năng cũng được đơn giản hóa theo từng component Bằng cách tích hợp các thư viện kiểm thử như Jest, Enzyme, React Testing Library … sẽ giúp cho việc kiểm thử dễ dàng hơn

2.1.3.2 Nhược điểm

❖ Reactjs chỉ phục vụ cho tầng View React chỉ là View Library nó không phải là một MVC framework như những framework khác Đây chỉ là thư viện của Facebook giúp render ra phần view Vì thế React sẽ không có phần Model và Controller, mà phải kết hợp với các thư viện khác React cũng sẽ không có 2-way binding hay là 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 khá nặng nếu so với các framework khác React có kích thước tương tương với Angular (Khoảng 35kb so với 39kb của Angular) Trong khi đó Angular là một framework hoàn chỉnh

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

Trang 22

2.2 Tổng quan về Redux Toolkit

2.2.1 Giới thiệu

Redux là công cụ quản lý state phổ biến nhưng có nhiều trang cãi vì redux dài dòng

và khó sử dụng Vì để tạo ra một store hoàn chỉnh thì phải qua khá nhiều bước, tạo nhiều file với các đoạn code lặp lại khá nhiều, ngoài ra redux không hề xây dựng một quy chuẩn rõ ràng cho việc viết logic, cũng như ngoài redux thì đôi khi ta cần cài đặt thêm một số thư viện nữa như middleware, selectors thì mới có thể viết hoàn chỉnh logic quản lý state

Nên là redux-toolkit (là một package) sinh để giải quyết phần lớn những vấn đề kể trên, được phát triển bởi chính chủ reduxjs team, giúp chúng ta viết code redux nhanh gọn, hoàn chỉnh theo một quy chuẩn thống nhất

2.2.2 Cách sử dụng

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

@reduxjs/toolkit

Tạo slice file:

- 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

2.2.3 Ưu điểm

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

Trang 23

2.3 Tổng quan về Ant design

2.3.1 Giới thiệu

Ant design là tập hợp các components của React được xây dựng theo chuẩn thiết kế của Ant UED Team Tương tự như chuẩn Material Design, Ant cung cấp hầu hết các component thông dụng trong ứng dụng web hiện đại, như Layout, Button, Icon, DatePicket, … Bên cạnh đó Ant cũng có những component riêng thú vị, như LocaleProvider cho phép thay đổi ngôn ngữ trên toàn ứng dụng

mà đẹp, gọn gàng, bắt mắt dễ kết hợp với bất kì thành phần ui nào trong giao diện của chúng ta

NodeJS là một nền tảng được xây dựng trên JavaScript runtime của Chrome với mục đích xây dựng các ứng dụng mạng nhanh chóng và có thể mở rộng được một cách dễ

Trang 24

dàng hơn NodeJS sử dụng mô hình I/O lập trình theo sự kiện, non-blocking, do đó nodeJS khá gọn nhẹ và hiệu quả - công cụ hoàn hảo cho các ứng dụng chuyên sâu về

dữ liệu theo thời gian thực chạy trên các thiết bị phân tán

NodeJS là môi trường runtime mã nguồn mở đa nền tảng, được sử dụng để phát triển các ứng dụng mạng và ứng dụng server-side Các ứng dụng NodeJS được viết bằng JavaScript và có thể chạy trong NodeJS runtime trên OS X, Microsoft Windows và Linux

NodeJS cũng cung cấp một thư viện bao gồm rất nhiều các module JavaScript khác nhau nhằm đơn giản hóa việc phát triển các ứng dụng web, qua đó giảm thiểu tình trạng

sử dụng quá nhiều Node.js

2.4.2 Khả năng sử dụng

Là một nền tảng phát triển ứng dụng mạnh mẽ, Nodejs có thể thỏa mãn mọi nhu cầu lập trình, phát triển ứng dụng Các chuyên gia trong lĩnh vực lập trình, công nghệ khuyên dùng Nodejs khi phát triển các ứng dụng như Websocket server, Fast File Upload Client,

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

Trang 25

2.4.4 Lợi ích của

2.4.4.1 Ưu điểm

❖ Ứng dụng Nodejs phần đông đều được viết bằng ngôn ngữ lập trình javascript – một ngôn ngữ thông dụng, được sử dụng rộng rãi và chạy được trên nhiều trình duyệt, nền tảng, hệ điều hành, …

❖ 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 phát triển bởi Node.js có khả năng xử lý nhiều yêu cầu truy cập cùng lúc, ‘cứu’ website của bạn khỏi nguy cơ bị ‘sập’ khi lượng truy cập quá nhiều

2.4.4.2 Nhược điểm

❖ NodeJS 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… Bởi vì NodeJS được viết bằng C++ & Javascript, nên phải thông qua thêm 1 trình biên dịch của NodeJS

do vậy sẽ tốn thời gian hơn

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

2.4.5 Trường hợp sử dụng

❖ Dùng chung một ngôn ngữ: NodeJS sẽ là lựa chọn chính xác để sử dụng nếu

dự án của bạn liên quan đến những thứ như MongoDB, ExpressJs, AngularJs, BackBoneJs, ReactJs, … Điều này giúp chúng ta dễ dàng có hệ thống hoàn toàn

sử dụng JavaScript

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

Trang 26

❖ Giao thức khác http: NodeJS hỗ trợ xây dựng những ứng dụng đòi hỏi các giao

thức kết nối khác chứ không phải chỉ có http Với việc hỗ trợ giao thức tcp,

nodeJS cho phép bạn có thể xây dựng bất kỳ một giao thức custom nào đó một

cách dễ dàng

2.5 Tổng quan về ExpressJs

2.5.1 Giới thiệu

ExpressJS là một framework ứng dụng web có mã nguồn mở và miễn phí được xây

dựng trên nền tảng Node.js ExpressJS được sử dụng để thiết kế và phát triển các ứng

dụng web một cách nhanh chóng Để hiểu ExpressJS, người dùng chỉ cần phải biết

JavaScript, do đó nên việc xây dựng các ứng dụng web và API trở nên đơn giản hơn đối

với các lập trình viên và nhà phát triển đã thành thạo JavaScript trước đó

2.5.2 Cấu trúc của ExpressJs

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

- Root

+ 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

Trang 27

- 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: Thư mục này sẽ chứa tất cả phần mềm trung gian mà bạn đã tạo Các chức năng này có thể sử dụng 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

2.5.3.1 Ưu điểm

❖ 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

2.5.3.2 Nhược điểm

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

Trang 28

2.6 Tổng quan về JSON Web Token

2.6.1 Giới thiệu

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

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

2.6.2 Cấu trúc của JWT

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

<base64-encoded header > <base64-encoded payload > <base64-encoded signature >

- Reserved claims: Đây là một số metadata được định nghĩa trước, trong đó một số metadata là bắt buộc, số còn lại nên tuân theo để JWT hợp lệ và đầy

đủ thông tin: iss (issuer), iat (issued-at time) exp (expiration time), sub (subject), aud (audience), jti (Unique Identifier cho JWT),

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

- Private Claims: Claims tự định nghĩa (không được trùng với Reserved Claims và Public Claims), được tạo ra để chia sẻ thông tin giữa 2 parties đã thỏa thuận và thống nhất trước đó

Trang 29

❖ Signature

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

2.6.3 Trường hợp sử dụng

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

Authentication: Tình huống thường gặp nhất, khi user logged in, mỗi request tiếp

đó đều kèm theo chuỗi token JWT, cho phép người dùng có thể truy cập đường dẫn, dịch vụ và tài nguyên được phép ứng với token đó Single Sign On cũng là một chức năng có sử dụng JWT một cách rộng rãi, bởi vì chuỗi JWT có kích thước đủ nhỏ để đính kèm trong request và sử dụng ở nhiều hệ thống thuộc các domain khác nhau

Information Exchange: JSON Web Token cũng là một cách hữu hiệu và bảo mật

để trao đổi thông tin giữa nhiều ứng dụng, bởi vì JWT phải được ký (bằng cặp public / private key), bạn có thể chắc rằng người gửi chính là người mà họ nói rằng họ là (nói tóm tắt hơn là không hoặc khó để mạo danh bằng JWT), ngoài ra, chữ ký cũng được tính toán dựa trên nội dung của header và nội dung payload, nhờ đó, bạn có thể xác thực được nội dung là nguyên bản, chưa được chỉnh sửa hoặc can thiệp Tuy nhiên, một lưu

ý hết sức quan trọng là do cấu trúc của JWT đơn giản nên JWT có thể dễ dàng bị decode,

do vậy, chúng ta không nên dùng JWT để truyền các thông tin nhạy cảm

2.7 Tổng quan về MongoDB

2.7.1 Giới thiệu

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

Vì thế, MongoDB sẽ tránh cấu trúc table-based của relational database để thích ứng với các tài liệu như JSON có một schema rất linh hoạt gọi là BSON MongoDB sử dụng lưu trữ dữ liệu dưới dạng Document JSON nên mỗi một collection sẽ các các kích cỡ

và các document khác nhau Các dữ liệu được lưu trữ trong document kiểu JSON nên truy vấn sẽ rất nhanh

Trang 30

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

2.7.2.1 Database

Database là nơi chứa các Collection, giống với cơ sở dữ liệu RDMS chúng chứa các bảng Mỗi Database có một tập tin riêng lưu trữ trên bộ nhớ vật lý Một mấy chủ MongoDB có thể chứa nhiều Database

2.7.2.6 _id

Là trường bắt buộc có trong mỗi document Trường _id đại diện cho một giá trị duy nhất trong document MongoDB Trường _id cũng có thể được hiểu là khóa chính trong document Nếu bạn thêm mới một document thì MongoDB sẽ tự động sinh ra một _id đại diện cho document đó và là duy nhất trong cơ sở dữ liệu MongoDB

Trang 31

2.7.3 Ưu nhược điểm

❖ Mọi thay đổi về dữ liệu mặc định đều chưa được ghi xuống ổ cứng ngay lập tức

vì vậy khả năng bị mất dữ liệu từ nguyên nhân mất điện đột xuất là rất cao

Trang 32

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

3.1 Mô tả yêu cầu

3.1.1 Yêu cầu chức năng

Website bán sách điện tử được thiết kế nhằm giúp các nhà sách đang kinh doanh theo hình thức truyền thống có thể tiếp cập các đối tượng khách hàng thường xuyên mua sắm online Ứng dụng giúp các khách hàng online mua sắm sách một cách tiện lợi, nhanh chóng Giúp nhà sách có thể quản lí các hoạt động kinh doanh online của mình

Để đáp ứng được các vấn đề trên nhóm đã xác định được một số chức năng chính như sau:

Khách hàng

Đăng kí tài khoản

Khách hàng có thể đăng kí tài khoản để sử dụng các dịch vụ của website bằng email cá nhân của mình Hệ thông tiếp nhận yêu cầu đăng kí và gửi email xác nhận cho khách hàng

Đăng nhập

Khách hàng sau khi đăng kí và xác nhận email xác thực có thể sử dụng tài khoản này

để đăng nhập và sử dụng các dịch vụ mà website cung cấp

Quên mật khẩu

Trong trường hợp khách hàng quên mật khẩu tài khoản đăng nhập Họ có thể gửi yêu cầu “quên mật khẩu” lên hệ thống Hệ thống tiếp nhận yêu cầu, gửi email xác nhận

và cho phép người dùng tạo mới mật khẩu khi email gửi đi đã được khách hàng xác nhận

Chỉnh sửa thông Khách hàng có thể chỉnh sửa thông tin cá

Trang 33

tin tài khoản nhận cũng như mật khẩu tài khoản của

mình

Giỏ sách

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

Mua sách

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í

- Đối với các khách hàng chưa đăng kí tài khoản: Hệ thống sẽ gửi một email xác nhận đơn đặt hàng tới cho khách hàng

và sẽ chuyển tới nhân viên quản lí sau khi khách hàng đã xác nhận email được

hệ thống gửi đi

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í

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 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 các mã giảm giá

Trang 34

Quản lí đơn hàng

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

* Trong trường hợp đơn hàng đã được thanh toán thông qua cổng paypal bị nhân viên quản lí từ chối, thì số tiền đã thanh toán sẽ được hoàn trả về 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ó thể tra cứu, xem và xác thực các đơn đặt hàng được tạo bởi các khách hàng mới chưa đăng kí tài khoản trên

hệ thống

Thống kê

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

- Tính bảo mật: Phải đảm bảo 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, kiểm soát vận hành hệ thống, giảm thiểu tối đa mức độ rủi ro, rò rỉ thông tin như các chức năng xác thực người dùng (đăng nhập, đăng ký, quên 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

Trang 35

3.2 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 là một architecture

- 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

Trang 36

- 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

Trang 37

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

Folder redux bao gồm :

+ Các file slice là các reducer và action phục vụ lưu và thao tác với global state + File request_api.js dùng để call api (Tất cả các api request được định nghĩa tại đây) + File store.js nơi kết nối các slice(reduce) tới cái app của chúng ta

Trang 38

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

Trang 39

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:

1 Model

Là thành phần dùng để cung cấp dữ liệu, thực hiện kết nối, truy vấn dữ liệu và thao tác với dữ liệu trong database, tương tác với dữ liệu hay 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, điều hướng các yêu cầu từ người dùng, giúp lấy dữ liệu

đúng với những thông tin cần thiết nhờ vào các nghiệp vụ lớp Model cung cấp

và hiển thị các dữ liệu đó ra cho người dùng

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

- 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

Ngoài ra hệ thống Back-End còn sử dụng JSON Web Token (JWT) để xác thực và cấp quyền cho mỗi request từ phía Client nhằm đảm bảo tính bảo mật và an toàn dữ liệu của hệ thống

Trang 40

Chương 4 - HIỆN THỰC HỆ THỐNG 4.1 Sơ đồ Use case

Ngày đăng: 17/08/2022, 21:40

Nguồn tham khảo

Tài liệu tham khảo Loại Chi tiết
[2] ThS. Trần Anh Dũng (2022), Slide công nghệ web và ứng dụng, Khoa Công nghệ phần mềm, Trường ĐH. Công nghệ Thông Tin Sách, tạp chí
Tiêu đề: Slide công nghệ web và ứng dụng
Tác giả: ThS. Trần Anh Dũng
Năm: 2022
[3] ThS. Huỳnh Đức Huy (2019), Slide cơ sỡ dữ liệu, Khoa Hệ thống thông tin, Trường ĐH. Công nghệ Thông Tin Sách, tạp chí
Tiêu đề: Slide cơ sỡ dữ liệu
Tác giả: ThS. Huỳnh Đức Huy
Năm: 2019
[4] Tìm hiểu cơ bản về Node.js – Viblo.asia [Truy cập lần cuối: 20-6-2022]: https://viblo.asia/p/tim-hieu-co-ban-ve-nodejs-E375zeQ1lGW Link
[5] Tổng quan về NodeJS - Một số điểm khác biệt với PHP – Viblo.asia [Truy cập lần cuối: 20-6-2022]:https://viblo.asia/p/tong-quan-ve-nodejs-mot-so-diem-khac-biet-voi-php-1Je5E9945nL Link
[6] Tìm hiểu về json web token (JWT) – Viblo.asia [Truy cập lần cuối: 20-6-2022]: https://viblo.asia/p/tim-hieu-ve-json-web-token-jwt-7rVRqp73v4bP Link
[7] Nodejs best practice - Cấu trúc tốt là components - Phần 1 – anonystick.com [Truy cập lần cuối: 20-6-2022]:https://anonystick.com/blog-developer/nodejs-best-practice-cau-truc-tot-la-components-phan-1-2021060299169462 Link
[8] Express và Node.Js xây dựng cấu trúc một dự án chuẩn? – anonystick.com [Truy cập lần cuối: 20-6-2022]:https://anonystick.com/blog-developer/project-express-va-nodejs-co-kien-truc-tot-la-nhu-the-nao-2021040967257708 Link
[9] JWT là gì? Toàn tập về JWT từ cơ bản đến chi tiết – tino.org [Truy cập lần cuối: 20-6-2022]:https://wiki.tino.org/jwt-la-gi/ Link
[10] Tổng quan về MongoDB - MongoDB là gì? - freetuts.net [Truy cập lần cuối: 20-6-2022]:https://freetuts.net/tong-quan-ve-mongodb-203.html Link
[12] NodeJs &amp; ExpressJs [Truy cập lần cuối: 20-6-2022]: https://www.youtube.com/watch?v=z2f7RHgvddc&amp;list=PL_-VfJajZj0VatBpaXkEHK_UPHL7dW6I3❖ Tài liệu tiếng Anh Link
[13] Mongoose v6.3.5 - mongoosejs.com [Truy cập lần cuối: 20-6-2022]: https://mongoosejs.com/ Link
[14] Documentation – Nodejs.org [Truy cập lần cuối: 20-6-2022]: https://nodejs.org/en/docs/ Link
[15] Node.js SDK – Node.js Upload + Image, Video Transformations - cloudinary.com [Truy cập lần cuối: 20-6-2022]:https://cloudinary.com/documentation/node_integration Link
[16] React – A JavaScript library for building user interfaces – reactjs.org [Truy cập lần cuối: 20-6-2022]:https://reactjs.org/ Link
[17] Node.js SDK – Node.js Upload + Image, Video Transformations - cloudinary.com [Truy cập lần cuối: 20-6-2022]:https://cloudinary.com/documentation/node_integration Link
[18] Ant Design - The world's second most popular React UI framework – ant.design [Truy cập lần cuối: 20-6-2022]:https://ant.design/ Link
[19] Tailwind CSS - Rapidly build modern websites without ever leaving your HTML - tailwindcss.com [Truy cập lần cuối: 20-6-2022]:https://tailwindcss.com/ Link
[1] Trần Thị Hồng Yến (2022), Temple báo cáo môn học, Khoa Công nghệ Phần Mềm, Trường ĐH. Công Nghệ Thông Tin Khác
[11] Expressjs là gì? Tại sao nên sử dụng Expressjs trong lập trình? - itnavi.com.vn [Truy cập lần cuối: 20-6-2022]:https:///blog/expressjs-la-gi/?amp Khác

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

w