Xây dựng website bán hàng điện tử trên framework angular và laravel

Điều kiện trước Người dùng đã đăng nhập với quyền Admin Bảng 2.4 Bảng đặt tả Use case quản lý loại hàng Biểu đồ đặc tả Use Case quản lý sản phẩm Hình 5 Biểu đồ Use case quản lý sản phẩm

Trang 1

TRƯỜNG ĐẠI HỌC SƯ PHẠM

KHOA TIN HỌC

KHÓA LUẬN TỐT NGHIỆP

NGÀNH: CÔNG NGHỆ THÔNG TIN

ĐỀ TÀI:

XÂY DỰNG WEBSITE BÁN HÀNG ĐIỆN TỬ

TRÊN FRAMEWORK ANGULAR VÀ LARAVEL

Người hướng dẫn: TS.NGUYỄN TRẦN QUỐC VINH

Sinh viên thực hiện: PHAN ĐINH THIÊN PHÚC

Mã sinh viên: 312022161136

Lớp: 16CNTT1

Đà Nẵng, 06/2020

Trang 2

NHẬN XÉT CỦA NGƯỜI HƯỚNG DẪN

Đà Nẵng, ngày … tháng … năm 2020

Giáo viên hướng dẫn

Nguyễn Trần Quốc Vinh

Trang 3

i

Trong suốt thời gian thực hiện và hoàn thành khóa luận này, em đã nhận được sự giúp đỡ và hướng dẫn tận tình của các Thầy, các Cô và các bạn trong Khoa Tin học Trường Đại học Sư Phạm - Đại học Đà Nẵng Em xin gửi lời cảm ơn chân thành và sâu sắc tới các Thầy Cô trong Khoa đã giảng dạy và truyền đạt những kiến thức cần thiết, những kinh nghiệm quý báu cho chúng em có thể thực hiện khóa luận này

Trước tiên, em xin chân thành cám ơn thầy giáo TS.Nguyễn Trần Quốc Vinh giảng viên Khoa Tin học – Trường Đại Học Sư Phạm Đà Nẵng đã chỉ bảo tận tình, giúp đỡ

em trong suốt quá trình học tập và quá trình thực hiện đề tài này

Mặc dù đã có cố gắng hoàn thiện khóa luận trong phạm vi và khả năng cho phép nhưng không tránh khỏi những thiếu sót, rất mong nhận được sự ý kiến đóng góp, nhận xét đánh giá của quý Thầy Cô

Em chân thành cảm ơn!

Trang 4

ii

LỜI CAM ĐOAN

Tôi xin cam đoan:

1 Những nội dung trong báo cáo tốt nghiệp này là do tôi thực hiện dưới sự hướng dẫn trực tiếp của thầy Nguyễn Trần Quốc Vinh

2 Mọi tham khảo dùng trong khóa luận đều được trích dẫn rõ ràng và trung thực tên tác giả, tên công trình, thời gian, địa điểm công bố

3 Mọi sao chép không hợp lệ, vi phạm quy chế đào tạo, hay gian trá, tôi xin chịu hoàn toàn trách nhiệm

Trang 5

iii

MỤC LỤC

LỜI CẢM ƠN i

LỜI CAM ĐOAN ii

MỤC LỤC iii

DANH MỤC HÌNH ẢNH v

DANH MỤC BẢNG BIỂU vi

MỞ ĐẦU 1

1 Tổng quan về đề tài 1

2 Mục tiêu đề tài 1

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

4 Phương pháp thực hiện 1

5 Tiêu chí chức năng của đề tài 2

6 Bố cục của khóa luận 3

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT 4

1.1 Tổng quan về PostgreSQL và PHP 4

1.1.1 Giới thiệu về PostgreSQL 4

1.1.2 PgAdmin 4 4

1.1.3 Ngôn ngữ lập trình PHP 4

1.2 Tổng quản về Framework Angular 5

1.2.1 Giới thiệu về Angular 5

1.2.2 Các đặc tính của của Angular 5

1.2.3 Các tính năng cốt lõi của Angular 5

1.3 Tổng quan về Framework Laravel 6

1.3.1 Sơ lược về Framework Laravel PHP 6

1.3.2 Route trong Laravel Framework 6

1.3.3 Blade template trong Laravel Framework 6

1.3.4 Controller trong Laravel Framework 6

1.3.5 Kết nối cơ sở dữ liệu trong Laravel Framework 6

1.4 Tổng quan API 7

1.4.1 API là gì? 7

1.4.2 Xây dựng RESTful API trên Framework Laravel 7

1.5 Tổng quản về SPA (Single Page Application) 8

1.5.1 SPA là gì ? 8

1.5.2 Ưu điểm khi sử dụng SPA 8

1.5.3 Nhược điểm khi sử dụng SPA 8

Trang 6

iv

CHƯƠNG 2 PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 9

2.1 Phân tích yêu cầu 9

2.1.1 Mô tả bài toán 9

2.1.3 Yêu cầu Chức năng 9

2.1.4 Yêu cầu phi chức năng 9

2.2 Phân tích và thiết kế hệ thống 10

2.2.1 Các tác nhân của hệ thống 10

2.2.4 Sơ đồ Use-case 11

2.2.5 Biểu đồ tuần tự 22

2.2.6 Biểu đồ hoạt động 26

2.2.6 Biểu đồ lớp 31

2.2.7 Thiết kế cơ sở dữ liệu 42

CHƯƠNG 3 TRIỂN KHAI VÀ ĐÁNH GIÁ KẾT QUẢ 51

3.1 Triển khai môi trường làm việc 51

3.1.1 Yêu cầu 51

3.1.2 Thực hiện 51

3.2 Kết quả chương trình 51

KẾT LUẬN 63

1 Đánh giá kết quả 63

