Đề tài: XÂY DỰNG WEBSITE 4FRUIT SHOP | ĐỒ ÁN HỌC PHẦN: CÔNG NGHỆ PHẦN MỀM

Ngày nay, ứng dụng công nghệ thông tin và việc tin học hóa đượ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 vài trò hết sức quan trọng, có thể tạo ra những bước đột phá mạnh mẽ.Tài liệu giúp bạn kham khảo,ôn tập và đạt kết quả cao. Mời bạn đọc đón xem!

54 27 lượt tải Tải xuống
Chia sẻ Báo cáo tài liệu

Môn: lịch sử Đảng cộng sản Việt Nam (SP1039)

Trường: Đại học Bách khoa Thành phố Hồ Chí Minh

Thông tin:

55 trang 3 tháng trước

Tác giả:

Profile hoa le
BỘ GIÁO DỤC VÀ ĐÀO TẠO




 !"#$"%&'
$(
Khoa: Công Nghệ Thông Tin
Giảng viên hướng dẫn: Ths. Dương Thành Phết
Sinh viên thực hiện:
2011062503 Đặng Tiến Đạt
20DTHC3
2011061543 Nguyễn Đức Hùng
20DTHC3
2011770453 Nguyễn Cửu Tính
20DTHC3
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
2011143127 Võ Minh Long
20DTHC3
TP. Hồ Chí Minh, ngày 28 tháng 10 năm 2022
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
)*+
Hình 1-1 Hình ảnh logo HTML,
Hình 1-2 Hình ảnh logo CSS-
Hình 1-3 Hình ảnh logo JavaScript.
Hình 1-4 Hình ảnh logo jQuery/
Hình 1-5 Hình ảnh logo mongoDB00
Hình 1-6 Hình ảnh logoo NodeJS01
Hình 2-1 Sơ đồ thực thể ERD23
Hình 2-2 Sơ đồ ERD20
Hình 2-3 Sơ đồ usecase tổng quát22
Hình 2-4 Sơ đồ usecase Admin21
Hình 2-5 Sơ đồ usecase Mua – Đặt hàng2%
Hình 2-6 Sơ đồ usecase Quản lý tài khoản của User2,
Hình 2-7 Sơ đồ usecase Xem giỏ hàng User2-
Hình 2-8 Mô hình Sequence Diagram24
Hình 3-1 Giao diện trang chủ13
Hình 3-2 Giao diện trang chủ - sản phẩm nổi bật13
Hình 3-3 Giao diện trang chủ - sản phẩm10
Hình 3-4 Giao diện trang chủ - thông tin liên hệ10
Hình 3-5 Giao diện đăng nhập12
Hình 3-6 Giao diện đăng nhập Admin12
Hình 3-7 Giao diện đăng ký11
Hình 3-8 Giao diện chọn sản phẩm cần thanh toán11
Hình 3-9 Giao diện thanh toán1%
Hình 3-10 Giao diện hoàn tất đơn1%
Hình 3-11 Giao diện lịch sử mua hàng1,
Hình 3-12 Giao diện trang admin1,
Hình 3-13 Giao diện thêm admin1-
Hình 3-14 Giao diện thêm sản phẩm1-
Hình 3-15 Giao diện sửa sản phẩm14
Hình 3-16 Giao diện xóa sản phẩm1.
Hình 3-17 Giao diện profile admin1/
Hình 3-18 Giao diện profile user%3
Hình 3-19 Giao diện Blog%3
Hình 3-20 Database admin%0
Hình 3-21 Database hóa dơn%2
Hình 3-22 Database sản phẩm%2
Hình 3-23 Database người dùng%1
Hình 3-24 Tìm kiếm sản phẩm%1
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
)*#5
#67809:;<6=>?@AB%%
#6782@C78DEFGH7%,
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
*I*
IJ'0
I5K2
I)()1
L'M*%
0 K$NIO'L,
1.1. TỔNG QUAN VỀ HTML..........................................................................................................................5
1.1.1. HTML là gì?.................................................................................................................................5
1.1.2. Ưu điểm, nhược điểm HTML.......................................................................................................5
1.2. TỔNG QUAN VỀ CSS/SCSS/SASS.........................................................................................................6
1.2.1. CSS/SCSS/SASS là gì?.................................................................................................................6
1.2.2. Các công dụng của CSS...............................................................................................................7
1.3. TỔNG QUAN VỀ JAVASCRIPT..................................................................................................................8
1.3.1. JavaScript là gì?..........................................................................................................................8
1.3.2. Vai trò JavaScript.........................................................................................................................8
1.3.3. Ưu, nhược điểm JavaScript..........................................................................................................9
1.4. TỔNG QUAN VỀ JQUERY........................................................................................................................9
1.4.1. jQuery là gì?..............................................................................................................................10
1.4.2. Các module phổ biến của Jquery...............................................................................................10
1.4.3. Ưu, nhược điểm của jQuery.......................................................................................................10
1.5. TỔNG QUAN VỀ MONGODB.................................................................................................................11
1.5.1. MongoDB là gì?.........................................................................................................................11
1.5.2. Các feature của MongoDB.........................................................................................................12
1.5.3. Ưu, nhược điểm của MongoDB.................................................................................................12
1.6. TỔNG QUAN VỀ NODEJS......................................................................................................................13
1.6.1. NodeJS là gì?.............................................................................................................................13
1.6.2. Ưu, nhược điểm của NodeJS......................................................................................................13
1.6.3. NodeJS dùng để làm gì?.............................................................................................................14
2 PQ')R0-
2.1. KHẢO SÁT VỀ HIỆN TRẠNG HỆ THỐNG.................................................................................................16
2.2. ĐỐI TƯỢNG VÀ MỤC TIÊU CỦA WEBSITE.............................................................................................16
2.2.1. Đối tượng:..................................................................................................................................16
2.2.2. Mục tiêu:....................................................................................................................................17
2.3. SƠ ĐỒ CHỨC NĂNG..............................................................................................................................20
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
2.3.1. Sơ đồ thực thể kết hợp................................................................................................................20
2.3.2. Sơ đồ usecase.............................................................................................................................22
2.3.3. Mô hình Sequence Diagram.......................................................................................................27
2.3.4. Bảng dữ liệu...............................................................................................................................27
1 $5S13
3.1. TRANG GIAO DIỆN TRANG CHỦ............................................................................................................30
3.2. GIAO DIỆN ĐĂNG NHẬP........................................................................................................................32
3.3. GIAO DIỆN ĐĂNG KÝ............................................................................................................................33
3.4. TRANG THANH TOÁN...........................................................................................................................33
3.5. TRANG QUẢN LÝ (ADMIN)...................................................................................................................35
3.6. TRANG PROFILE...................................................................................................................................39
3.7. TRANG BLOG.......................................................................................................................................40
3.8. DATABASE............................................................................................................................................41
3.9. TÌM KIẾM SẢN PHẨM............................................................................................................................43
% 9LI'TMUVW%%
4.1. KẾT QUẢ ĐẠT ĐƯỢC............................................................................................................................44
4.2. ĐÁNH GIÁ WEBSITE.............................................................................................................................44
4.2.1. Ưu điểm......................................................................................................................................44
4.2.2. Nhược điểm................................................................................................................................45
4.3. HƯỚNG PHÁT TRIỂN, MỞ RỘNG ĐỀ TÀI................................................................................................45
UI')95(%-
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
LỜI NÓI ĐẦU
Ngày nay, ứng dụng công nghệ thông tin và việc tin học hóa đượ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 vài trò hết sức quan trọng, có thể tạo ra những bước
đột phá mạnh mẽ.
Cùng với sự phát triển không ngừng về kỹ thuật máy tính và mạng điện tử,
công nghệ thông tin cũng đạt được những thành tựu ở đẳng cấp cao và lần lượt chinh
phục hết đỉnh cao này đến đỉnh cao khác. Mạng Internet là một trong những sản phẩm
có giá trị hết sức lớn lao và ngày càng trở thành công cụ không thể thiếu. Là nền tảng
chính cho sự truyền tải, trao đổi thông tin trên toàn cầu.
Giờ đây, mọi việc liên quan đến thông tin trở nên thật dễ dàng cho người sử
dụng: chỉ cần có một chiếc máy tính kết nối với internet và nội dung cần tìm kiếm thì
gần như cả thế giới này đang trong tay bạn. Bằng internet, chúng ta đã thực hiện được
nhiều công việc với tốc độ nhanh hơn và chi phí thấp hơn nhiều so với cách thức
truyền thống. Chính điều này, đã thúc đẩy sự khai sinh và phát triển của thương mại
điện tử trên khắp thế giới, làm biến đổi đáng kể về văn hóa, nâng cao chất lượng cuộc
sống con người.
Trong hoạt động sản xuất, kinh doanh, thương mại điện tử giờ đây đã khẳng
định được vai trò xúc tiến và thúc đẩy sự phát triển của doanh nghiệp. Đối với một cửa
hàng, việc quảng bá và giới thiệu đến khách hàng các sản phẩm mới đáp ứng được nhu
cầu của khách hàng sẽ là cần thiết.
Vì vậy, nhóm em thực hiện đồ án “ Xây Dựng Website Kinh Doanh Rau Quả
Tươi”, với đề tài và môn học này, nhóm xin chân thành cảm ơn sự giúp đỡ tận tình của
Thầy Dương Thành Phết. Do còn nhiều hạn chế đề tài nhóm xây dựng không tránh
khỏi những thiếu sót. Rất mong được thầy cô và các bạn đóng góp ý kiến để chương
trình ngày càng hoàn thiện và được đưa vào sử dụng.
1
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
LỜI CẢM ƠN
Với lòng biết ơn sâu sắc nhất, chúng em xin gửi đến ơn thầy
Dương Thành Phết người đã trực tiếp giúp đỡ, quan tâm, hướng
dẫn chúng em hoàn thành tốt bài báo cáo này trong thời gian qua.
Nhờ có những lời hướng dẫn, dạy bảo của các thầy nên đề tài học
phần của chúng em mới có thể hoàn thiện tốt đẹp.
Bài báo cáo thực hiện trong khoảng thời gian không nhiều
bước đầu đi vào thực tế của chúng em còn hạn chế và còn nhiều bỡ
ngỡ nên không tránh khỏi những thiếu sót. Chúng em rất mong nhận
được những ý kiến đóng góp quý báu của thầy để kiến thức của
chúng em trong lĩnh vực này được hoàn thiện hơn đồng thời có điều
kiện bổ sung, nâng cao kiến thức của mình.
Chúng em xin chân thành cảm ơn!
Sinh viên
thực hiện
Đặng Tiến Đạt
Nguyễn Đức Hùng
Nguyễn Cửu Tính
Võ Minh Long
2
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
I)()
Nhóm xin cam đoan đây là công trình nghiên cứu của nhóm,
không sao chép bất cứ kết quả nghiên cứu nào của các tác giả khác.
Các số liệu sử dụng phân tích trong đồ án có nguồn gốc rõ ràng, đã
được công bố theo đúng quy định. Các kết quả nghiên cứu trong đồ
án do nhóm tự tìm hiểu, phân tích một cách trung thực, khách quan
và phù hợp với thực tiễn của Việt Nam. Các kết quả này chưa từng
được công bố trong bất kỳ nghiên cứu nào khác. Nội dung đồ án có
tham khảo và sử dụng một số thông tin, tài liệu từ các nguồn sách,
giáo trình được liệt kê trong danh mục tài liệu tham khảo.
3
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
PHIẾU PHÂN CÔNG NHIỆM VỤ
$ $$MXYZ7 [\<78B]78^_BE`BE_7 F7E8F
a=_XH>
1 2011061543
Nguyễn Đức Hùng
b Phân tích yêu cầu, vẽ use case
,class, erd, Sequence Diagram,
chỉnh sửa báo cáo
b Xây dựng database users, products,
bills, admins với MongoDB
b Thiết kết giao diện, chức năng
trang home, trang Profile
b Xử lý API:
• Load user, sản phẩm hiển thị trên
trang Home, tìm kiếm sản phẩm,
thêm, xóa, sửa sản phẩm trong giỏ
hàng user
• Trang profile chỉnh sửa thông tin
user
• Load sản phẩm đã mua trên trang
purchase order
35%
10đ
2 2011770453
Nguyễn Cửu Tính
b Thiết kế giao diện và xử lý trang:
login và register
b Thiết kế giao diện trang blogs
b Thiết kế footer
20%
9đ
3 2011143127
Võ Minh Long
b Làm word báo cáo
b Tìm kiếm tài liệu
b Phân tích vấn đề
b Lên kế hoạch báo cáo
b Góp ý tưởng
b Thiết kế giao diện và xử lý trang
thanh toán
b Thiết kế giao diện và xử lý trang
cảm ơn
b Thiết kế giao diện và xử lý trang
lịch sử mua hàng(trang purchase
orders)
20%
8.5đ
4 2011062503
Đặng Tiến Đạt
b Phân tích yêu cầu, vẽ mô hình use
case, Sequence Diagram, Class
Diagram
b Lên kế hoạch, theo dõi và giám sát
quá trình làm đồ án (web, báo cáo).
25%
10đ
4
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
b Thiết kế giao diện và xử lý của
trang admin, trang login admin.
5
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
0 CƠ SỞ LÝ THUYẾT
00 Tổng quan về HTML
Hình 1-1 Hình ảnh logo HTML
1.1.1. HTML là gì?
Tạm dịch là ngôn ngữ đánh dấu siêu văn bản. Người ta thường
sử dụng HTML trong việc phân chia các đoạn văn, heading, links,
blockquotes,...Một Website thường chứa nhiều trang con và mỗi
trang con này lại có một tập tin HTML riêng.
Lưu ý, HTML không phải là ngôn ngữ lập trình. Điều này có
nghĩa là nó không thể thực hiện các chức năng “động”. Hiểu một
cách đơn giản hơn, cũng tương tự nhờ phần mềm Microsoft Word,
HTML chỉ có tác dụng bố cục và định dạng trang web. HTML khi kết
hợp với CSS và JavaScript sẽ trở thành một nền tảng vững chắc cho
thế giới mạng.
HTML document có đuôi file dạng .html hoặc htm. Bạn có thể
xem chúng bằng các trình duyệt web hiện hành nhƣ Google
Chrome, Firefox, Safari,... Nhiệm vụ của trình duyệt là đọc những file
HTML này và “biến đổi” chúng thành một dạng nội dung visual trên
Internet sao cho người dùng có thể xem và hiểu được chúng.
6
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
1.1.2. Ưu điểm, nhược điểm HTML
1.1.2.1. Ưu điểm:
Có nhiều tài nguyên hỗ trợ với cộng đồng ngƣời dùng vô cùng
lớn
Có thể hoạt động mƣợt mà trên hầu hết mọi trình duyệt hiện
nay
Học HTML khá đơn giản
Các markeup sử dụng trong HTML thƣờng ngắn gọn, có độ
đồng nhất cao
Sử dụng mã nguồn mở, hoàn toàn miễn phí
HTML là chuẩn web được vận hành bởi W3C
Dễ dàng để tích hợp với các loại ngôn ngữ backend (ví dụ nhƣ:
PHP, Node.js,...)
1.1.2.2. Nhược điểm:
Chỉ được áp dụng chủ yếu cho web tĩnh. Nếu muốn tạo các
tính năng động, lập trình viên phải dùng thêm JavaScript hoặc
ngôn ngữ backend của bên thứ 3.
Mỗi trang HTML cần được tạo riêng biệt, ngay có khi có nhiều
yếu tố trùng lặp như header, footer
Khó để kiểm soát cách đọc và hiển thị file HTML của trình
duyệt
Một vài trình duyệt còn chậm cập nhật để hỗ trợ tính năng mới
của HTML.
02 Tổng quan về CSS/SCSS/SASS
7
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
Hình 1-2 Hình ảnh logo CSS
1.2.1. CSS/SCSS/SASS là gì?
SCSS,SASS hay còn được gọi chung là CSSLà viết tắt của
Cascading Style Sheets, một ngôn ngữ thiết kế đơn giản, xử lý một
phần giao diện của trang web. CSS mô tả cách các phần tử HTML
hiển thị trên màn hình và các phương tiện khác.
Sử dụng CSS, bạn có thể kiểm soát màu chữ, cỡ chữ, kiểu chữ,
khoảng cách giữa các đoạn văn bản, kích thước của các thành phần
trên trang web, màu nền, thiết kế bố cục và cách trang web hiển thị
trên những màn hình có kích thước khác nhau cũng nhờ hàng loạt
hiệu ứng khác.
CSS rất hữu ích và tiện lợi. Nó có thể kiểm soát tất cả các
trang trên một website.
1.2.2. Các công dụng của CSS
CSS được dùng để định nghĩa kiểu cách cho các trang trên
website của bạn, gồm cả thiết kế, dàn trang và các cách hiển thị
khác nhau trên nhiều thiết bị với kích thước màn hình khác nhau.
CSS giúp giải quyết vấn đề lớn của HTML:
HTML không có phần tử để để định dạng cho trang web. HTML
chỉ được dùng để tạo nội dung cho trang. Khi các phần tử nhƣ
<font> và thuộc tính màu sắc được thêm vào HTML 3.2, cơn
ác mộng của các nhà phát triển web bắt đầu. Việc phát triển
8
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
một website lớn mà thêm thông tin font hay màu sắc vào từng
trang đòi hỏi rất nhiều thời gian.
CSS được ra đời để giúp loại bỏ việc định dạng kiểu cách khỏi
trang HTML.
Các định nghĩa liên quan đến kiểu cách được đưa vào tập tin
.css và nhờ vào tập tin stylesheet ngoài, bạn có thể thay đổi
toàn bộ website chỉ bằng một tập tin duy nhất.
Tiết kiệm thời gian: Ta có thể viết CSS một lần và sử dụng
lại chúng trên nhiều trang HTML. Có thể định kiểu cho từng phần tử
HTML và áp dụng kiểu đó cho bao nhiêu trang web tùy ý.
Tải trang nhanh hơn: Với CSS, ta không cần khai báo thuộc
tính cho từng tag HTML mỗi lầndùng tag đó. Nhờ đó, số lượng code
cần viết sẽ ít đi, thời gian load trang sẽ nhanh hơn.
Bảo trì dễ dàng: Để thực hiện thay đổi trên toàn bộ trang,
chỉ cần đổi kiểu trong file CSS và tất cả các thành phần trên trang
web sẽ đƣợc cập nhật tự động.
Có nhiều kiểu hơn HTML: CSS có một loạt thuộc tính, nhiều
hơn so với HTML khá nhiều. Nhờ đó bạn có thể làm cho trang web
hiển thị tốt hơn so với chỉ dùng HTML.
Tiêu chuẩn web toàn cầu: Các thuộc tính HTML hiện không
còn đƣợc sử dụng nữa, bạn được khuyên nên sử dụng CSS để có thể
tạo ra những trang web tương thích với mọi trình duyệt trong trương
lai.
Khả năng tương thích với nhiều thiết bị: CSS cho phép nội
dung được tối ưu hóa trên nhiều loại thiết bị. Bằng cách sử dụng
cùng một tài liệu HTML, nhưng nó có thể hiển thị tốt trên PC, điện
thoại, các thiết bị cầm tay hay khi in.
01 Tổng quan về JavaScript
9
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
Hình 1-3 Hình ảnh logo JavaScript
1.3.1. JavaScript là gì?
JavaScript là 1 trong 378]778cBEd7EBef=gDGh7Eijk, và nó được dùng
phổ biến trong suốt 20 năm qua. Từ thuở sơ khai, nó còn có tên là lBEf(năm
1995), sau đó được đổi thành Mona, Livescript, và cuối cùng là JavaScript như hiện
nay.
1.3.2. Vai trò JavaScript
Thông thường, các trang web sẽ được nhúng trực tiếp
JavaScript vào, hoặc sẽ sử dụng file mn để tham chiếu qua. Đây là
ngôn ngữ phía máy khách, nghĩa là thay vì xử lý tập lệnh trên server
của trang web, nó sẽ được tải về máy của khách truy cập và xử lý
trên chính chiếc máy đó.
Cần chú ý, hiện nay có một số trình duyệt web phổ biến cho
phép bạn bật/tắt JavaScript theo ý của bạn. Vậy nên, bạn cần biết
những trang web mà bạn muốn truy cập sẽ bị ảnh hưởng như thế
nào nếu như không có JavaScript hoạt động, từ đó sẽ quyết định có
bật/tắt nó hay không.
1.3.3. Ưu, nhược điểm JavaScript
1.3.3.1. Ưu điểm:
o^C=gDGh7E^Z7: Đây là ngôn ngữ dễ học, dễ để phát hiện và sửa lỗi
hơn. Thông qua JavaScript thì lập trình viên cũng có thể kiểm tra dữ liệu đầu vào,
10
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
nhằm giảm bớt công việc kiểm tra thủ công. JavaScript cũng khá linh hoạt, và nó có
thể được sử dụng ở nhiều nền tảng, trình duyệt, và không cần những công cụ quá
phức tạp bởi chúng có thể được biên dịch bởi HTML từ trình duyệt web.
o^CpEFBEG<qBgD: Ta có thể truy cập và tương tác với website hiệu quả
hơn. Nhờ đặc tính gọn nhẹ mà chúng sẽ cho phép thực hiện các tác vụ trên trang web
nhanh hơn.
1.3.3.2. Nhược điểm:
Nó rất dễ bị khai thác, thế nên chúng thu hút rất nhiều hacker thực hiện tìm
kiếm lỗi bảo mật để lợi dụng, từ đó sẽ chèn cắm các mã độc vào máy tính của người
sử dụng.
Việc linh hoạt hỗ trợ cho các thiết bị cũng có thể tạo ra trải nghiệm không
đồng nhất trên các thiết bị này, và đôi khi một số trình duyệt sẽ không hỗ trợ sử dụng
JavaScript.
0% Tổng quan về jQuery
Hình 1-4 Hình ảnh logo jQuery
1.4.1. jQuery là gì?
JQuerylà một thư viện JavaScript đa nền tảng và giàu tính năng, được thiết kế
nhằm đơn giản hóa client-side scripting của HTML. jQuery giúp chạy HTML
document traversal và manipulation, animation, event handling và AJAX chỉ bằng
một API rất dễ sử dụng, có thể hoạt động trên nhiều trình duyệt khác nhau. Từ đó
giúp cho việc sử dụng JavaScript trên trang web trở nên dễ dàng hơn, website sẽ có
11
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
tính tương tác và hấp dẫn hơn. Ngoài ra, jQuery cũng được sử dụng để bổ sung vào
các hiệu ứng.
1.4.2. Các module phổ biến của Jquery
Ajax (xử lý Ajax)
Effect (xử lý hiệu ứng)
DOM (xử lý Data Object Model)
Event (xử lý sự kiện)
Form (xử lý sự kiện liên quan đến form)
Attributes (xử lý thuộc tính của các đối tượng HTML)
Selector (xử lý luồng lách giữa các đối tượng HTML)
1.4.3. Ưu, nhược điểm của jQuery
1.4.3.1. Ưu điểm
Đơn giản, dễ sử dụng: Với cú pháp đơn giản, người dùng chỉ
phải viết ít dòng lệnh để tạo ra các chức năng tương tự, giúp tiết
kiệm thời gian hơn cho lập trình viên
Là một thư viện lớn của javaScript: Có khả năng thực thi nhiều
chức năng hơn so với các thư viện javaScript khác
Cộng đồng mã nguồn mở mạnh mẽ (một số plugin jquery có
sẵn): JQuery có một cộng đồng người dùng lớn giúp phát triển các
plugin. Nhờ đó mà hàng trăm plugin được viết sẵn để có thể tải về
ngay lập tức, giúp đẩy nhanh quá trình viết code của lập trình viên.
Đồng thời, các script này đều được đảm bảo an toàn và hiệu quả
cao.
Có sẵn nhiều tài liệu và hướng dẫn cụ thể: Các trang web
JQuery đều có sẵn các bộ tài liệu và hướng dẫn chi tiết, kể cả người
mới làm lập trình cũng có thể tham khảo và áp dụng trong thực tế.
1.4.3.2. Nhược điểm
Làm chậm Client: Client không chỉ phải hiển thị mà còn
phải xử lý nhiều chức năng được tạo thành từ jQuery. Nếu lạm dụng
12
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
jQuery nhiều sẽ làm chậm Client, đặc biệt là những Client yếu. Do
đó, lập trình viên sẽ cần phải dùng thêm cache.
Có thể không có một số chức năng: jQuery vốn sở hữu
rất nhiều chức năng, tùy thuộc vào yêu cầu trên trang web. Tuy
nhiên, do nhiều chức năng vẫn chưa được phát triển nên người dùng
sẽ vẫn cần đến javascript thuần để xây dựng chức năng này.
0, Tổng quan về MongoDB
Hình 1-5 Hình ảnh logo mongoDB
1.5.1. MongoDB là gì?
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.
0,2 Các feature của MongoDB
Các ad hoc query: hỗ trợ search bằng field, các phép
search thông thường, regular expression searches, và range
queries.
13
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
Indexing: bất kì field nào trong BSON document cũng có
thể được index.
Replication: có ý nghĩa là “nhân bản”, là có một phiên
bản giống hệt phiên bản đang tồn tại, đang sử dụng. Với cơ sở dữ
liệu, nhu cầu lưu trữ lớn, đòi hỏi cơ sở dữ liệu toàn vẹn, không bị
mất mát trước những sự cố ngoài dự đoán là rất cao. Vì vậy, người
ta nghĩ ra khái niệm “nhân bản”, tạo một phiên bản cơ sở dữ liệu
giống hệt cơ sở dữ liệu đang tồn tại, và lưu trữ ở một nơi khác, đề
phòng có sự cố.
Aggregation: Các Aggregation operation xử lý các bản
ghi dữ liệu và trả về kết quả đã được tính toán. Các phép toán tập
hợp nhóm các giá trị từ nhiều Document lại với nhau, và có thể thực
hiện nhiều phép toán đa dạng trên dữ liệu đã được nhóm đó để trả
về một kết quả duy nhất. Trong SQL và GROUP BY là tương đương
với Aggregation trong MongoDB.
Lưu trữ file: MongoDB được dùng như một hệ thống file
tận dụng những function trên và hoạt động như một cách phân phối
qua sharding.
1.5.3. Ưu, nhược điểm của MongoDB
1.5.3.1. Ưu điểm
Dữ liệu lưu trữ phi cấu trúc, không có tính ràng buộc,
toàn vẹn nên tính sẵn sàng cao, hiệu suất lớn và dễ dàng mở rộng
lưu trữ.
Dữ liệu được caching (ghi đệm) lên RAM, hạn chế truy
cập vào ổ cứng nên tốc độ đọc và ghi cao.
1.5.3.2. Nhược điểm
Không ứng dụng được cho các mô hình giao dịch nào có
yêu cầu độ chính xác cao do không có ràng buộc.
14
Downloaded by hoa le (baongocbest@gmail.com)
lOMoARcPSD|45012788
| 1/55
| | Tải xuống

Có thể bạn quan tâm:

Preview text:

lOMoARcPSD|45012788
BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ TP. HCM ĐỒ ÁN HỌC PHẦN
HỌC PHẦN: CÔNG NGHỆ PHẦN MỀM Đề tài:
XÂY DỰNG WEBSITE 4FRUIT SHOP Khoa: Công Nghệ Thông Tin
Giảng viên hướng dẫn: Ths. Dương Thành Phết Sinh viên thực hiện: 2011062503 Đặng Tiến Đạt 20DTHC3 2011061543 Nguyễn Đức Hùng 20DTHC3 2011770453 Nguyễn Cửu Tính 20DTHC3
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 2011143127 Võ Minh Long 20DTHC3
TP. Hồ Chí Minh, ngày 28 tháng 10 năm 2022
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 DANH MỤC HÌNH
Hình 1-1 Hình ảnh logo HTML...........................................................................................................................5
Hình 1-2 Hình ảnh logo CSS................................................................................................................................6
Hình 1-3 Hình ảnh logo JavaScript.....................................................................................................................8
Hình 1-4 Hình ảnh logo jQuery............................................................................................................................9
Hình 1-5 Hình ảnh logo mongoDB....................................................................................................................11
Hình 1-6 Hình ảnh logoo NodeJS......................................................................................................................13
Hình 2-1 Sơ đồ thực thể ERD.............................................................................................................................20
Hình 2-2 Sơ đồ ERD...........................................................................................................................................21
Hình 2-3 Sơ đồ usecase tổng quát......................................................................................................................22
Hình 2-4 Sơ đồ usecase Admin..........................................................................................................................23
Hình 2-5 Sơ đồ usecase Mua – Đặt hàng...........................................................................................................24
Hình 2-6 Sơ đồ usecase Quản lý tài khoản của User........................................................................................25
Hình 2-7 Sơ đồ usecase Xem giỏ hàng User......................................................................................................26
Hình 2-8 Mô hình Sequence Diagram...............................................................................................................27
Hình 3-1 Giao diện trang chủ.............................................................................................................................30
Hình 3-2 Giao diện trang chủ - sản phẩm nổi bật.............................................................................................30
Hình 3-3 Giao diện trang chủ - sản phẩm.........................................................................................................31
Hình 3-4 Giao diện trang chủ - thông tin liên hệ..............................................................................................31
Hình 3-5 Giao diện đăng nhập...........................................................................................................................32
Hình 3-6 Giao diện đăng nhập Admin...............................................................................................................32
Hình 3-7 Giao diện đăng ký................................................................................................................................33
Hình 3-8 Giao diện chọn sản phẩm cần thanh toán..........................................................................................33
Hình 3-9 Giao diện thanh toán...........................................................................................................................34
Hình 3-10 Giao diện hoàn tất đơn......................................................................................................................34
Hình 3-11 Giao diện lịch sử mua hàng..............................................................................................................35
Hình 3-12 Giao diện trang admin.......................................................................................................................35
Hình 3-13 Giao diện thêm admin.......................................................................................................................36
Hình 3-14 Giao diện thêm sản phẩm..................................................................................................................36
Hình 3-15 Giao diện sửa sản phẩm....................................................................................................................37
Hình 3-16 Giao diện xóa sản phẩm....................................................................................................................38
Hình 3-17 Giao diện profile admin.....................................................................................................................39
Hình 3-18 Giao diện profile user........................................................................................................................40
Hình 3-19 Giao diện Blog...................................................................................................................................40
Hình 3-20 Database admin.................................................................................................................................41
Hình 3-21 Database hóa dơn..............................................................................................................................42
Hình 3-22 Database sản phẩm............................................................................................................................42
Hình 3-23 Database người dùng........................................................................................................................43
Hình 3-24 Tìm kiếm sản phẩm...........................................................................................................................43
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 DANH MỤC BẢNG
B愃ऀng 1 Kết qu愃ऀ làm được...................................................................................................................................44
B愃ऀng 2 Hướng phát triển....................................................................................................................................45
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 MỤC LỤC
LỜI NÓI ĐẦU.......................................................................................................................................................1
LỜI CẢM ƠN........................................................................................................................................................2
LỜI CAM ĐOAN..................................................................................................................................................3
PHIẾU PHÂN CÔNG NHIỆM VỤ.....................................................................................................................4 PHẦN 1.
CƠ SỞ LÝ THUYẾT......................................................................................................................5 1.1.
TỔNG QUAN VỀ HTML..........................................................................................................................5 1.1.1.
HTML là gì?.................................................................................................................................5 1.1.2.
Ưu điểm, nhược điểm HTML.......................................................................................................5 1.2.
TỔNG QUAN VỀ CSS/SCSS/SASS.........................................................................................................6 1.2.1.
CSS/SCSS/SASS là gì?.................................................................................................................6 1.2.2.
Các công dụng của CSS...............................................................................................................7 1.3.
TỔNG QUAN VỀ JAVASCRIPT..................................................................................................................8 1.3.1.
JavaScript là gì?..........................................................................................................................8 1.3.2.
Vai trò JavaScript.........................................................................................................................8 1.3.3.
Ưu, nhược điểm JavaScript..........................................................................................................9 1.4.
TỔNG QUAN VỀ JQUERY........................................................................................................................9 1.4.1.
jQuery là gì?..............................................................................................................................10 1.4.2.
Các module phổ biến của Jquery...............................................................................................10 1.4.3.
Ưu, nhược điểm của jQuery.......................................................................................................10 1.5.
TỔNG QUAN VỀ MONGODB.................................................................................................................11 1.5.1.
MongoDB là gì?.........................................................................................................................11 1.5.2.
Các feature của MongoDB.........................................................................................................12 1.5.3.
Ưu, nhược điểm của MongoDB.................................................................................................12 1.6.
TỔNG QUAN VỀ NODEJS......................................................................................................................13 1.6.1.
NodeJS là gì?.............................................................................................................................13 1.6.2.
Ưu, nhược điểm của NodeJS......................................................................................................13 1.6.3.
NodeJS dùng để làm gì?.............................................................................................................14 PHẦN 2.
TỔNG QUAN HỆ THỐNG.........................................................................................................16 2.1.
KHẢO SÁT VỀ HIỆN TRẠNG HỆ THỐNG.................................................................................................16 2.2.
ĐỐI TƯỢNG VÀ MỤC TIÊU CỦA WEBSITE.............................................................................................16 2.2.1.
Đối tượng:..................................................................................................................................16 2.2.2.
Mục tiêu:....................................................................................................................................17 2.3.
SƠ ĐỒ CHỨC NĂNG..............................................................................................................................20
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 2.3.1.
Sơ đồ thực thể kết hợp................................................................................................................20 2.3.2.
Sơ đồ usecase.............................................................................................................................22 2.3.3.
Mô hình Sequence Diagram.......................................................................................................27 2.3.4.
Bảng dữ liệu...............................................................................................................................27 PHẦN 3.
SẢN PHẨM...................................................................................................................................30 3.1.
TRANG GIAO DIỆN TRANG CHỦ............................................................................................................30 3.2.
GIAO DIỆN ĐĂNG NHẬP........................................................................................................................32 3.3.
GIAO DIỆN ĐĂNG KÝ............................................................................................................................33 3.4.
TRANG THANH TOÁN...........................................................................................................................33 3.5.
TRANG QUẢN LÝ (ADMIN)...................................................................................................................35 3.6.
TRANG PROFILE...................................................................................................................................39 3.7.
TRANG BLOG.......................................................................................................................................40 3.8.
DATABASE............................................................................................................................................41 3.9.
TÌM KIẾM SẢN PHẨM............................................................................................................................43 PHẦN 4.
KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN...................................................................................44 4.1.
KẾT QUẢ ĐẠT ĐƯỢC............................................................................................................................44 4.2.
ĐÁNH GIÁ WEBSITE.............................................................................................................................44 4.2.1.
Ưu điểm......................................................................................................................................44 4.2.2.
Nhược điểm................................................................................................................................45 4.3.
HƯỚNG PHÁT TRIỂN, MỞ RỘNG ĐỀ TÀI................................................................................................45
TÀI LIỆU THAM KHẢO..................................................................................................................................46
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 LỜI NÓI ĐẦU
Ngày nay, ứng dụng công nghệ thông tin và việc tin học hóa đượ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 vài trò hết sức quan trọng, có thể tạo ra những bước đột phá mạnh mẽ.
Cùng với sự phát triển không ngừng về kỹ thuật máy tính và mạng điện tử,
công nghệ thông tin cũng đạt được những thành tựu ở đẳng cấp cao và lần lượt chinh
phục hết đỉnh cao này đến đỉnh cao khác. Mạng Internet là một trong những sản phẩm
có giá trị hết sức lớn lao và ngày càng trở thành công cụ không thể thiếu. Là nền tảng
chính cho sự truyền tải, trao đổi thông tin trên toàn cầu.
Giờ đây, mọi việc liên quan đến thông tin trở nên thật dễ dàng cho người sử
dụng: chỉ cần có một chiếc máy tính kết nối với internet và nội dung cần tìm kiếm thì
gần như cả thế giới này đang trong tay bạn. Bằng internet, chúng ta đã thực hiện được
nhiều công việc với tốc độ nhanh hơn và chi phí thấp hơn nhiều so với cách thức
truyền thống. Chính điều này, đã thúc đẩy sự khai sinh và phát triển của thương mại
điện tử trên khắp thế giới, làm biến đổi đáng kể về văn hóa, nâng cao chất lượng cuộc sống con người.
Trong hoạt động sản xuất, kinh doanh, thương mại điện tử giờ đây đã khẳng
định được vai trò xúc tiến và thúc đẩy sự phát triển của doanh nghiệp. Đối với một cửa
hàng, việc quảng bá và giới thiệu đến khách hàng các sản phẩm mới đáp ứng được nhu
cầu của khách hàng sẽ là cần thiết.
Vì vậy, nhóm em thực hiện đồ án “ Xây Dựng Website Kinh Doanh Rau Quả
Tươi”, với đề tài và môn học này, nhóm xin chân thành cảm ơn sự giúp đỡ tận tình của
Thầy Dương Thành Phết. Do còn nhiều hạn chế đề tài nhóm xây dựng không tránh
khỏi những thiếu sót. Rất mong được thầy cô và các bạn đóng góp ý kiến để chương
trình ngày càng hoàn thiện và được đưa vào sử dụng. 1
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 LỜI CẢM ƠN
Với lòng biết ơn sâu sắc nhất, chúng em xin gửi đến ơn thầy
Dương Thành Phết người đã trực tiếp giúp đỡ, quan tâm, hướng
dẫn chúng em hoàn thành tốt bài báo cáo này trong thời gian qua.
Nhờ có những lời hướng dẫn, dạy bảo của các thầy nên đề tài học
phần của chúng em mới có thể hoàn thiện tốt đẹp.
Bài báo cáo thực hiện trong khoảng thời gian không nhiều
bước đầu đi vào thực tế của chúng em còn hạn chế và còn nhiều bỡ
ngỡ nên không tránh khỏi những thiếu sót. Chúng em rất mong nhận
được những ý kiến đóng góp quý báu của thầy để kiến thức của
chúng em trong lĩnh vực này được hoàn thiện hơn đồng thời có điều
kiện bổ sung, nâng cao kiến thức của mình.
Chúng em xin chân thành cảm ơn! Sinh viên thực hiện Đặng Tiến Đạt Nguyễn Đức Hùng Nguyễn Cửu Tính Võ Minh Long 2
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 LỜI CAM ĐOAN
Nhóm xin cam đoan đây là công trình nghiên cứu của nhóm,
không sao chép bất cứ kết quả nghiên cứu nào của các tác giả khác.
Các số liệu sử dụng phân tích trong đồ án có nguồn gốc rõ ràng, đã
được công bố theo đúng quy định. Các kết quả nghiên cứu trong đồ
án do nhóm tự tìm hiểu, phân tích một cách trung thực, khách quan
và phù hợp với thực tiễn của Việt Nam. Các kết quả này chưa từng
được công bố trong bất kỳ nghiên cứu nào khác. Nội dung đồ án có
tham khảo và sử dụng một số thông tin, tài liệu từ các nguồn sách,
giáo trình được liệt kê trong danh mục tài liệu tham khảo. 3
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
PHIẾU PHÂN CÔNG NHIỆM VỤ Stt MSSV/Họ tên
Nội dung công việc thực hiện Đánh giá tỉ lệ/Điểm 1 2011061543 -
Phân tích yêu cầu, vẽ use case 35% Nguyễn Đức Hùng
,class, erd, Sequence Diagram, 10đ chỉnh sửa báo cáo -
Xây dựng database users, products, bills, admins với MongoDB -
Thiết kết giao diện, chức năng trang home, trang Profile - Xử lý API:
• Load user, sản phẩm hiển thị trên
trang Home, tìm kiếm sản phẩm,
thêm, xóa, sửa sản phẩm trong giỏ hàng user
• Trang profile chỉnh sửa thông tin user
• Load sản phẩm đã mua trên trang purchase order 2 2011770453
- Thiết kế giao diện và xử lý trang: 20% Nguyễn Cửu Tính login và register 9đ
- Thiết kế giao diện trang blogs - Thiết kế footer 3 2011143127 - Làm word báo cáo 20% Võ Minh Long
- Tìm kiếm tài liệu 8.5đ
- Phân tích vấn đề
- Lên kế hoạch báo cáo - Góp ý tưởng
- Thiết kế giao diện và xử lý trang thanh toán
- Thiết kế giao diện và xử lý trang cảm ơn
- Thiết kế giao diện và xử lý trang
lịch sử mua hàng(trang purchase orders) 4 2011062503
- Phân tích yêu cầu, vẽ mô hình use 25% Đặng Tiến Đạt case, Sequence Diagram, Class 10đ Diagram
- Lên kế hoạch, theo dõi và giám sát
quá trình làm đồ án (web, báo cáo). 4
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
- Thiết kế giao diện và xử lý của
trang admin, trang login admin. 5
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
PHẦN 1. CƠ SỞ LÝ THUYẾT
1.1. Tổng quan về HTML
Hình 1-1 Hình ảnh logo HTML 1.1.1. HTML là gì?
Tạm dịch là ngôn ngữ đánh dấu siêu văn bản. Người ta thường
sử dụng HTML trong việc phân chia các đoạn văn, heading, links,
blockquotes,...Một Website thường chứa nhiều trang con và mỗi
trang con này lại có một tập tin HTML riêng.
Lưu ý, HTML không phải là ngôn ngữ lập trình. Điều này có
nghĩa là nó không thể thực hiện các chức năng “động”. Hiểu một
cách đơn giản hơn, cũng tương tự nhờ phần mềm Microsoft Word,
HTML chỉ có tác dụng bố cục và định dạng trang web. HTML khi kết
hợp với CSS và JavaScript sẽ trở thành một nền tảng vững chắc cho thế giới mạng.
HTML document có đuôi file dạng .html hoặc htm. Bạn có thể
xem chúng bằng các trình duyệt web hiện hành nhƣ Google
Chrome, Firefox, Safari,... Nhiệm vụ của trình duyệt là đọc những file
HTML này và “biến đổi” chúng thành một dạng nội dung visual trên
Internet sao cho người dùng có thể xem và hiểu được chúng. 6
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 1.1.2.
Ưu điểm, nhược điểm HTML
1.1.2.1. Ưu điểm:
Có nhiều tài nguyên hỗ trợ với cộng đồng ngƣời dùng vô cùng lớn 
Có thể hoạt động mƣợt mà trên hầu hết mọi trình duyệt hiện nay  Học HTML khá đơn giản 
Các markeup sử dụng trong HTML thƣờng ngắn gọn, có độ đồng nhất cao 
Sử dụng mã nguồn mở, hoàn toàn miễn phí 
HTML là chuẩn web được vận hành bởi W3C 
Dễ dàng để tích hợp với các loại ngôn ngữ backend (ví dụ nhƣ: PHP, Node.js,...)
1.1.2.2. Nhược điểm:
Chỉ được áp dụng chủ yếu cho web tĩnh. Nếu muốn tạo các
tính năng động, lập trình viên phải dùng thêm JavaScript hoặc
ngôn ngữ backend của bên thứ 3. 
Mỗi trang HTML cần được tạo riêng biệt, ngay có khi có nhiều
yếu tố trùng lặp như header, footer 
Khó để kiểm soát cách đọc và hiển thị file HTML của trình duyệt 
Một vài trình duyệt còn chậm cập nhật để hỗ trợ tính năng mới của HTML.
1.2. Tổng quan về CSS/SCSS/SASS 7
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
Hình 1-2 Hình ảnh logo CSS 1.2.1. CSS/SCSS/SASS là gì?
SCSS,SASS hay còn được gọi chung là CSSLà viết tắt của
Cascading Style Sheets, một ngôn ngữ thiết kế đơn giản, xử lý một
phần giao diện của trang web. CSS mô tả cách các phần tử HTML
hiển thị trên màn hình và các phương tiện khác.
Sử dụng CSS, bạn có thể kiểm soát màu chữ, cỡ chữ, kiểu chữ,
khoảng cách giữa các đoạn văn bản, kích thước của các thành phần
trên trang web, màu nền, thiết kế bố cục và cách trang web hiển thị
trên những màn hình có kích thước khác nhau cũng nhờ hàng loạt hiệu ứng khác.
CSS rất hữu ích và tiện lợi. Nó có thể kiểm soát tất cả các trang trên một website. 1.2.2.
Các công dụng của CSS
CSS được dùng để định nghĩa kiểu cách cho các trang trên
website của bạn, gồm cả thiết kế, dàn trang và các cách hiển thị
khác nhau trên nhiều thiết bị với kích thước màn hình khác nhau.
CSS giúp giải quyết vấn đề lớn của HTML:
HTML không có phần tử để để định dạng cho trang web. HTML
chỉ được dùng để tạo nội dung cho trang. Khi các phần tử nhƣ
và thuộc tính màu sắc được thêm vào HTML 3.2, cơn
ác mộng của các nhà phát triển web bắt đầu. Việc phát triển 8
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
một website lớn mà thêm thông tin font hay màu sắc vào từng
trang đòi hỏi rất nhiều thời gian. 
CSS được ra đời để giúp loại bỏ việc định dạng kiểu cách khỏi trang HTML. 
Các định nghĩa liên quan đến kiểu cách được đưa vào tập tin
.css và nhờ vào tập tin stylesheet ngoài, bạn có thể thay đổi
toàn bộ website chỉ bằng một tập tin duy nhất.
Tiết kiệm thời gian: Ta có thể viết CSS một lần và sử dụng
lại chúng trên nhiều trang HTML. Có thể định kiểu cho từng phần tử
HTML và áp dụng kiểu đó cho bao nhiêu trang web tùy ý.
Tải trang nhanh hơn: Với CSS, ta không cần khai báo thuộc
tính cho từng tag HTML mỗi lầndùng tag đó. Nhờ đó, số lượng code
cần viết sẽ ít đi, thời gian load trang sẽ nhanh hơn.
Bảo trì dễ dàng: Để thực hiện thay đổi trên toàn bộ trang,
chỉ cần đổi kiểu trong file CSS và tất cả các thành phần trên trang
web sẽ đƣợc cập nhật tự động.
Có nhiều kiểu hơn HTML: CSS có một loạt thuộc tính, nhiều
hơn so với HTML khá nhiều. Nhờ đó bạn có thể làm cho trang web
hiển thị tốt hơn so với chỉ dùng HTML.
Tiêu chuẩn web toàn cầu: Các thuộc tính HTML hiện không
còn đƣợc sử dụng nữa, bạn được khuyên nên sử dụng CSS để có thể
tạo ra những trang web tương thích với mọi trình duyệt trong trương lai.
Khả năng tương thích với nhiều thiết bị: CSS cho phép nội
dung được tối ưu hóa trên nhiều loại thiết bị. Bằng cách sử dụng
cùng một tài liệu HTML, nhưng nó có thể hiển thị tốt trên PC, điện
thoại, các thiết bị cầm tay hay khi in.
1.3. Tổng quan về JavaScript 9
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
Hình 1-3 Hình ảnh logo JavaScript 1.3.1. JavaScript là gì?
JavaScript là 1 trong 3 ngôn ngữ chính của lập trình web, và nó được dùng
phổ biến trong suốt 20 năm qua. Từ thuở sơ khai, nó còn có tên là Mocha (năm
1995), sau đó được đổi thành Mona, Livescript, và cuối cùng là JavaScript như hiện nay. 1.3.2. Vai trò JavaScript
Thông thường, các trang web sẽ được nhúng trực tiếp
JavaScript vào, hoặc sẽ sử dụng file .js để tham chiếu qua. Đây là
ngôn ngữ phía máy khách, nghĩa là thay vì xử lý tập lệnh trên server
của trang web, nó sẽ được tải về máy của khách truy cập và xử lý
trên chính chiếc máy đó.
Cần chú ý, hiện nay có một số trình duyệt web phổ biến cho
phép bạn bật/tắt JavaScript theo ý của bạn. Vậy nên, bạn cần biết
những trang web mà bạn muốn truy cập sẽ bị ảnh hưởng như thế
nào nếu như không có JavaScript hoạt động, từ đó sẽ quyết định có bật/tắt nó hay không. 1.3.3.
Ưu, nhược điểm JavaScript
1.3.3.1. Ưu điểm:
Đối với lập trình viên: Đây là ngôn ngữ dễ học, dễ để phát hiện và sửa lỗi
hơn. Thông qua JavaScript thì lập trình viên cũng có thể kiểm tra dữ liệu đầu vào, 10
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
nhằm giảm bớt công việc kiểm tra thủ công. JavaScript cũng khá linh hoạt, và nó có
thể được sử dụng ở nhiều nền tảng, trình duyệt, và không cần những công cụ quá
phức tạp bởi chúng có thể được biên dịch bởi HTML từ trình duyệt web. 
Đối với khách truy cập: Ta có thể truy cập và tương tác với website hiệu quả
hơn. Nhờ đặc tính gọn nhẹ mà chúng sẽ cho phép thực hiện các tác vụ trên trang web nhanh hơn.
1.3.3.2. Nhược điểm:
Nó rất dễ bị khai thác, thế nên chúng thu hút rất nhiều hacker thực hiện tìm
kiếm lỗi bảo mật để lợi dụng, từ đó sẽ chèn cắm các mã độc vào máy tính của người sử dụng. 
Việc linh hoạt hỗ trợ cho các thiết bị cũng có thể tạo ra trải nghiệm không
đồng nhất trên các thiết bị này, và đôi khi một số trình duyệt sẽ không hỗ trợ sử dụng JavaScript.
1.4. Tổng quan về jQuery
Hình 1-4 Hình ảnh logo jQuery 1.4.1. jQuery là gì?
JQuerylà một thư viện JavaScript đa nền tảng và giàu tính năng, được thiết kế
nhằm đơn giản hóa client-side scripting của HTML. jQuery giúp chạy HTML
document traversal và manipulation, animation, event handling và AJAX chỉ bằng
một API rất dễ sử dụng, có thể hoạt động trên nhiều trình duyệt khác nhau. Từ đó
giúp cho việc sử dụng JavaScript trên trang web trở nên dễ dàng hơn, website sẽ có 11
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
tính tương tác và hấp dẫn hơn. Ngoài ra, jQuery cũng được sử dụng để bổ sung vào các hiệu ứng. 1.4.2.
Các module phổ biến của Jquery  Ajax (xử lý Ajax)  Effect (xử lý hiệu ứng) 
DOM (xử lý Data Object Model)  Event (xử lý sự kiện) 
Form (xử lý sự kiện liên quan đến form) 
Attributes (xử lý thuộc tính của các đối tượng HTML) 
Selector (xử lý luồng lách giữa các đối tượng HTML) 1.4.3.
Ưu, nhược điểm của jQuery
1.4.3.1. Ưu điểm
Đơn giản, dễ sử dụng: Với cú pháp đơn giản, người dùng chỉ
phải viết ít dòng lệnh để tạo ra các chức năng tương tự, giúp tiết
kiệm thời gian hơn cho lập trình viên 
Là một thư viện lớn của javaScript: Có khả năng thực thi nhiều
chức năng hơn so với các thư viện javaScript khác 
Cộng đồng mã nguồn mở mạnh mẽ (một số plugin jquery có
sẵn): JQuery có một cộng đồng người dùng lớn giúp phát triển các
plugin. Nhờ đó mà hàng trăm plugin được viết sẵn để có thể tải về
ngay lập tức, giúp đẩy nhanh quá trình viết code của lập trình viên.
Đồng thời, các script này đều được đảm bảo an toàn và hiệu quả cao. 
Có sẵn nhiều tài liệu và hướng dẫn cụ thể: Các trang web
JQuery đều có sẵn các bộ tài liệu và hướng dẫn chi tiết, kể cả người
mới làm lập trình cũng có thể tham khảo và áp dụng trong thực tế.
1.4.3.2. Nhược điểm
Làm chậm Client: Client không chỉ phải hiển thị mà còn
phải xử lý nhiều chức năng được tạo thành từ jQuery. Nếu lạm dụng 12
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788
jQuery nhiều sẽ làm chậm Client, đặc biệt là những Client yếu. Do
đó, lập trình viên sẽ cần phải dùng thêm cache. 
Có thể không có một số chức năng: jQuery vốn sở hữu
rất nhiều chức năng, tùy thuộc vào yêu cầu trên trang web. Tuy
nhiên, do nhiều chức năng vẫn chưa được phát triển nên người dùng
sẽ vẫn cần đến javascript thuần để xây dựng chức năng này.
1.5. Tổng quan về MongoDB
Hình 1-5 Hình ảnh logo mongoDB 1.5.1. MongoDB là gì?
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. 1.5.2.
Các feature của MongoDB
Các ad hoc query: hỗ trợ search bằng field, các phép
search thông thường, regular expression searches, và range queries. 13
Downloaded by hoa le (baongocbest@gmail.com) lOMoARcPSD|45012788 
Indexing: bất kì field nào trong BSON document cũng có thể được index. 
Replication: có ý nghĩa là “nhân bản”, là có một phiên
bản giống hệt phiên bản đang tồn tại, đang sử dụng. Với cơ sở dữ
liệu, nhu cầu lưu trữ lớn, đòi hỏi cơ sở dữ liệu toàn vẹn, không bị
mất mát trước những sự cố ngoài dự đoán là rất cao. Vì vậy, người
ta nghĩ ra khái niệm “nhân bản”, tạo một phiên bản cơ sở dữ liệu
giống hệt cơ sở dữ liệu đang tồn tại, và lưu trữ ở một nơi khác, đề phòng có sự cố. 
Aggregation: Các Aggregation operation xử lý các bản
ghi dữ liệu và trả về kết quả đã được tính toán. Các phép toán tập
hợp nhóm các giá trị từ nhiều Document lại với nhau, và có thể thực
hiện nhiều phép toán đa dạng trên dữ liệu đã được nhóm đó để trả
về một kết quả duy nhất. Trong SQL và GROUP BY là tương đương
với Aggregation trong MongoDB. 
Lưu trữ file: MongoDB được dùng như một hệ thống file
tận dụng những function trên và hoạt động như một cách phân phối qua sharding. 1.5.3.
Ưu, nhược điểm của MongoDB
1.5.3.1. Ưu điểm
Dữ liệu lưu trữ phi cấu trúc, không có tính ràng buộc,
toàn vẹn nên tính sẵn sàng cao, hiệu suất lớn và dễ dàng mở rộng lưu trữ. 
Dữ liệu được caching (ghi đệm) lên RAM, hạn chế truy
cập vào ổ cứng nên tốc độ đọc và ghi cao.
1.5.3.2. Nhược điểm
Không ứng dụng được cho các mô hình giao dịch nào có
yêu cầu độ chính xác cao do không có ràng buộc. 14
Downloaded by hoa le (baongocbest@gmail.com)