(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs

(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs(Đồ án tốt nghiệp) Xây dựng website bán sản phẩm thân thiện môi trường bằng Nodejs

Đề Tài:

KHÓA LUẬN TỐT NGHIỆP KỸ SƯ CNTT

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM

KHOA CÔNG NGHỆ THÔNG TIN

BỘ MÔN CÔNG NGHỆ PHẦN MỀM

~~~o0o~~~

GIÁO VIÊN HƯỚNG DẪN

TS LÊ VĂN VINH

PHẠM THỊ NGỌC HƯỜNG – 16110351

LÊ THỊ THANH NGÂN – 16110396

XÂY DỰNG WEBSITE BÁN SẢN PHẨM THÂN THIỆN

MÔI TRƯỜNG BẰNG NODEJS

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM

KHOA CÔNG NGHỆ THÔNG TIN

XÂY DỰNG WEBSITE BÁN SẢN PHẨM THÂN THIỆN

MÔI TRƯỜNG BẰNG NODEJS KHÓA LUẬN TỐT NGHIỆP KỸ SƯ CNTT

GIÁO VIÊN HƯỚNG DẪN

TS LÊ VĂN VINH KHÓA 2016-2020

Nhóm em xin chân thành cảm ơn khoa CÔNG NGHỆ THÔNG TIN, BỘ MÔN CÔNG NGHỆ PHẦN MỀM, TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM đã tạo điều kiện thuận lợi cho chúng em thực hiện đề tài này

Chúng em cũng xin được gửi lời cảm ơn chân thành nhất đến thầy TS LÊ VĂN VINH, người đã tận tình chỉ bảo và hướng dẫn nhóm em thực hiện đề tài

Bên cạnh đó, chúng em xin gửi lời cảm ơn đến các thầy cô giảng viên của trường Đại Học Sư Phạm Kỹ Thuật Tp.HCM nói chung cũng như các thầy cô giảng viên khoa Công Nghệ Thông Tin nói riêng, những người đã giảng dạy, tạo điều kiện cho em tích lũy được những kiến thức quý báu trong những năm học qua

Chúng em đã nỗ lực rất nhiều để hoàn thành tốt nhất nhiệm vụ đề tài, nhưng do khả năng còn hạn chế nên chắc chắn sẽ không tránh khỏi thiếu sót Chúng em mong nhận được

sự tận tình chỉ bảo của các thầy cô để ngày càng tiến bộ

TP Hồ Chí Minh, ngày …… tháng …… năm 2020

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

ĐỀ CƯƠNG CHI TIẾT KHÓA LUẬN TỐT NGHIỆP

Họ tên sinh viên 1: PHẠM THỊ NGỌC HƯỜNG MSSV: 16110351

Họ tên sinh viên 2: LÊ THỊ THANH NGÂN MSSV: 16110396 Chuyên ngành: SƯ PHẠM CÔNG NGHỆ THÔNG TIN

Tên đề tài: Xây dựng website bán sản phẩm thân thiện môi trường bằng

NodeJS

Họ tên GVHD: TS LÊ VĂN VINH

Thởi gian thực hiện: từ 19/02/2020 – 15/07/2020

NHIỆM VỤ CỦA KHÓA LUẬN:

 Tìm hiểu công nghệ NodeJS xây dựng website bán sản phẩm thân thiện môi trường

 Khảo sát hiện trạng, đánh giá các website bán sản phẩm thân thiện với môi trường

 Phân tích nghiệp vụ của một website mua bán sản phẩm

 Mô hình hóa nghiệp vụ, xây dựng cơ sở dữ liệu

 Cài đặt các chức năng, kiểm thử toàn bộ hệ thống

ĐỀ CƯƠNG VIẾT KHÓA LUẬN:

1 PHẦN 1: PHẦN MỞ ĐẦU

1.1 Tính cấp thiết đề tài

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

1.3 Cách tiếp cận và phương pháp nghiên cứu

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

2.1.1.3 Tìm hiểu Express Framework của nodeJS

2.1.2.2 Chi tiết từng lớp mô hình MVC

2.1.2.3 Ưu - nhược điểm mô hình MVC

2.2 CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 2.2.1 Khảo sát hiện trạng

2.2.2 Xác định yêu cầu

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

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

2.2.3 Mô hình hóa yêu cầu

2.2.3.1 Lược đồ use case

2.3.2.4 Mô tả chi tiết các bảng dữ liệu

2.3.3 Thiết kế giao diện

3.4 Hướng phát triển trong tương lai

4 TÀI LIỆU THAM KHẢO

1 Đã hoàn tất đăng ký với GVHD

2 Được thầy hướng dẫn định hướng về các chức năng cần phát triển, các lựa chọn về mặt công nghệ để hiện thực

3 Đã kháo sát 5 trang web về bán sản phẩm thân thiện môi trường và trang web về môi trường

4 Đã xác định các yêu cầu cơ bản của một website bán sản phẩm

2 27/03 – 18/04

1 Xây dựng Use case Diagram

2 Xây dựng Sequence Diagram

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

1 Hoàn thành Use case Diagram ban đầu

2 Hoàn thành Sequence Diagram ban đầu

3 Hoàn thành thiết kế cơ sở dữ liệu ban đầu

3 19/04 – 01/05 1 Chỉnh sửa hoàn thiện Use 1 Đã hoàn thiện Use case

4 Đã hoàn thiện cơ sở dữ liệu

4 02/05 – 15/05 1 Thiết kế giao diện

6 14/06 – 26/06 1 Xây dựng các chức năng

người dùng USER

1 Đã hoàn thành các chức năng người dùng USER

7 14/06 – 26/06 1 Xây dựng các chức năng

người dùng ADMIN

1 Đã hoàn thành các chức năng người dùng ADMIN

8 27/06 – 25/07 1 Hoàn thành các chức năng

trong Use case Diagram

1 Đã hoàn thành các chức năng trong Use case Diagram

9 26/07 – 30/07 1 Viết báo cáo, làm slide

TP Hồ Chí Minh, ngày …… tháng …… năm 2020

Người viết đề cương

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

MỤC LỤC

PHẦN 1: PHẦN MỞ ĐẦU 1

1 TÍNH CẤP THIẾT ĐỀ TÀI 1

2 MỤC TIÊU CỦA ĐỀ TÀI 1

3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU 2

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

3.2 Phạm vi nghiên cứu 2

4 KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC 3

PHẦN 2: PHẦN NỘI DUNG 4

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

1 TÌM HIỂU CÔNG NGHỆ 4

1.1 Tìm hiểu Javascript 4

1.2 Tìm hiểu NodeJS 5

1.3 Tìm hiểu Express Framework của NodeJS 9

1.4 Tìm hiểu MongoDB 10

1.5 Tìm hiểu về Socket.io 13

1.6 Tìm hiểu về PassportJS 14

2 TÌM HIỂU MÔ HÌNH MVC TRONG XÂY DỰNG WEBSITE 16

2.1 Tìm hiểu mô hình MVC 16

2.2 Chi tiết từng lớp mô hình MVC 17

2.3 Ưu - Nhược điểm mô hình MVC 18

CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 19

1 KHẢO SÁT HIỆN TRẠNG 19

1.1 Nhận xét một số website về môi trường 19

1.2 Tổng hợp, đánh giá chung các websites về môi trường 40

1.3 Tổng kết - Rút ra trang web mong muốn 40

2 XÁC ĐỊNH YÊU CẦU 41

2.1 Yêu cầu chức năng 41

2.2 Yêu cầu phi chức năng 42

3 MÔ HÌNH HÓA YÊU CẦU 43

3.1 Lược đồ use case 43

1.2 Lược đồ tuần tự 64

2 THIẾT KẾ CƠ SỞ DỮ LIỆU 69

2.1 Cấu trúc dữ liệu 69

2.2 Các ràng buộc toàn vẹn 73

2.3 Lược đồ thực thể quan hệ 75

2.4 Mô tả chi tiết các bảng dữ liệu 76

3 THIẾT KẾ GIAO DIỆN 69

CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 108

1 CÀI ĐẶT 108

1.1 Thiết lập môi trường 108

1.2 Xây dựng cấu trúc project 108

2 KIỂM THỬ 111

PHẦN 3: PHẦN KẾT LUẬN 116

1 KẾT QUẢ ĐẠT ĐƯỢC 116

2 ƯU ĐIỂM 116

3 NHƯỢC ĐIỂM 117

4 HƯỚNG PHÁT TRIỂN TRONG TƯƠNG LAI 117

TÀI LIỆU THAM KHẢO 118

DANH MỤC CHỮ VIẾT TẮC

Ajax: Asynchronous JavaScript and XML

API: Application Programming Interface

App: application

CSS: Cascading Style Sheets

DOM: Document Object Model

HTML: Hyper Text Markup Language

HTTP: HyperText Transfer Protocol

JS / js: Javascript

JSX: JavaScript XML

MVC: Model – View – Controller

REST: Representational State Transfer

UI: user interface

URL: Uniform Resource Locator

XML: eXtensible Markup Language

Hình 1-Mô hình MVC [6] 16

Hình 2-Mô hình hoạt động của DAO, BO và JAVA BEAN [6] 17

Hình 3-Hình ảnh trang giao diện trang chủ (admin, user) 20

Hình 4-Trang diễn đàn 20

Hình 5-Trang môi trường 21

Hình 6-Trang chi tiết sản phẩm 22

Hình 7-Form đăng kí 23

Hình 8-Form đăng nhập 24

Hình 9-Trang chủ 28

Hình 10-Trang Design 29

Hình 11-Trang chủ 30

Hình 12-Trang Recycling Locator 31

Hình 13-Trang Recycle week campaign 32

Hình 14-Trang chi tiết cho 1 thông tin 33

Hình 15-Trang Recycling locations 33

Hình 16-Trang chủ 34

Hình 17-Trang News & Stories 35

Hình 18-Trang enviroment & you 36

Hình 19-Trang chủ 37

Hình 20-Trang travle 38

Hình 21-Trang danh mục 38

Hình 22-Trang đăng kí 39

Hình 23-Lược đồ usecase phía người dùng cuối 43

Hình 24-Lược đồ usecase phía người quản trị 44

Hình 25-Lược đồ lớp – Model Layer 63

Hình 26-Lược đồ tuần tự View home page 64

Hình 27-Lược đồ tuần tự Search product 64

Hình 32-Lược đồ tuần tự Update info 68

Hình 33-Lược đồ tuần tự Logout 68

Hình 34-Lược đồ thực thể quan hệ 75

Hình 35-Hình ảnh giao diện trang chủ khách hàng 85

Hình 36-Hình ảnh trang chi tiết sản phẩm 87

Hình 37-Hình ảnh trang giao diện đăng nhập khách hàng 88

Hình 38-Hình ảnh trang giao diện đăng ký 89

Hình 39-Hình ảnh trang giao diện trang tin tức 91

Hình 40-Hình ảnh trang giao diện theo danh mục 1 loại 93

Hình 41-Hình ảnh trang giao diện giỏ hàng 94

Hình 42-Hình ảnh trang giao diện thông tin đặt hàng 95

Hình 43-Hình ảnh trang giao diện thông tin đơn hàng 96

Hình 44-Hình ảnh trang giao diện quản lý đơn hàng đã mua 98

Hình 45-Hình ảnh trang giao diện chi tiết hóa đơn 99

Hình 46-Hình ảnh trang giao diện đăng nhập admin 100

Hình 47-Hình ảnh trang giao diện chủ admin 101

Hình 48-Hình ảnh trang giao diện danh sách 1 loại sản phẩm 103

Hình 49-Hình ảnh trang giao diện thêm sản phẩm 104

Hình 50-Hình ảnh trang giao diện xóa sản phẩm 106

Hình 51-Hình ảnh trang giao diện trang thống kê 107

Bảng 1-Bảng so sánh giữa RDBMS và MongoDB 11

Bảng 2-Bảng đặc tả use case view home page 45

Bảng 3-Bảng đặc tả use case register 46

Bảng 4-Bảng đặc tả use case search product 47

Bảng 5-Bảng đặc tả use case view product detail 48

Bảng 6-Bảng đặc tả use case view news detail 48

Bảng 7-Bảng đặc tả use case login 49

Bảng 8-Bảng đặc tả use case login with Facebook 50

Bảng 9-Bảng đặc tả use case login with Google 51

Bảng 10-Bảng đặc tả use case View user info 52

Bảng 11-Bảng đặc tả use case update user info 53

Bảng 12-Bảng đặc tả use case add product 54

Bảng 13-Bảng đặc tả use case update products info 54

Bảng 14-Bảng đặc tả use case delete products 55

Bảng 15-Bảng đặc tả use case add news 56

Bảng 16-Bảng đặc tả use case update news info 57

Bảng 17-Bảng đặc tả use case delete news 58

Bảng 18-Bảng đặc tả use case buy product 60

Bảng 19-Bảng đặc tả use case Chat 60

Bảng 20-Bảng đặc tả use case logout 61

Bảng 21-Bảng đặc tả use case Statistic (Website owner) 62

Bảng 22-Bảng đặc tả use case add employee 62

Bảng 23-Mô tả chi tiết bảng dữ liệu Authorization 76

Bảng 24-Mô tả chi tiết bảng dữ liệu User 77

Bảng 25-Mô tả chi tiết bảng dữ liệu NewsCategory 78

Bảng 26-Mô tả chi tiết bảng dữ liệu ProductCategory 78

Bảng 27-Mô tả chi tiết bảng dữ liệu Product 79

Bảng 32-Bảng mô tả chi tiết các đối tượng trên giao diện trang chủ 86

Bảng 33-Bảng mô tả chi tiết các đối tượng trên giao diện trang chi tiết sản phẩm 87

Bảng 34-Bảng mô tả chi tiết các đối tượng trên giao diện trang đăng nhập khách hàng 88 Bảng 35-Bảng mô tả chi tiết các đối tượng trên giao diện trang đăng ký khách hàng 89

Bảng 36-Bảng mô tả chi tiết các đối tượng trên giao diện trang tin tức 92

Bảng 37-Bảng mô tả chi tiết các đối tượng trên giao diện trang danh mục 1 loại sản phẩm 93

Bảng 38-Bảng mô tả chi tiết các đối tượng trên giao trang giỏ hàng 94

Bảng 39-Bảng mô tả chi tiết các đối tượng trên giao diện trang thông tin đặt hàng 95

Bảng 40-Bảng mô tả chi tiết các đối tượng trên trang thông tin đặt hàng 97

Bảng 41-Bảng mô tả chi tiết các đối tượng trên giao diện trang danh sách đơn đã đặt 98

Bảng 42-Bảng mô tả chi tiết các đối tượng trên giao diện trang chi tiêt hóa đơn 99

Bảng 43-Bảng mô tả chi tiết các đối tượng trên giao diện trang đăng nhập admin 100

Bảng 44-Bảng mô tả chi tiết các đối tượng trên giao diện trang chủ admin 102

Bảng 45-Bảng mô tả chi tiết các đối tượng trên giao diện trang danh sách 1 loại sản phẩm 104

Bảng 46-Bảng mô tả chi tiết các đối tượng trên giao diện trang thêm sản phẩm 105

Bảng 47-Bảng mô tả chi tiết các đối tượng trên giao diện trang sửa sản phẩm 106

Bảng 48-Bảng mô tả chi tiết các đối tượng trên giao diện trang thống kê 107

PHẦN 1: PHẦN MỞ ĐẦU

1 TÍNH CẤP THIẾT ĐỀ TÀI

Mọi công việc, công nghệ có ngày đổi mới, phát triển nhưng môi trường sống càng ngày lại càng đi xuống thì cũng như chúng ta đang dần hủy hoại chính cuộc sống của

mình

quan tâm Trong khi đó môi trường sống là cần thiết là nơi bắt đầu từ tất cả để học tập, làm việc Để mọi người có thể vừa đổi mới theo xu hướng công nghệ mà cũng vừa đề cao tầm quan trọng của môi trường sống hằng ngày Chúng em quyết định làm một trang web bán các sản phẩm thân thiện với môi trường cũng như thông báo bằng những tin tức mới nhất được cập nhập về môi trường sống xung quanh Từ đó

mọi người sẽ nắm những thông tin nhanh hơn, và ý thức hơn

hằng ngày Hay muốn biết và yêu môi trường chúng ta sống Để đáp ứng và truyền tải yêu cầu của khách hàng đều sẽ thực hiện một cách nhanh chóng, không mất nhiều thời gian chờ đợi như trước đây cần một trang web về môi trường

2 MỤC TIÊU CỦA ĐỀ TÀI

 Tìm hiểu các công nghệ liên quan đến đề tài như:

+ Tìm hiểu HTML5, CSS3

+ Tìm hiểu Javascript, Bootstrap

+ Tìm hiểu Frameword Express

+ Tìm hiểu kỹ thuật NodeJS

+ Thư viện EJS

+ Tìm hiểu MongoDb Atlas

+ Tìm hiểu chứng thực PassportJS và JWT

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

o Đăng nhập nhanh bằng Google/Facebook

o Quản lý tài khoản (Xem/Cập nhật thông tin)

o Tìm kiếm sản phẩm có sẵn Nhận thông báo khi không tìm thấy sản phẩm

o Xem chi tiết sản phẩm

o Xem chi tiết tin tức về môi trường

o Chat online, tương tác giữa người dùng với người dùng, giữa người dùng với người quản lý trang web

o Xem sản phẩm giỏ hàng

o Tạo sản phẩm, chỉnh sửa sản phẩm vào website

o Tạo tin tức, chỉnh sửa tin tức vào website

3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU

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

 Công nghệ Express, NodeJS, MongoDb Atlas

 Ngôn ngữ: Javascript

 Các thư viện hỗ trợ:

o EJS

 Lĩnh vực mà website phát triển: Bán sản phẩm thân thiện với môi trường

 Mô hình triển khai: Mô hình MVC

3.2 Phạm vi nghiên cứu

 Phạm vi nghiên cứu hướng đến các mô hình mua bán sản phẩm thân thiện với

4 KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC

 Nghiên cứu hiểu rõ các thành phần cơ bản của công nghệ như: Express, NodeJS, Mongodb Atlas

 Tìm hiểu ngôn ngữ: Javascript

 Sử dụng công nghệ xây dựng thành công website bán các sản phẩm thân thiện với môi trường

 Phát triển đầy đủ các chức năng cho người dùng cuối như:đăng ký, đăng nhập bằng email, đăng nhập bằng Google/Facebook, quản lý tài khoản, xem danh mục sản phẩm, tìm kiếm sản phẩm, lọc sản phẩm theo giá, xem chi tiết sản phẩm, xem tin tức, mua hàng

 Phát triển đầy đủ các tính năng cho quản trị viên: quản lý sản phẩm, quản lý

tin tức, quản lý thông tin khách hàng, nhân viên

 Phát triển các chức năng quản trị cho website như: quản lý người dùng, quản

lý sản phẩm, tin tức, thống kê, báo cáo

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

PHẦN 2: PHẦN NỘI DUNG

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

1 TÌM HIỂU CÔNG NGHỆ

1.1 Tìm hiểu Javascript

1.1.1 Khái niệm Javascript

 JavaScript là một ngôn ngữ lập trình đa nền tảng (cross-platform), ngôn ngữ lập trình kịch bản, hướng đối tượng JavaScript là một ngôn ngữ nhỏ

và nhẹ (small and lightweight) Khi nằm bên trong một môi trường (host environment), JavaScript có thể kết nối tới các object của môi trường đó

và cung cấp các cách quản lý chúng (object)

 JavaScript chứa các thư viện tiêu chuẩn cho các object, ví dụ như: Array, Date, và Math, và các yếu tố cốt lõi của ngôn ngữ lập trình như: toán tử (operators), cấu trúc điều khiển (control structures), và câu lệnh JavaScript có thể được mở rộng cho nhiều mục đích bằng việc bổ sung thêm các object; Ví dụ:

o Client-side JavaScript - JavaScript phía máy khách, JavaScript được

mở rộng bằng cách cung cấp các object để quản lý trình duyệt và Document Object Model (DOM) của nó Ví dụ, phần mở rộng phía máy khách cho phép một ứng dụng tác động tới các yếu tố trên một trang HTML và phản hồi giống các tác động của người dùng như click chuột, nhập form và chuyển trang

o Server-side JavaScript - JavaScript phía Server, JavaScript được mở

rộng bằng cách cung cấp thêm các đối tượng cần thiết để chạy JavaScript trên máy chủ Ví dụ, phần mở rộng phía server này cho phép ứng dụng kết nối với cơ sở dữ liệu (database), cung cấp thông tin một cách liên tục từ một yêu cầu tới phần khác của ứng dụng, hoặc thực hiện thao tác với các tập tin trên máy chủ

1.1.2 Tiêu chuẩn ECMAScript

 JavaScript được tiêu chuẩn hóa tại Ecma International — the European association for standardizing information and communication systems, Liên kết Châu Âu cho các tiêu chuẩn hóa hệ thống thông tin và truyền thông (ECMA trước đây là viết tắt cho the European Computer Manufacturers Association) cung cấp một tiêu chuẩn hóa, nền tảng ngôn ngữ lập trình mở quốc tế lên JavaScript Phiên bản đã tiêu chuẩn hóa của JavaScript được gọi là ECMAScript, làm việc giống với cái cách mà tất cả ứng dụng đã được hỗ trợ theo tiêu chuẩn

 Các công ty có thể sử dụng tiêu chuẩn ngôn ngữ mở (open standard language) để phát triển các implementation của JavaScript riêng cho họ Tiêu chuẩn ECMAScript là tài liệu nằm trong tiêu chuẩn ECMA-262 (ECMA-262 specification) Xem New in JavaScript để biết thêm về sự khác nhau giữa các phiên bản JavaScript cũng như sự khác nhau của phiên bản tiêu chuẩn ECMAScript (ECMAScript specification editions)

 Tiêu chuẩn ECMA-262 cũng đã được phê duyệt bởi ISO (International Organization for Standardization) tại ISO-16262 Bạn cũng có thể tìm tiêu chuẩn trên the Ecma International website Tiêu chuẩn ECMAScript không bao gồm các mô tả cho Document Object Model (DOM), nó được tiêu chuẩn hóa bởi World Wide Web Consortium (W3C)

 DOM định nghĩa cách mà các đối tượng trong HTML tiếp xúc với các đoạn script của bạn Để có được một cảm nhận tốt hơn về các công nghệ khác nhau được sử dụng khi lập trình với JavaScript, hãy tham khảo bài viết tổng quan về công nghệ JavaScript [1]

1.2 Tìm hiểu NodeJS

1.2.1 Khái niệm NodeJS

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

 Node.js chứa một thư viện built-in cho phép các ứng dụng hoạt động như một Webserver mà không cần phần mềm như Nginx, Apache HTTP Server hoặc IIS

 Node.js cung cấp kiến trúc hướng sự kiện (event-driven) và non-blocking I/O API, tối ưu hóa thông lượng của ứng dụng và có khả năng mở rộng cao Mọi hàm trong Node.js là không đồng bộ (asynchronous) Do đó, các tác vụ đều được xử lý và thực thi ở chế độ nền (background processing)

 Node.js áp dụng cho các sản phẩm có lượng truy cập lớn, cần mở rộng nhanh, cần đổi mới công nghệ, hoặc tạo ra các dự án Startup nhanh nhất

có thể

1.2.2 Những ứng dụng sử dụng NodeJS

 Xây dựng websocket server (Chat server)

 Hệ thống Notification (Giống như facebook hay Twitter)

 Ứng dụng upload file trên client

 Các máy chủ quảng cáo

 Các ứng dụng dữ liệu thời gian thực khác

1.2.3 Ưu và nhược điểm NodeJS

 Ưu điểm

 Đặc điểm nổi bật của Node.js là nó nhận và xử lý nhiều kết nối chỉ với một single-thread Điều này giúp hệ thống tốn ít RAM nhất và chạy nhanh nhất khi không phải tạo thread mới cho mỗi truy vấn giống PHP Ngoài ra, tận dụng ưu điểm non-blocking I/O của Javascript mà Node.js tận dụng tối đa tài nguyên của server mà không tạo ra độ trễ như PHP

 JSON APIs Với cơ chế event-driven, non-blocking I/O(Input/Output)

và mô hình kết hợp với Javascript là sự lựa chọn tuyệt vời cho các dịch

vụ Webs làm bằng JSON

 Ứng dụng trên 1 trang (Single page Application) Nếu bạn định viết 1 ứng dụng thể hiện trên 1 trang (Gmail?) NodeJS rất phù hợp để làm

nhanh Các ứng dụng bạn định viết không muốn nó tải lại trang, gồm rất nhiều request từ người dùng cần sự hoạt động nhanh để thể hiện sự chuyên nghiệp thì NodeJS sẽ là sự lựa chọn của bạn

 Shelling tools unix NodeJS sẽ tận dụng tối đa Unix để hoạt động Tức

là NodeJS có thể xử lý hàng nghìn Process và trả ra 1 luồng khiến cho hiệu xuất hoạt động đạt mức tối đa nhất và tuyệt vời nhất

 Streamming Data (Luồng dữ liệu) Các web thông thường gửi HTTP request và nhận phản hồi lại (Luồng dữ liệu) Giả xử sẽ cần xử lý 1 luồng giữ liệu cực lớn, NodeJS sẽ xây dựng các Proxy phân vùng các luồng dữ liệu để đảm bảo tối đa hoạt động cho các luồng dữ liệu khác

 Ứng dụng Web thời gian thực Với sự ra đời của các ứng dụng di động

& HTML 5 nên Node.js rất hiệu quả khi xây dựng những ứng dụng thời gian thực (real-time applications) như ứng dụng chat, các dịch vụ mạng xã hội như Facebook, Twitter

 Nhược điểm

 Ứng dụng nặng tốn tài nguyên Nếu bạn cần xử lý các ứng dụng tốn tài nguyên CPU như encoding video, convert file, decoding encryption… hoặc các ứng dụng tương tự như vậy thì không nên dùng NodeJS (Lý do: 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 sẽ lâu hơn 1 chút) Trường hợp này bạn hãy viết 1 Addon C++ để tích hợp với NodeJS để tăng hiệu suất tối đa!

 NodeJS và ngôn ngữ khác NodeJS, PHP, Ruby, Python NET …thì việc cuối cùng là phát triển các App Web NodeJS mới sơ khai như các ngôn ngữ lập trình khác Vậy nên đừng hi vọng NodeJS sẽ hơn PHP, Ruby, Python ở thời điểm này Nhưng với NodeJS bạn có thể có 1 ứng dụng như mong đợi, điều đó là chắc chắn!

1.2.4 Những trường hợp nên sử dụng NodeJS

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

Node.js hay bị rơi vào trường hợp thắt cổ chai khi làm việc với những file dung lượng lớn

- Một ứng dụng chỉ toàn CRUD: Node.js không nhanh hơn PHP khi bạn làm các tác vụ mang nặng tính I/O như vậy Ngoài ra, với sự ổn định lâu dài của các webserver script khác, các tác vụ CRUD của nó đã được tối ưu hóa Còn Node.js? Nó sẽ lòi ra những API cực kỳ ngớ ngẩn

- Khi bạn cần sự ổn định trong ứng dụng của bạn: Chỉ với 4 năm phát triển của mình (2009-2013), version của Node.js đã là 0.10.15 (hiện tại tới thời điểm này là v13.5.0) Mọi API đều có thể thay đổi – một cách không tương thích ngược – hãy thật cẩn thận với những API mà bạn đang dùng, và luôn đặt câu hỏi: “Khi nó thay đổi, nó sẽ ảnh hưởng gì đến dự án của tôi?”

- Và quan trọng nhất: Bạn chưa hiểu hết về Node.js! Node.js cực kỳ nguy hiểm trong trường hợp này, bạn sẽ rơi vào một thế giới đầy rẫy cạm bẫy, khó khăn Với phần lớn các API hoạt động theo phương thức non-blocking/async việc không hiểu rõ vấn đề sẽ làm cho việc xuất hiện những error mà thậm chí bạn không biết nó xuất phát từ đâu? Và mệt mỏi hơn nữa: Khi cộng đồng Node.js chưa đủ lớn mạnh, và sẽ ít có sự support từ cộng đồng Khi mà phần lớn cộng đồng cũng không khá hơn bạn là bao

 Nên dùng NodeJS khi:

- Node.js thực sự tỏa sáng trong việc xây dựng RESTful API (json) Gần như không có ngôn ngữ nào xử lý JSON dễ dàng hơn Javascript, chưa

kể các API server thường không phải thực hiện những xử lý nặng nề nhưng lượng concurrent request thì rất cao Mà Node.js thì xử lý non-blocking Chẳng còn gì thích hợp hơn Node.js trong trường hợp này!

- 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, từ nó 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

- Những ứng dụng thời gian thực: Khỏi phải nói vì Node.js dường như

- Những website stateful Node.js xử lý mọi request trên cùng một process giúp cho việc xây dựng các bộ nhớ đệm chưa bao giờ đơn giản đến thế: Hãy lưu nó vào một biến global, và thế là mọi request đều có thể truy cập đến bộ nhớ đệm đó Caching sẽ không còn quá đau đầu như trước đây, và bạn có thể lưu cũng như chia sẻ trạng thái của một client với các client khác ngay trong ngôn ngữ, chứ bạn không cần thông qua các bộ nhớ ngoài!

- Quan trọng nhất: yêu thích và muốn sử dụng nó [2]

1.2.5 Những kết luận sai lầm về NodeJS

 Thứ nhất, Nodejs là một nền tảng (platform), không phải Web Framework, cũng không phải ngôn ngữ lập trình

 Thứ hai, Nodejs không hỗ trợ đa luồng, nó là một máy chủ đơn luồng

 Và một điều nữa, Nodejs không dành cho người mới tinh mà chưa biết

gì về lập trình, vì như đã nói ở trên, Nodejs không phải là ngôn ngữ lập trình, để học được Nodejs thì bạn cần phải biết về Javascript, kỹ thuật lập trình, một số giao thức

1.2.6 Những công ty lớn nào đang sử dụng NodeJS

 Amazon, Ebay, Linkedin, Microsoft, Paypal, Trello, Uber và còn nhiều cái tên nổi tiếng khác nữa Theo như Paypal thì sử dụng Nodejs làm giảm thời gian đáp ứng lên tới 35%

 Còn về phía Linkedin chuyển từ Ruby sang sử dụng Nodejs để xử lý các truy cập từ mobile, và con số Server sử dụng giảm từ 30 còn 3, giảm gần 90% [3]

1.3 Tìm hiểu Express Framework của NodeJS

 Express.js là một Framework nhỏ, nhưng linh hoạt được xây dựng trên nền tảng của Nodejs Nó cung cấp các tính năng mạnh mẽ để phát triển web hoặc mobile

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

 Về performance: Express cung cấp thêm về các tính năng (feature) để dev lập trình tốt hơn Chứ không làm giảm tốc độ của NodeJS

 Và hơn hết, các Framework nổi tiếng của NodeJS hiện nay đều sử dụng ExpressJS như một core function, chẳng hạn: SailsJS, MEAN [4]

 NoSQL là 1 dạng CSDL mã nguồn mở không sử dụng Transact-SQL để truy vấn thông tin NoSQL viết tắt bởi: None-Relational SQL, hay có nơi thường gọi là Not-Only SQL CSDL này được phát triển trên Javascript Framework với kiểu dữ liệu JSON (Cú pháp của JSON là “key:value”) NoSQL ra đời như là 1 mảnh vá cho những khuyết điểm và thiếu xót cũng như hạn chế của mô hình dữ liệu quan hệ RDBMS về tốc độ, tính năng, khả năng mở rộng, memory cache

 Các thuật ngữ hay sử dụng trong MongoDB

 _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

 Collection – Là nhóm của nhiều document trong MongoDB Collection có thể được hiểu là một bảng tương ứng trong cơ sở dữ liệu RDBMS (Relational Database Management System) Collection nằm trong một cơ

sở dữ liệu duy nhất Các collection không phải định nghĩa các cột, các hàng hay kiểu dữ liệu trước

 Cursor – Đây là một con trỏ đến tập kết quả của một truy vấn Máy khách

có thể lặp qua một con trỏ để lấy kết quả

 Database – 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

 Document – Một bản ghi thuộc một Collection thì được gọi là một

Document Các Document lần lượt bao gồm các trường tên và giá trị

 Field – Là cặp name – value trong một document Một document có thể

không cần có đủ các Field Các trường giống các cột ở cơ sở dữ liệu quan

hệ

 JSON – Viết tắt của JavaScript Object Notation Con người có thể đọc

được ở định dạng văn bản đơn giản thể hiện cho các dữ liệu có cấu trúc

Hiện tại JSON đang hỗ trợ rất nhiều ngôn ngữ lập trình

 Index – Là những cấu trúc dữ liệu đặc biệt, dùng để chứa một phần nhỏ

của các tập dữ liệu một cách dễ dàng để quét Chỉ số lưu trữ giá trị của một

fields cụ thể hoặc thiết lập các fields, sắp xếp theo giá trị của các fields

này Index hỗ trợ độ phân tích một cách hiệu quả các truy vấn Nếu không

có chỉ mục, MongoDB sẽ phải quét tất cả các documents của collection để

chọn ra những document phù hợp với câu truy vấn Quá trình quét này là

không hiệu quả và yêu cầu MongoDB để xử lý một khối lượng lớn dữ liệu

 So sánh giữa RDBMS (Relational database management system) và

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

 Các kiểu dữ liệu trong MongoDB

- Chuỗi: Đây là kiểu dữ liệu được sử dụng phổ biến nhất để lưu giữ dữ liệu Chuỗi trong MongoDB phải là UTF-8 hợp lệ

- Số nguyên: Kiểu dữ liệu này được sử dụng để lưu một giá trị số Số nguyên

có thể là 32bit hoặc 64bit phụ thuộc vào Server

- Boolean: Kiểu dữ liệu này được sử dụng để lưu giữ một giá trị Boolean (true/false)

- Double: Kiểu dữ liệu này được sử dụng để lưu các giá trị số thực dấu chấm động

- Min/ Max keys: Kiểu dữ liệu này được sử dụng để so sánh một giá trị với các phần tử BSON thấp nhất và cao nhất

- Mảng: Kiểu dữ liệu này được sử dụng để lưu giữ các mảng hoặc danh sách hoặc nhiều giá trị vào trong một key

- Timestamp: Đánh dấu thời điểm một Document được sửa đổi hoặc được thêm vào

- Object: Kiểu dữ liệu này được sử dụng cho các Document được nhúng vào

- Null: Kiểu dữ liệu này được sử dụng để lưu một giá trị Null

- Symbol: Kiểu dữ liệu này được sử dụng giống như một chuỗi

- Date: Kiểu dữ liệu này được sử dụng để lưu giữ date và time hiện tại trong định dạng UNIX time

- Object ID: Kiểu dữ liệu này được sử dụng để lưu giữ ID của Document

- Binary data: Kiểu dữ liệu này được sử dụng để lưu giữ dữ liệu nhị phân

- Code: Kiểu dữ liệu này được sử dụng để lưu giữ JavaScrip code vào trong Document

- Regular expression: Kiểu dữ liệu này được sử dụng để lưu giữ Regular Expresion [5]

1.5 Tìm hiểu về Socket.io

 Định nghĩa Socket.io

- Để xây dựng một ứng dụng realtime cần sử dụng socketio Socketio sẽ giúp các bên ở những địa điểm khác nhau kết nối với nhau, truyền dữ liệu ngay lập tức thông qua server trung gian Socketio có thể được sử dụng trong nhiều ứng dụng như chat, game online, cập nhật kết quả của một trận đấu đang xảy ra,…

- Socketio không phải là một ngôn ngữ, mà chỉ là 1 công cụ giúp thực hiện những ứng dụng realtime Vì thế, không thể sử dụng socketio để thay thế hoàn toàn cho một ngôn ngữ, mà phải sử dụng kết hợp với một ngôn ngữ khác Ngôn ngữ đó có thể là php, asp.net, nodejs,…

 Cài đặt

- Trước Phía server Đây là nơi sẽ cài đặt socket io Ngôn ngữ để dựng server

có thể là php, asp.net, nodejs,… Tuy nhiên, tùy vào ngôn ngữ lựa chọn mà cách cấu trúc server khác nhau Ở đây, nếu được thì khuyến khích sử dụng nodejs để dựng server, vì như vậy có thể cài trực tiếp socketio vào cùng một server Nếu sử dụng php thì phải cài thêm những package khác, hoặc phải chuẩn bị riêng server để chạy socketio

- Phía client: Ở phía client sẽ xây dựng giao diện người dùng Ở đây có thể

sử dụng js, hoặc các thư viện của js như jquery,… Nói chung là ngôn ngữ

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

package cần thiết trên server để có thể làm web và ứng dụng realtime Để cài những package này mở màn hình cmd > cd đến thư mục Demo > gõ

dòng lệnh npm install express ejs socketio Khi cài đặt thành công, hệ thống

sẽ tự tạo thư mục nodemodules

 Cơ chế hoạt động của Socket.io

 Các hàm các middleware của passport

 Khai báo sử dụng Socket.io

- Cơ chế hoạt động của một ứng dụng realtime đó là thông qua server để lắng nghe (listen) data và truyền data về các máy client Vì vậy cần cài khai báo sử dụng socketio ở cả phía server và client

 Cơ chế lắng nghe và truyền dữ liệu

- Để lắng nghe data, ta sử dụng câu lệnh socket.on(), để phát dữ liệu thì sử dụng lệnh socket.emit()

- Ví dụ, client gửi 1 đoạn chat đi, thì khi đó ở phía server cần viết code để nhận dữ liệu đoạn code đó và truyền dữ liệu chat đó đi đến các server khác Đồng thời ở ở phía client cũng cần viết code để gửi và nhận dữ liệu

có thể sử dụng Twitter, Facebook, Google thậm chí là qua password trong database Bạn cũng có thể tùy biến chính xác các route nào cần phải authentication

username- Cài đặt

- Trước khi bắt tay vào thực hiện phân quyền cho projectn hay nói cách khác

là sử dụng passport cho phần phân quyền Để sử dụng được passport bạn

có tối thiểu 3 bước : Require thằng passport và chèn 2 thằng middile của

nó vào express là passport.initialize() và passport.session() Chú ý là ứng dụng express của bạn cần sử dụng đến express-session

 Xây dựng chức năng login sử dụng passport

 Trước khi bắt tay vào thực hiện phân quyền cho projectn hay nói cách khác

là sử dụng passport cho phần phân quyền Để sử dụng được passport bạn

có tối thiểu 3 bước : Require thằng passport và chèn 2 thằng middile của

nó vào express là passport.initialize() và passport.session() Chú ý là ứng dụng express của bạn cần sử dụng đến express-session

 Khi có request Login sẽ gọi đến thằng passport.serializeUser mà ta đã định nghĩa trước đó Hàm này truy cập vào đối tượng user mà ta trả về cho middleware passport.authenticate và xác định xem thành phần nào của đối tượng sẽ lưu vào trong session Kết quả của hàm này là ta sẽ có đối tượng req.session.passport.user = các thông tin ta truyền vào trong serializeUser.Trong ví dụ bên trên thì nó là user Đồng thời với trên passport cũng có gắn thông tin user vào req.user

 Khi request được tính là đã xác thực nó sẽ gọi hàm passport.deserializeUser Hàm này sử dụng thông tin trong session để lấy

dữ liệu đầy đủ về thằng user rồi gắn nó vào req.user

 Các hàm các middleware của passport

 passport.initialize : middleware được gọi ở từng request, kiểm tra session lấy ra passport.user nếu chưa có thì tạo rỗng

 passport.session: middleware sử dụng kịch bản Passport , sử dụng session lấy thông tin user rồi gắn vào req.user

 passport.deserializeUser : hàm được gọi bởi passport.session Giúp ta lấy

dữ liệu user dựa vào thông tin lưu trên session và gắn vào req.user

 passport.authenticate: middleware giúp ta gắn kịch bản local vào route

 passport.serializeUser: hàm được gọi khi xác thực thành công để lưu thông

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

2 TÌM HIỂU MÔ HÌNH MVC TRONG XÂY DỰNG WEBSITE

2.1 Tìm hiểu mô hình MVC

 MVC viết tắt của 3 từ đó là Model – View – Controller (MVC) là mẫu thiết

kế nhằm mục tiêu chia tách phần Giao diện và Code để dễ quản lý, phát triển

và bảo trì

 Mỗi phần lại có có một nhiệm vụ xử lý khác nhau, đối với trong mô hình mvc trong java nói riêng và mô hình mvc nói chung thì:

o Model: Tương tác và truy xuất dữ liệu đến database (cơ sở dữ liệu)

o View: Giao diện mà người dùng có thể nhìn thấy, tuy nhiên thường

view chỉ có một nhiệm vụ duy nhất là hiển thị dữ liệu Trong Java web view chính là file jsp

o Controller: Nó có nhiệm vụ điều khiển tương tác giữa Model và View

cũng như xử lý logic nghiệp vụ (Business) Trong Java web controller

Controller xử lý nghiệp vụ, logic business và gữi trả lại cho view View thực hiện nhiệm vụ hiển thị dữ liệu đúng kết quả cho người dùng yêu cầu

2.2 Chi tiết từng lớp mô hình MVC

2.2.1 Model

 Đây là phần truy vấn csdl và kiểm tra logic bao gồm 3 thành phần là BO (business object), DAO (data access object) và java bean Chức năng của các thành phần như sau:

o BO: đây là phần xử lý logic của chương trình, là trung gian giữa Controller

và DAO, các lớp khác muốn giao tiếp với csdl phải thông qua trung giang

BO Nó chỉ biết sự tồn tại của DAO và java bean

o DAO: đây là phần làm việc trực tiếp với csdl, chúc năng của nó là truy vấn

csdl, chú ý rằng việc giao tiếp csdl chỉ duy nhất xuất hiện ở lớp DAO, các lớp khác muốn làm việc với csdl phải thông qua nó Nó chỉ biết sự tồn tại của java bean

o JAVA BEAN: đây là những class java thường được xây dựng mô phỏng lại

1 cấu trúc bản dữ liệu trong csdl gồm các cấu trúc getter và setter Nó được

ví như mạch máu vì nó xuất hiện ở tất cả 3 thành phần là Model, Controller

và cả View, nó giúp 3 thành phần của MVC giao tiếp được với nhau Java bean không cần biết sự tồn tại của bất kỳ lớp nào khác, nó chỉ đơn thuần là 1 class thuần java

 Mô hình hoạt động của DAO, BO và java bean:

Hình 2-Mô hình hoạt động của DAO, BO và JAVA BEAN [6]

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

2.2.2 View

 Phần này quy định về giao diện và tương tác với người dùng thông qua các mã html và javascript Ở đây ta sử dụng jsp để thay thế cho thuần html để tạo ra 1 trang web động Các views sẽ được Controller điều hướng đến và chúng chỉ biết đến sự tồn tại của java bean

2.2.3 Controller

 Nó có nhiệm vụ điều khiển tương tác giữa Model và View cũng như xử lý logic nghiệp vụ (Business) Có thể giải thích kỹ hơn nữa đối với trong Java thì

controller lấy dữ liệu từ model sau đó gữi đến view

2.3 Ưu - Nhược điểm mô hình MVC

2.3.1 Ưu điểm

 Theo tôi việc sử dụng MVC mang tính chất chuyên nghiệp trong lập trình web vì

nó mang tính logic cao nhưng đơn giản, phân tách rõ ràng các chức năng cần làm của một ứng dụng, qua đó nhiều người có thể làm chung dự án, phát hiện và sửa lỗi, dễ nâng cấp tính năng đồng thời khi bảo trì cũng rất dễ dàng

2.3.2 Nhược điểm

 MVC khi dùng trong các project nhỏ sẽ gây phức tạp vấn đề cần giải quyết

 Mặc dù, MVC tỏ ra lợi thế hơn nhiều so với cách lập trình thông thường Nhưng MVC luôn phải nạp, load những thư viện đồ sộ để xử lý dữ liệu Chính điều này làm cho mô hình trở nên chậm chạp hơn nhiều so với việc code tay thuần túy

 MVC đòi hỏi người tiếp cận phải biết qua OOP, có kinh nghiệm tương đối cho việc thiết lập và xây dựng một ứng dụng hoàn chỉnh Sẽ rất khó khăn nếu MVC tận dụng mảng là thành phần chính cho việc truy xuất dữ liệu Nhất là với việc sử dụng active record để viết ứng dụng Chúng luôn cần người viết phải nắm vứng

mô hình mảng đa chiều. [6]

CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU

1 KHẢO SÁT HIỆN TRẠNG

1.1 Nhận xét một số website về môi trường

1.1.1 Website : https://yeumoitruong.vn

1.1.1.1 Một số hình ảnh

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

Hình 3-Hình ảnh trang giao diện trang chủ (admin, user )

Hình 4-Trang diễn đàn

Hình 5-Trang môi trường

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

Hình 6-Trang chi tiết sản phẩm

Hình 7-Form đăng kí

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

Hình 8-Form đăng nhập

1.1.1.2 Ưu điểm

1.1.1.2.1 Giao diện

- Gam màu: xanh, trắng, xám chủ đạo hợp với đề tài môi trường, nhẹ nhàng

- Hiệu ứng: slide ảnh nhiều, khá hợp

- Bố cục sắp xếp: header, footer, thanh menu, nội dung khá đầy đủ

- Dữ liệu sản phẩm: nhiều loại khác nhau

- Có logo, popup quản cáo

1.1.1.2.2 Chức năng

- Tìm kiếm nhanh

- Chuyển trang nhanh

- Tích hợp diễn đàn tin tức và bán hàng khá hay

- Hỗ trợ khách hàng

- Đăng kí rất kĩ qua mail đảm bảo an toàn và tin cậy về thông tin khách hàng

KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN

- Thiết kế form đăng bài khá hay

1.1.1.3 Nhược điểm

- Không đăng nhập được với tài khoản facebook dù để đăng kí nhanh

- Slide chưa được linh hoạt

- Khá nhiều chữ, bố trí hơi khó nhìn ở phần diễn đàn và các mục liên quan