1.1 Ưu điểm 63

1.2 Hạn chế 63

2 Hướng phát triển 64

TÀI LIỆU THAM KHẢO 65

Trang 7

v

DANH MỤC HÌNH ẢNH

Hình 1 Biểu đồ Use case tổng quát - Khách 12

Hình 2 Biểu đồ Use case tổng quát – Nhân viên 12

Hình 3 Biểu đồ Use case tổng quát – Admin 12

Hình 4 Biểu đồ Use case quản lý loại hàng 13

Hình 5 Biểu đồ Use case quản lý sản phẩm 13

Hình 6 Biểu đồ Use case quản lý tài khoản 14

Hình 7 Biểu đồ Use case quản lý hóa đơn 14

Hình 8 Biểu đồ Use case quản lý phản hồi 15

Hình 9 Biểu đồ Use case quản lý thông tin cá nhân 15

Hình 10 Biểu đồ Use case phản hồi cho người bán 16

Hình 11 Biểu đồ Use case tìm kiếm 17

Hình 12 Biểu đồ Use case giỏ hàng 17

Hình 13 Biểu đồ Use case mua hàng 18

Hình 14 Biểu đồ Use case quản lý danh mục tin tức 20

Hình 15 Biểu đồ Use case quản lý loại tin tức 20

Hình 16 Biểu đồ Use case quản lý tin tức 21

Hình 17 Biểu đồ tuần tự thêm sản phẩm 22

Hình 18 Biểu đồ tuần tự sửa sản phẩm 22

Hình 19 Biểu đồ tuần tự sửa thông tin cá nhân 23

Hình 20 Biểu đồ tuần tự tìm kiếm 23

Hình 21 Biểu đồ tuần tự giỏ hàng 24

Hình 22 Biểu đồ tuần tự đăng ký 24

Hình 23 Biểu đồ tuần tự đăng nhập 25

Hình 24 Biểu đồ tuần tự phục hồi mật khẩu 26

Hình 25 Biểu đồ tuần tự đổi mật khẩu 26

Hình 26 Biểu đồ hoạt động thêm sản phẩm 27

Hình 27 Biểu đồ hoạt động sửa sản phẩm 27

Hình 28 Biểu đồ hoạt động xóa sản phẩm 27

Hình 29 Biểu đồ hoạt động sửa thông tin cá nhân 28

Hình 30 Biểu đồ hoạt động thêm vào giỏ hàng 28

Hình 31 Biểu đồ hoạt động mua hàng 29

Hình 32 Biểu đồ hoạt động đăng ký 29

Hình 33 Biểu đồ hoạt động đăng nhập 30

Hình 34 Biểu đồ hoạt động phục hồi mật khẩu 30

Hình 35 Biểu đồ hoạt động đổi mật khẩu 31

Hình 36 Biểu đồ lớp 41

Hình 37 Biểu đồ quan hệ CSDL 50

Hình 3.1 Màn hình trang chủ 52

Hình 3.2 Màn hình chi tiết sản phẩm 53

Hình 3.3 Màn hình loại sản phẩm 54

Hình 3.4 Màn hình danh sách tin tức 55

Hình 3.5 Màn hình chi tiết tin tức 56

Hình 3.6 Màn hình giỏ hàng 56

Hình 3.7 Màn hình đặt hàng 57

Hình 3.8 Màn hình liên hệ 57

Hình 3.9 Popup đăng nhập 58

Hình 3.10 Màn hình quản lý admin 59

Hình 3.11 Màn hình phân quyền tài khoản 59

Hình 3.12 Màn hình quản lý báo cáo 60

Hình 3.13 Màn hình quản lý sản phẩm 60

Hình 3.14 Màn hình quản lý khuyến mãi 61

Hình 3.15 Màn hình quản lý đánh giá 61

Trang 8

vi

DANH MỤC BẢNG BIỂU

Bảng 2.1 Yêu cầu phi chức năng 10

Bảng 2.2 Các tác nhân chính của hệ thống 11

Bảng 2.3 Bảng đặt tả Use case tổng quát 12

Bảng 2.4 Bảng đặt tả Use case quản lý loại hàng 13

Bảng 2.5 Bảng đặt tả Use case quản lý sản phẩm 14

Bảng 2.6 Bảng đặt tả Use case quản lý tài khoản 14

Bảng 2.7 Bảng đặt tả Use case quản lý hóa đơn 15

Bảng 2.8 Bảng đặt tả Use case quản lý phản hồi 15

Bảng 2.9 Bảng đặt tả Use case quản lý thông tin cá nhân 16

Bảng 2.10 Bảng đặt tả Use case phản hồi cho người bán 16

Bảng 2.11 Bảng đặt tả Use case tìm kiếm 17

Bảng 2.12 Bảng đặt tả Use case xem chi tiết sản phẩm 17

Bảng 2.13 Bảng đặt tả Use case giỏ hàng 18

Bảng 2.14 Bảng đặt tả Use case mua hàng 18

Bảng 2.15 Bảng đặt tả Use case đăng ký 19

Bảng 2.16 Bảng đặt tả Use case đăng nhập 19

Bảng 2.17 Bảng đặt tả Use case phục hồi mật khẩu 20

Bảng 2.18 Bảng đặt tả Use case quản lý danh mục tin tức 20

Bảng 2.19 Bảng đặt tả Use case quản lý loại tin tức 21

Bảng 2.20 Bảng đặt tả Use case quản lý tin tức 21

Bảng 2.21 Bảng danh sách sách thuộc tính lớp chi tiết khuyến mãi 31

Bảng 2.22 Bảng danh sách sách phương thức lớp chi tiết khuyến mãi 31

Bảng 2.23 Bảng danh sách sách thuộc tính lớp nhà sản xuất 32

Bảng 2.24 Bảng danh sách sách phương thức lớp nhà sản xuất 32

Bảng 2.25 Bảng danh sách sách thuộc tính lớp danh mục 32

Bảng 2.26 Bảng danh sách sách phương thức lớp danh muc 32

Bảng 2.27 Bảng danh sách sách thuộc tính lớp chi tiết hóa đơn xuất 33

Bảng 2.28 Bảng danh sách sách phương thức lớp chi tiết hóa đơn xuất 33

Bảng 2.29 Bảng danh sách sách thuộc tính sản phẩm bạn mua 33

Bảng 2.30 Bảng danh sách sách phương thức lớp sản phẩm bạn mua 33

Bảng 2.31 Bảng danh sách sách thuộc tính lớp loại dịch vụ 33

Bảng 2.32 Bảng danh sách sách phương thức lớp loại dịch vụ 34

Bảng 2.33 Bảng danh sách sách thuộc tính lớp danh mục dịch vụ 34

Bảng 2.34 Bảng danh sách sách phương thức lớp danh mục dịch vụ 34

Bảng 2.35 Bảng danh sách sách thuộc tính lớp dịch vụ 34

Bảng 2.36 Bảng danh sách sách phương thức lớp dịch vụ 34

Bảng 2.37 Bảng danh sách sách thuộc tính lớp hóa đơn xuất 35

Bảng 2.38 Bảng danh sách sách phương thức lớp hóa đơn xuất 35

Bảng 2.39 Bảng danh sách sách thuộc tính lớp users 35

Bảng 2.40 Bảng danh sách sách phương thức lớp user 35

Bảng 2.41 Bảng danh sách sách thuộc tính lớp địa điểm 36

Bảng 2.42 Bảng danh sách sách phương thức lớp đia điểm 36

Bảng 2.43 Bảng danh sách sách thuộc tính chi tiết hóa đơn nhập 36

Bảng 2.44 Bảng danh sách sách phương thức chi tiết hóa đơn nhập 36

Bảng 2.45 Bảng danh sách sách thuộc tính lớp phản hồi 36

Bảng 2.46 Bảng danh sách sách phương thức lớp phản hồi 36

Bảng 2.47 Bảng danh sách sách thuộc tính lớp nhà cung cấp 37

Bảng 2.48 Bảng danh sách sách phương thức lớp nhà cung cấp 37

Trang 9

vii

Bảng 2.49 Bảng danh sách sách thuộc tính lớp khuyến mãi 37

Bảng 2.50 Bảng danh sách sách phương thức lớp khuyến mãi 37

Bảng 2.51 Bảng danh sách sách thuộc tính lớp danh mục hình 38

Bảng 2.52 Bảng danh sách sách phương thức lớp danh mục hình 38

Bảng 2.53 Bảng danh sách sách thuộc tính lớp đánh giá 38

Bảng 2.54 Bảng danh sách sách phương thức lớp đánh giá 38

Bảng 2.55 Bảng danh sách sách thuộc tính lớp quyền 38

Bảng 2.56 Bảng danh sách sách phương thức lớp quyền 38

Bảng 2.57 Bảng danh sách sách thuộc tính lớp loại tin tức 39

Bảng 2.58 Bảng danh sách sách phương thức lớp loại tin tức 39

Bảng 2.59 Bảng danh sách sách thuộc tính lớp danh mục tin tức 39

Bảng 2.60 Bảng danh sách sách phương thức danh mục tin tức 39

Bảng 2.61 Bảng danh sách sách thuộc tính lớp tin tức 40

Bảng 2.62 Bảng danh sách sách phương thức lớp tin tức 40

Bảng 2.63 Bảng chi_tiet_hoa_don_nhaps 42

Bảng 2.64 Bảng chi_tiet_hoa_don_xuats 42

Bảng 2.65 Bảng chi_tiet_khuyen_mais 43

Bảng 2.66 Bảng danh_gias 43

Bảng 2.67 Bảng danh_muc_hinhs 43

Bảng 2.68 Bảng danh_mucs 44

Bảng 2.69 Bảng dia_diems 44

Bảng 2.70 Bảng danh_muc_tin_tucs 44

Bảng 2.71 Bảng loai_tin_tucs 44

Bảng 2.72 Bảng tin_tucs 45

Bảng 2.73 Bảng danh_muc_dich_vus 45

Bảng 2.74 Bảng loai_dich_vus 45

Bảng 2.75 Bảng dich_vus 45

Bảng 2.76 Bảng hoa_don_nhaps 46

Bảng 2.77 Bảng hoa_don_xuats 46

Bảng 2.78 Bảng ho_tros 47

Bảng 2.79 Bảng khuyen_mais 47

Bảng 2.80 Bảng nha_cung_caps 47

Bảng 2.81 Bảng nha_san_xuats 47

Bảng 2.82 Bảng phan_hois 48

Bảng 2.83 Bảng quyens 48

Bảng 2.84 Bảng giai_dap_thac_macs 48

Bảng 2.85 Bảng san_phams_ban_muas 48

Bảng 2.86 Bảng trang_thais 49

Bảng 2.87 Bảng users 49

Trang 10

SVTH: Phan Đinh Thiên Phúc GVHD: TS Nguyễn Trần Quốc Vinh Trang 1

MỞ ĐẦU

1 Tổng quan về đề tài

Ngày nay,ứng dụng công nghệ thông tin vào việc tin học háo được xem là một trong những yếu tố mang tính quyết định trong hoạt động của các chính phủ,tổ chức,cũng như của các công ty,nó đóng vai trò hết sức quan trọng,có thể tạo ra những bước đột phá mạnh mẽ

Chúng ta có thể thấy trong thị trường hiện nay thì việc cạnh tranh về kinh doanh ngày càng trở nên quyết liệt, hầu hết những nhà kinh doanh đều muốn làm thỏa mãn khách hàng một cách tốt nhất

So với kinh doanh truyền thống thì “Thương mại điện tử” sẽ tốn chi phí thấp hơn, hiệu quả đạt được cao hơn Hơn thế nữa, với lợi thế của công nghệ Internet hiện nay thì việc truyền tải thông tin về sản phẩm sẽ diễn ra một cách nhanh chóng, thuận tiện Kết hợp với bộ phận giao hàng tận nơi, thanh toán thông qua bưu điện hoặc ngân hàng, khách hàng có thể ở nhà mà vẫn nhận được sản phẩm mà mình ưng ý

Từ vấn đề đó nên em đã chọn đề tài “Xây dựng Website bán hàng điện tử” để làm

đề tài khóa luận tốt nghiệp của mình với mục tiêu xây dựng được hệ thống bán hàng nhanh chóng và thuận tiện

2 Mục tiêu đề tài

Xây dựng Website đáp ứng nhu cầu mua, tìm kiếm sản phẩm, xây dựng nên một môi trường mua sắm thuận tiện và trực quan, dễ dàng thao tác với nhiều đối tượng sử dụng.Xây dựng được hệ thống quản lý sản phẩm của cửa hàng thuận tiện.Xây dựng được chức năng thống kê,báo cáo doanh thu để đưa ra những định hướng bán hàng cho chủ cửa hàng

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

Hệ thống xây dựng trên những tìm hiểu thực tế về bán hàng ở một số cửa hàng bán hàng điện tử

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

Với những mục đích nêu trên, để có thể xây dựng hệ thống hoàn chỉnh em đặt ra những phương pháp cụ thể cho mình như sau:

Sử dụng kiến thức đã học kết hợp với các thông tin về nghiệp vụ tìm hiểu ở thực

tế để phân tích yêu cầu, từ đó xây dựng hệ thống phù hợp

Trang 11

Nghiên cứu các hệ thống tương tự để tìm hiểu ưu nhược điểm từ đó vận dụng cho sản phẩm của mình

Khảo sát yêu cầu khách hàng, thu thập dữ liệu để phân tích đúng, phù hợp với yêu cầu khách hàng

Tìm hiểu về Framework Angular

Tìm hiểu vể Framework Laravel

Tìm hiểu về lập trình web API (Application Programming Interface)

Thực hiện xây dựng hệ thống trên nền tảng web, sử dụng Angular để lập trình front-end và Laravel cho back-end

Xây dựng các single page application để giúp Website hoạt động nhanh hơn và hiệu quả hơn

Tìm hiểu về dịch vụ lưu trữ dữ liệu đám mây của google (Goole Cloud Platform)

để lưu trữ các tài nguyen của Website (hình ảnh, video…)

5 Tiêu chí chức năng của đề tài

Xây dựng hệ thống cung cấp môi trường bán hàng đa nền tảng, trở thành kênh giao dịch điện tử hiện đại, dễ truy cập với nhiều thông tin đa dạng, trung thực và kịp thời về những thông tin sản phẩm trên thị trường Hệ thống sẽ giúp cho người mua dễ dàng mua được sản phẩm ưng ý, thuận tiện, đồng thời giúp cho người bán dễ dàng quản lí được sản phẩm, báo cáo thống kê tình hình kinh doanh, nắm bắt được xu hướng của người tiêu dùng để lên kế hoạch kinh doanh phù hợp

Một số tiêu chí chức năng của khách hàng

Giao diện web dễ sữ dụng và có tính thẩm mỹ cao

Giao diện web phải thiết kế sao cho nội dung hiển thị phải chính xác và đầy

đủ thông tin nhất để đáp ứng nhu cầu của khách hàng

Để thuận tiện cho việc mua bán và giao dịch, hệ thống phải cho phép người dùng đăng kí tài khoản, thông tin đăng kí phải được bảo mật an toàn, chính xác, tránh sai sót

Để thuận tiện cho việc chọn lựa sản phẩm hệ thống cung cấp chức năng cho phép khách hàng có thể tìm kiếm sản phẩm theo yêu cầu

Để thuận tiện cho việc chọn mua sản phẩm hệ thống cho phép người truy cập hoặc người dùng xem chi tiết một mặt hàng bất kì

Để tiến hành mua hàng hệ thống cho phép người truy cập hoặc người dùng được phép thêm sản phẩm bất kì vào giỏ hàng

Để thuận tiện cho khách hàng trong việc tính toán giá cả các mặt hàng hệ thống cho phép người truy cập hoặc người dùng xem chi tiết giỏ hàng hiện tại của họ

Trang 12

Để thuận tiện cho mua hàng hệ thống cho phép người truy cập hoặc người dùng cập cập nhật số lượng, thêm, xóa các sản phẩm có trong giỏ hàng của

họ

Bình luận về sản phẩm

Đóng góp ý kiến cho người quản trị

Một số tiêu chí chức năng của quản trị

Cung cấp cho người quản trị giao diện quản lí rõ ràng, dễ sử dụng

Đối với người quản trị hệ thống phải cho phép họ đăng kí, đăng nhập, cập nhật lại thông tin tài khoản

Cho phép người quản trị cập nhật sản phẩm lên website 1 cách đơn giản và chính xác

Cung cấp cho chức năng quản lí danh sách sản phẩm

Thống kê cho người quản trị các vấn đề sau: khách hàng, thu chi, sản phẩm, đơn đặt hàng

Cho phép người quản trị được quyền thêm, xóa, sữa tài khoản khách hàng hay sản phẩm website

Cho phép người quản trị được quyền xem các hóa đơn, xóa hóa đơn

Cho người quản trị chỉnh sữa các trang giới thiệu, tin tức, liên hệ của trang website

Cho phép quản trị thống kê, quản lí đơn hàng

6 Bố cục của khóa luận

Khóa luận bao gồm các nội dung sau:

Mở đầu

Chương 1:Cơ sở lý thuyết

Chương 2: Phân tích và thiết kết hệ thống

Chương 3: Triển khai và đánh giá kết quả

Kết luận

Trang 13

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT

1.1.1 Giới thiệu về PostgreSQL

PostgreSQL là một hệ thống quản trị cơ sở dữ liệu quan hệ đối tượng

PostgreSQL là một phần mềm mã nguồn mở miễn phí Mã nguồn của phần mềm khả dụng theo license của PostgreSQL, một license nguồn mở tự do

PostgreSQL tuân thủ ACID và hỗ trợ đầy đủ các khoá ngoại, tham gia, chế độ xem, trình kích hoạt và thủ tục lưu trữ bằng nhiều ngôn ngữ khác nhau

PostgreSQL có khả năng mở rộng cao cả về số lượng dữ liệu mà nó có thể quản

lý và số lượng người dùng đồng thời có thể đáp ứng

Nó rất thích hợp với web và có thể dễ dàng nhúng vào trang HTML

Do được tối ưu hóa cho các ứng dụng web, tốc độ nhanh, nhỏ gọn, cú pháp giống

C và Java, dễ học và thời gian xây dựng sản phẩm tương đối ngắn hơn so với các ngôn ngữ khác nên PHP đã nhanh chóng trở thành một ngôn ngữ lập trình web phổ biến nhất thế giới

Ưu điểm của lập trình web PHP

+ PHP là một mã nguồn mở: Việc cài đặt và sử dụng PHP rất dễ dàng, miễn phí và tự do vì đây là một mã nguồn mở (Open-source).Vì có tính ưu thế như vậy mà PHP đã được cài đặt phổ biến trên các WebServer thông dụng hiện nay như Apache, IIS

+ Là một ngôn ngữ mã nguồn mở cùng với sự phổ biến của PHP thì cộng đồng lập trình PHP được coi là khá lớn và có chất lượng Khả năng ứng dụng là rất cao

+ Thư viện script PHP cũng rất phong phú, đa dạng Từ những cái rất nhỏ như chỉ là 1 đoạn code, 1 hàm (PHP.net…) Cho tới những cái lớn hơn như Framework (Zend, CakePHP, CogeIgniter, Symfony…)

+ Từ phiên bản PHP 5, PHP đã có khả năng hỗ trợ hầu hết các đặc điểm nổi bật của lập trình hướng đối tượng như là Inheritance, Abstraction, Encapsulation, Polymorphism, Interface, Autoload

Trang 14

1.2.1 Giới thiệu về Angular

Angular là một javascript framework do google phát triển để xây dựng các Single Page Application (SPA) bằng JavaScript , HTML và TypeScript Angular cung cấp các tính năng tích hợp cho animation , http service và có các tính năng như auto-complete , navigation , toolbar , menus ,… Code được viết bằng TypeScript , biên dịch thành JavaScript và hiển thị tương tự trong trình duyệt Phiên bản hiện tại của Angular

là Angular 8

1.2.2 Các đặc tính của của Angular

• Angular giúp nâng cao năng suất của các lập trình viên

• Angular có cấu trúc phát triển rất rõ rang

• Angular mang đến một kiến trúc rất rõ rang, dựa trên ba yếu tố chính:class, các dependency được thêm vào và mô hình MVVM (model-view-view/model)

• Angular có Extensive binding giúp cho việc truy suất dữ liệu từ Server và hiện thị dữ liệu đó tới người dùng trên view một cách thuận tiện và rất dễ dàng

• Angular hỗ trợ đây đủ tính năng điều hướng (routing)

• Angular giúp giảm tối đa kích thước và tang tối đá hiệu suất của ứng dụng

• Angular là mã nguồn mở, hoàn toàn miễn phí và được phát triển bởi hàng ngàn các lập trình viên trên thế giới

1.2.3 Các tính năng cốt lõi của Angular

Data-binding: (liên kết dữ liệu) tự động đồng bộ dữ liệu giữa model và view Scope: (Phạm vi) Đây là những đối tượng kết nối giữa Controller và View Controller: Đây là những hàm javascript xử lý kết hợp với bộ điều khiển Scope Service: Như tôi đề cập ở trên, Angular sử dụng các API được xây dựng từ các

web service (PHP, ASP) để thao tác với DB

Filters: Bộ lọc lọc ra các thành phẩn của một mảng và trả về mảng mới

Directives: đánh dấu vào các yếu tố của DOM, nghĩa là sẽ tạo ra các thẻ

HTML tùy chỉnh

Templates: hiển thị thông tin từ controller, đây là một thành phần của views Routing: chuyển đổi giữa các action trong controller

MVC: Mô hình chia thành phần riêng biệt thành Model, View, Controller Đây

là một mô hình khá hay nhưng trong Angular thì nó được chế biến lại một chút gần giốn với MVVM (Model View View Model)

Deep Linking: Liên kết sâu, cho phép bạn mã hóa trạng thái của ứng dụng

trong các URL để nó có thể đánh dấu được với công cụ tìm kiếm

Trang 15

Dependency Injection: Angular giúp các nhà phát triển tạo ứng dụng dễ dàng

hơn để phát triển, hiểu và thử nghiệm dễ dàng

1.3.1 Sơ lược về Framework Laravel PHP

Laravel là một PHP Framework mã nguồn mở và miễn phí, được phát triển bởi Taylor Otwell và nhắm mục tiêu hỗ trợ phát triển các ứng dụng web theo cấu trúc model- view- controller (MVC)

Những tính năng nổi bật của Laravel bao gồm cú pháp dễ hiểu- rõ ràng, một hệ thống đóng gói Modular và quản lý gói phụ thuộc, nhiều cách khác nhau để truy cập vào các cơ sở dữ liệu quan hệ, nhiều tiện ích khác nhau hỗ trợ việc triển khai vào bảo trì ứng dụng

1.3.2 Route trong Laravel Framework

Mục đích của router là định tuyến đến những controller cụ thể nào từ phía request của người sử dụng Trong Laravel thì các bạn hoàn toàn có thể xử lý dữ liệu ngay trong phần Router Đây chính là điểm mạnh cũng như điểm khác biệt lớn của Laravel Framework đối với các Framework khác

1.3.3 Blade template trong Laravel Framework

Blade rất đơn giản, nhưng lại là một templating engine đầy mạnh mẽ! Không giống những PHP templating engine phổ biến khác, Blade không giới hạn chúng ta sử dụng code PHP trong views Tất cả các file Blade sẽ được dịch thành file code PHP và cache cho đến khi file Blade bị thay đổi, điều đó cũng có nghĩa là Blade tự làm tất cả những việc cần thiết để có thể chạy views cho ứng dụng của bạn

1.3.4 Controller trong Laravel Framework

Như các bạn được biết trong Laravel cho phép chúng ta có thể xử lý dữ liệu ngay bên trong Route nhưng đối với những thao tác phức tạp và dài chúng ta lên xử lý trong Controller.Có như vậy thì ứng dụng của bạn mới trở nên linh hoạt và dễ mở rộng sau này

1.3.5 Kết nối cơ sở dữ liệu trong Laravel Framework

Laravel kết nối tới cơ sở dữ liệu và chạy truy vấn cực kỳ đơn giản Cấu hình nằm tại file app/config/database.php Trong file này thì định nghĩa tất cả những loại kết nối

cơ sở dữ liệu, tất nhiên là chúng cũng có loại cơ sở kết nối mặc định

Trang 16

API cũng có thể cung cấp phương thức để các ứng dụng từ xa có thể yêu cầu dịch vụ đến hệ thống ứng dụng cung cấp dịch vụ và từ đó có thể trao đổi dữ liệu giữa các hệ thống

Hệ thống API trên nền tảng web còn gọi vắn tắt là web API: Hiện đang rất phổ biến, các website lớn đều cung cấp hệ thống API cho phép bạn kết nối, lấy dữ liệu hoặc cập nhật dữ liệu vào hệ thống

Các API của thư viện phần mềm hoặc framework: API mô tả và quy định các hành vi mong muốn mà các thư viện cung cấp, một API có thể có nhiều các triển khai khác nhau và nó cũng giúp cho một chương trình viết bằng ngôn ngữ này có thể sử dụng thư viện được viết bằng ngôn ngữ khác

1.4.2 Xây dựng RESTful API trên Framework Laravel

RESTful API là API đi theo cấu trúc REST RESTful API không được xem là một công nghệ, nó là một giải pháp để tạo ra các ứng dụng Web Services thay thế cho các kiểu khác như SOAP, WSDL (Web Service Definition Language),… Ta có một số HTTP method theo chuẩn RESTful API như sau:

GET : truy xuất tài nguyên (READ) POST : tạo tài nguyên mới ( CREATE) PUT / PATCH: cập nhật, sửa đổi tài nguyên (UPDATE) DELETE : xóa tài nguyên ( DELETE)

Trang 17

ra từ những dòng HTML, CSS để hiển thị

1.5.2 Ưu điểm khi sử dụng SPA

Giúp user cảm nhận việc sử dụng website nhanh hơn, thay vì đợi client-server giao tiếp và load lại nguyên page thì giờ chỉ cần đợi browser load lại 1 phần

components

Với cách server trả data dạng JSON, phía server sẽ giảm được bớt tài nguyên

Vì chỉ cần tập trung vào các API thay vì xây đựng lại layout kiểu server-side render

Khi server xây dựng các API cho website, chúng ta có thể tận dụng để build các ứng dụng mobile mà không cần phải viết thêm mới

SPA hỗ trợ cho Progressive Web Apps, user có thể sử dụng website mà không cần online (kết nối mạng)

SPA chia dự án thành 2 đội, backend lo cho việc phát triển các API và đội frontend lo cho việc phát triển UI UX Chính sự gia tăng SPA trong phát triển website nên vài năm gần đây các tuyển dụng về frontend developer khá nhiều

1.5.3 Nhược điểm khi sử dụng SPA

SEO, kỹ thuật này đang được Google phát triển cho các ứng dụng, website theo kiểu SPA, tuy nhiên đến giờ vẫn còn khá nhiều vấn đề cho việc đánh index site so với các website truyền thống (server-render page)

Khi phát triển với SPA điều đó có nghĩa bạn đang làm việc với hàng tá đoạn code Javascript Và nếu bạn quản lý và code không kỹ càng thì có thể dẫn đến tình trạng memory leak cho browser

Trang 18

CHƯƠNG 2 PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG

2.1.1 Mô tả bài toán

Chúng ta có thể thấy trong thị trường hiện nay thì việc cạnh tranh về kinh

doanh ngày càng trở nên quyết liệt, hầu hết những nhà kinh doanh đều muốn làm thỏa mãn khách hàng một cách tốt nhất

So với kinh doanh truyền thống thì “Thương mại điện tử” sẽ tốn chi phí thấp hơn, hiệu quả đạt được cao hơn Hơn thế nữa, với lợi thế của công nghệ Internet hiện nay thì việc truyền tải thông tin về sản phẩm sẽ diễn ra một cách nhanh chóng, thuận tiện Kết hợp với bộ phận giao hàng tận nơi, thanh toán thông qua bưu điện hoặc ngân hàng, khách hàng có thể ở nhà mà vẫn nhận được sản phẩm mà mình ưng ý

2.1.3 Yêu cầu Chức năng

➢ Khách: Mua hàng, tìm kiếm, đăng nhập, đăng ký, phục hồi mật khẩu, quản lý

giỏ hàng, xem chi tiết sản phẩm, xem tin tức, xem dịch vụ …

➢ Thành viên: Quản lý thông tin cá nhân, phản hồi cho người bán, bình luận về

sản phẩm, đăng nhập, đăng xuất…

➢ Admin: Quản lý sản phẩm, quản lý loại hàng, quản lý tài khoản, quản lý hóa đơn,

quản lý đánh giá, quản lý dịch vụ, quản lý tin tức, phân quyền hệ thống, quản lý cấu hình cài đặt tin tức quản lý cấu hình cài đặt dịch vụ, quản lý cấu hình cài đặt sản phẩm, quản lý cấu hình cài đặt trang chủ, quản lý giải đáp…

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

Đặc tả yêu cầu phi chức năng

Cơ sở hạ tầng - Các dữ liệu được lưu trong các cơ sở dữ liệu và được sao lưu

thường xuyên và được phục hồi khi cần

Trang 19

Bảo mật

- Xác thực quyền: sử dụng tài khoản để đăng nhập vào hệ thống, gồm 3 loại: Quản trị viên, nhân viên, khách hàng Mỗi loại người dùng sẽ có một số quyền riêng

- Các dữ liệu về tài khoản được lưu trong cơ sở dữ liệu và được bảo mật

- Mật khẩu được mã hóa Bcrypt đảm bảo tính bảo mật thông tin

Trình duyệt -Mọi trình duyệt

Giao diện

- Giao diện bắt mắt, dễ sử dụng, thân thiện với người dùng, định dạng đồng nhất

- Sử dụng đồng nhất màu sắc, font chữ

Ngôn ngữ - Tiếng Việt

Bảng 2.1 Yêu cầu phi chức năng

2.2.1 Các tác nhân của hệ thống

Khách Người dùng chưa đăng ký có thể đăng kí, đăng nhập, tra

cứu thông tin dịch vụ, mua hàng,

các chức năng của Khách, có quyền xem, tìm kiếm thông tin, liên hệ, đánh giá sản phẩm, mua hàng, phản hồi cho admin,…

chức năng của thành viên, quản lí đơn hàng, quản lí phản hồi,…

Trang 20

Nhân viên, được quyền quản lí các thông tin dịch vụ,tài khoản, thông tin liên quan đến sản phẩm,hóa đơn,loại sản phẩm…

Một số sơ đồ use-case chính của hệ thống:

Trang 21

Hình 1 Biểu đồ Use case tổng quát - Khách

Hình 2 Biểu đồ Use case tổng quát – Nhân viên

Hình 3 Biểu đồ Use case tổng quát – Admin

Tác nhân Admin, Nhân viên, User, Khách

Mục đích Mô tả toàn bộ chức năng của từng đối tượng người dùng trong

hệ thống

Bảng 2.3 Bảng đặt tả Use case tổng quát

Trang 22

Biểu đồ đặc tả Use Case quản lý loại hàng

Hình 4 Biểu đồ Use case quản lý loại hàng

Tên Use Case Quản lí loại hàng

Mô tả Người dùng có thể thêm, xóa, sửa, xem danh sách loại

hàng

Điều kiện trước Người dùng đã đăng nhập với quyền Admin

Bảng 2.4 Bảng đặt tả Use case quản lý loại hàng

Biểu đồ đặc tả Use Case quản lý sản phẩm

Hình 5 Biểu đồ Use case quản lý sản phẩm

Tên Use Case Quản lí sản phẩm

Mô tả Người dùng có thể thêm, xóa, sửa, xem danh sách sản

phẩm Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Admin

Trang 23

Bảng 2.5 Bảng đặt tả Use case quản lý sản phẩm

Biểu đồ đặc tả Use Case quản lý tài khoản

Hình 6 Biểu đồ Use case quản lý tài khoản

Tên Use Case Quản lí tài khoản

Mô tả Người dùng có thể thêm, xóa, sửa, xem danh sách thông tin

tài khoản

Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Admin

Bảng 2.6 Bảng đặt tả Use case quản lý tài khoản

Biểu đồ đặc tả Use Case quản lý hóa đơn

Hình 7 Biểu đồ Use case quản lý hóa đơn

Tên Use Case Quản lí hóa đơn

Trang 24

hóa đơn nhập Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Admin

Bảng 2.7 Bảng đặt tả Use case quản lý hóa đơn

Biểu đồ đặc tả Use Case quản lý phản hồi

Hình 8 Biểu đồ Use case quản lý phản hồi

Tên Use Case Quản lí phản hồi

Mô tả Người dùng có thể Trả lời phản hồi

Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Admin

Bảng 2.8 Bảng đặt tả Use case quản lý phản hồi

Biểu đồ đặc tả Use Case quản lý thông tin cá nhân

Hình 9 Biểu đồ Use case quản lý thông tin cá nhân

Tên Use Case Quản lí thông tin cá nhân

Trang 25

Mô tả Người dùng có thể cập nhật thông tin cá nhân

Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Thành viên

Bảng 2.9 Bảng đặt tả Use case quản lý thông tin cá nhân

Biểu đồ đặc tả Use Case phản hồi cho người bán

Hình 10 Biểu đồ Use case phản hồi cho người bán

Tên Use Case Phản hồi cho người bán

Mô tả Người dùng có thể gửi phản hồi cho hệ thống

Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Thành viên

Bảng 2.10 Bảng đặt tả Use case phản hồi cho người bán

Biểu đồ đặc tả Use Case tìm kiếm

Trang 26

Hình 11 Biểu đồ Use case tìm kiếm

Tên Use Case Tìm kiếm

Mô tả Người dùng có thể tìm kiếm theo tên sản phẩm / loại sản

phẩm / nhà sản xuất Điều kiện trước Không có

Bảng 2.11 Bảng đặt tả Use case tìm kiếm

Biểu đồ đặc tả Use Case xem chi tiết sản phẩm

Tên Use Case Xem chi tiết sản phẩm

Mô tả Người dùng có thể xem thông tin chi tiết sản phẩm

Điều kiện trước Không có

Bảng 2.12 Bảng đặt tả Use case xem chi tiết sản phẩm

Biểu đồ đặc tả Use Case quản lý giỏ hàng

Hình 12 Biểu đồ Use case giỏ hàng

Tên Use Case Quản lí giỏ hàng

Mô tả Người dùng có thể thêm, xóa, sửa, xem danh sách các mặt

hàng trong giỏ hàng Điều kiện trước Không có

Trang 27

Bảng 2.13 Bảng đặt tả Use case giỏ hàng

Biểu đồ đặc tả Use Case mua hàng

Biểu đồ Use Case mua hàng

Hình 13 Biểu đồ Use case mua hàng

Tên Use Case Mua hàng

Mô tả Người dùng có thể mua hàng sau khi bổ sung thông tin

giao hàng và chọn phương thức thanh toán Điều kiện trước Không có

Bảng 2.14 Bảng đặt tả Use case mua hàng

Biểu đồ đặc tả Use Case đăng ký

Tên Use Case Đăng ký

Mô tả Người dùng có thể đăng ký tài khoản

Luồng sự kiện

1 Người dùng nhập

thông tin đăng ký

2 Hệ thống kiểm tra thông tin vừa nhập, nếu sai sẽ thông báo thông tin không hợp lệ, quay lại bước 1

3 Hệ thông kiểm tra email có tồn tại trong CSDL

Nếu có quay về bước 1

Trang 28

4 Hệ thống lưu thông tin đăng ký và hiển thị thông báo đăng ký thành công

Bảng 2.15 Bảng đặt tả Use case đăng ký

Biểu đồ đặc tả Use Case đăng nhập

Tên Use Case Đăng nhập

Mô tả Người dùng có thể đăng nhập vào hệ thống thông qua tài

khoản đã đăng ký Điều kiện trước Người dùng đã đăng ký tài khoản

4 Hệ thống thông báo đăng nhập thành công

Bảng 2.16 Bảng đặt tả Use case đăng nhập

Biểu đồ đặc tả Use Case phục hồi mật khẩu

Tên Use Case Phục hồi mật khẩu

Mô tả Người dùng có thể phục hồi mật khẩu

Trang 29

4 Hệ thống lưu thông tin phục hồi thông báo đã gửi đường dẫn phục hồi mật khẩu vào email

Bảng 2.17 Bảng đặt tả Use case phục hồi mật khẩu

Biểu đồ đặc tả Use Case quản lý danh mục tin tức

Hình 14 Biểu đồ Use case quản lý danh mục tin tức

Tên Use Case Quản lí danh mục tin tức

danh mục tin tức Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Admin

Bảng 2.18 Bảng đặt tả Use case quản lý danh mục tin tức

Biểu đồ đặc tả Use Case quản lý loại tin tức

Hình 15 Biểu đồ Use case quản lý loại tin tức

Trang 30

Tên Use Case Quản lí loại tin tức

loại tin tức Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Admin

Bảng 2.19 Bảng đặt tả Use case quản lý loại tin tức

Biểu đồ đặc tả Use Case quản lý tin tức

Hình 16 Biểu đồ Use case quản lý tin tức

Tên Use Case Quản lí tin tức

tin tức Điều kiện trước Người dùng đã đăng nhập hệ thống với quyền Admin

Bảng 2.20 Bảng đặt tả Use case quản lý tin tức

Trang 31

2.2.5 Biểu đồ tuần tự

Dưới đây là một số biểu đồ tuần tự thể hiện một số chức năng chính của hệ

thống:

Biểu đồ tuần tự Thêm sản phẩm

Hình 17 Biểu đồ tuần tự thêm sản phẩm

Biểu đồ tuần tự Sửa sản phẩm

Hình 18 Biểu đồ tuần tự sửa sản phẩm

Trang 32

Biểu đồ tuần tự sửa thông tin cá nhân

Hình 19 Biểu đồ tuần tự sửa thông tin cá nhân

Biểu đồ tuần tự Tìm kiếm

Hình 20 Biểu đồ tuần tự tìm kiếm

Trang 33

Biểu đồ tuần tự Thêm vào giỏ hàng

Hình 21 Biểu đồ tuần tự giỏ hàng

Biểu đồ tuần tự Đăng ký

Hình 22 Biểu đồ tuần tự đăng ký

Trang 34

Biểu đồ tuần tự Đăng nhập

Hình 23 Biểu đồ tuần tự đăng nhập

Biểu đồ tuần tự Phục hồi mật khẩu

Trang 35

Hình 24 Biểu đồ tuần tự phục hồi mật khẩu

Hình 25 Biểu đồ tuần tự đổi mật khẩu

Trang 36

Hình 26 Biểu đồ hoạt động thêm sản phẩm

Biểu đồ hoạt động Sửa sản phẩm

Hình 27 Biểu đồ hoạt động sửa sản phẩm

Biểu đồ hoạt động Xóa sản phẩm

Hình 28 Biểu đồ hoạt động xóa sản phẩm

Trang 37

Biểu đồ hoạt động Sửa thông tin cá nhân

Hình 29 Biểu đồ hoạt động sửa thông tin cá nhân

Biểu đồ hoạt động Thêm vào giỏ hàng

Hình 30 Biểu đồ hoạt động thêm vào giỏ hàng

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