ĐỒ ÁN CƠ SỞ 2 ĐỀ TÀI: XÂY DỰNG WEBSITE DẠY NẤU ĂN. Th.S Võ Hùng Cường

ĐẠI HỌC ĐÀ NẴNG

KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG

ĐỒ ÁN CƠ SỞ 2
ĐỀ TÀI: XÂY DỰNG WEBSITE DẠY NẤU ĂN
Tên Website: 2TCooking.com

Sinh viên thực hiện

: Trần Thị Trinh
Nguyễn Trần Mai Thi
Giảng viên hướng dẫn : Th.S Võ Hùng Cường
Lớp
: 19IT4

Mã SV: 19IT458
Mã SV: 19IT446

Đà nẵng, tháng 12 năm 2020


2


ĐẠI HỌC ĐÀ NẴNG

KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG

ĐỒ ÁN CƠ SỞ 2
ĐỀ TÀI: XÂY DỰNG WEBSITE DẠY NẤU ĂN

Tên Website: 2TCooking.com

Sinh viên thực hiện

: Trần Thị Trinh
Nguyễn Trần Mai Thi
Giảng viên hướng dẫn : Th.S Võ Hùng Cường
Lớp
: 19IT4

Mã SV:
Mã SV: 19IT446

Đà nẵng, tháng 12 năm 2020
3


LỜI MỞ ĐẦU

Từ ngày xưa, người Việt chúng ta đã có truyền thống cả gia đình qy quần bên
nhau trong bữa cơm, cùng ăn, cùng trò chuyện. Hay trong những ngày Tết, ngày
giỗ, hình ảnh cả gia đình cùng nhau ăn bữa cơm ấm cúng ln có ý nghĩa đặc
biệt trong tâm thức mỗi người.
Khơng phải khơng có lý do mà người ta vẫn thường nói “Giữ lửa cho bếp, giữ
hơi ấm cho gia đình” phải khơng nào?
Cho dù chúng ta đang sống tự lập, hay đang phải xa quê, việc chịu khó nấu
những bữa ăn và cùng mọi người quây quần ăn cơm, trò chuyện cũng tạo cảm
giác thân thương lạ kỳ, gắn kết mọi người gần nhau hơn.
Vì vậy, chúng tôi tạo nên một trang web “Dạy nấu ăn” giúp cho người nội trợ sẽ
dễ dàng hơn trong việc nấu ăn hàng ngày của mình. Từ cơng việc chuẩn bị các

nguyên liệu, phải chọn món ăn hàng ngày hoặc lựa chọn những thiết bị dùng bếp
sẽ trở nên dễ dàng hơn. Mọi người chỉ cần truy cập vào website này tìm hiểu,
học hỏi, ghi chép và có thể làm theo hướng dẫn một cách dễ dàng dù bất cứ ở
đâu, bất cứ khi nào.

4


LỜI CẢM ƠN

Với sự hướng dẫn tận tình của Thầy Võ Hùng Cường nhóm chúng em đã hồn
thành phần nào bài báo cáo đồ án này. Tuy đã cố gắng hết sức tìm hiểu, phân tích thiết kế
và cài đặt hệ thống nhưng chắc rằng không tránh khỏi những thiếu sót. Em rất mong nhận
được sự thơng cảm và góp ý của quý Thầy cô.
Em xin chân thành cảm ơn !

5


NHẬN XÉT
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………

…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………
…………………………………………………………………………………………

MỤC LỤC
6


Chương 1.GIỚI THIỆU....................................................................................................7
1.Tên đề tài:...............................................................................................................7
2.Tên Website:...........................................................................................................7

3.Lý do chọn đề tài....................................................................................................7
4.Mục đích...................................................................................................................7
5.u cầu của hệ thống...............................................................................................8
Chương 2:NGHIÊN CỨU TỔNG QUAN.....................................................................9
1.Các ngơn ngữ sử dụng phục vụ cho việc thiết kế Website......................................9
2.Yêu cầu của các chức năng có trong Website..........................................................9
Chương 3. PHÂN TÍCH THIẾT KẾ HỆ THỐNG………………….………….16
1.Biểu đồ use case ở mức tổng quát……………………………………………….16
2. Biểu đồ use case đăng nhập……………………………………………………..17
3. Biểu đồ use case quản lý danh mục sản phẩm......................................................18
4. Biểu đồ use case quản lý sản phẩm.......................................................................18
5. Biểu đồ use case tìm kiếm sản phẩm.....................................................................19
6. Biểu đồ use case xem sản phẩm............................................................................19
7. Biểu đồ usce case bình luận, u thích..................................................................20
Chương 4: TRIỂN KHAI VÀ XÂY DỰNG …............................................................21
1.Cơng cụ sử dụng:..................................................................................................21
2.Hình ảnh demo sản phẩm:.....................................................................................22
Chương 5: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN:.........................................29
1. Kết quả đạt được....................................................................................................29
2. Hạn chế của sản phẩm ...........................................................................................29
3. Hướng phát triển....................................................................................................29
DANH MỤC TÀI LIỆU THAM KHẢO…..........................................................................30

7


Chương 1: TỔNG QUAN
1. Tên đề tài: Xây Dựng Website dạy nấu ăn
2. Tên Website: 2TCooking.com

3. Lý do chọn đề tài:
Ẩm thực là chủ đề vô cùng hấp dẫn với các chị em phụ nữ. Nhiều người muốn trổ tài
nấu nướng cũng như thoả mãn đam mê của mình với các món ăn lạ, hấp dẫn. Tuy
nhiên lại chưa biết cách nấu sao cho đúng. Hiểu được nhu cầu đó của chị em mà nhiều
trung tâm dạy nấu ăn được ra đời. Bên cạnh việc học trực tiếp tại các trung tâm dạy
nấu ăn thì mọi người cũng có những công thức nấu ăn khác thông qua việc học nấu ăn
trên website dạy nấu ăn.
Mục đích của việc thiết kế website nấu ăn là để chia sẻ những phương pháp, cách thức
nấu ăn cho mọi người. Dựa vào đó mà người xem có thể học theo và tự tay làm món
ăn mà mình u thích.
Việc này vừa tạo cảm hứng nấu ăn cho người học mà không cần phải mất thời gian và
chi phí đi học nấu ăn tại các trung tâm. Bất kỳ món ăn nào đều có thể học được thơng
qua các website dạy nấu ăn. Ngồi ra, bạn cịn có thể xem lại, lưu trữ lại cách nấu ăn
mà khơng cần phải ghi chép gì cả.
Việc chia sẻ cách thức nấu ăn chỉ cần làm một lần và dạy được cho nhiều người, mọi
lúc, mọi nơi. Không cần phải hướng dẫn từng cá nhân như việc dạy trực tiếp. Giúp tiết
kiệm thời gian, chi phí và cơng sức cho người dạy. Thu hút được lượng lớn học viên
tham gia.
Vì vậy việc thiết kế một Website để dạy mọi người nấu ăn là nhu cầu rất cần thiết hiện
nay.

Chương 1

Mục đích

- Xây dựng một Website hướng dẫn nấu ăn online, cho người dùng có thể truy cập vào
để tìm kiếm, xem xét và học các nấu những món ăn mà mình u thích trên mạng.

8

- Giới thiệu các món ăn nổi bật được tìm kiếm nhiều nhất, các món ăn dễ nấu với
những nguyên liệu đơn giản nhất để người dùng có thể tìm kiếm được dễ dàng, nhanh
chóng và ở bất cứ đâu.

- Cung cấp cho người dùng các thông tin về các món ăn cũng như cơng thức để nấu
như: ngun liệu, cách nấu, hương vị,….
- Thiết kế với giao diện dễ nhìn, dễ sử dụng, thuận tiện cho người dùng trong việc
nhập thơng tin và tìm kiếm thơng tin.
- Đối với quản trị viên: Làm chủ mọi hoạt động của hệ thống, tiếp nhận,
kiểm tra số lượng bài viêt và người dùng, thêm sửa xóa bài viết,....

Chương 2

Các yêu cầu của hệ thống

- Chức năng tìm kiếm cơng thức món ăn.
- Chức năng đăng ký, đăng nhập
- Chức năng thêm công thức nấu ăn.
- Chức năng sửa thông tin cá nhân.
- Chức năng bình luận, u thích
- Chức năng quản lí thơng tin: gồm quản lí thơng tin người dùng, quản lí danh
mục bài viết (thêm, xóa, sửa)

9


Chương 2: NGHIÊN CỨU TỔNG QUAN
1.Các ngôn ngữ sử dụng phục vụ cho việc thiết kế Website

2. Yêu cầu của các chức năng có trong Website
a. Tìm kiếm sản phẩm
Tác nhân: Người dùng
Điều kiện trước: Người dùng ghé thăm hệ thống.
Điều kiện sau: Khi người dùng có nhu cầu tìm hiểu thơng tin về các món ăn.
Mơ tả: Người dùng vào hệ thống để tìm kiếm món ăn mà mình muốn xem.
 Các sự kiện chính:





Hành động của tác nhân

Hành động của hệ thống

1. Người dùng kích vào mục tìm 2. Hệ thống hiển thị form tìm kiếm:
kiếm món ăn.
tìm kiếm theo tên, tìm theo nguyên
liệu, …
3. Người dùng nhập thơng tin cần
thiết vào form tìm kiếm và nhấn nút 4. Hệ thống hiển thị kết quả tìm kiếm
tìm kiếm.

b. Đăng ký tài khoản





Tác nhân: Người dùng
Điều kiện trước: Người dùng ghé thăm hệ thống.
Điều kiện sau: Người dùng đăng ký tài khoản.
Mô tả: Người dùng cung cấp đầy đủ thông tin cần thiết đăng ký tài khoản hệ

thống.
 Các sự kiện chính:
Hành động của tác nhân

Hành động của hệ thống

1. Một người dùng sau khi ghé thăm 2. Hiển thị form đăng ký cho người
website và muốn yêu thích, bình luận về dùng.
các cơng thức nấu ăn của món ăn sẽ phải
đăng ký để thực hiện.
4. Hệ thống báo kết quả quá trình nhập
3. Người dùng cung cấp đầy đủ thông tin
thông tin cá nhân.
cần thiết mà hệ thống yêu cầu và nhấn
Đăng ký.
10


5. Xác nhận thông tin.
6. Hệ thống cập nhật thông tin của
người dùng vừa đăng ký vào hệ thống

 Các sự kiện phụ:
Hành động của tác nhân

Hành động của hệ thống

3. Người dùng không cung cấp đủ thông 4. Hệ thống sẽ thông báo yêu người
tin cần thiết.
dùng nhập đầy đủ thơng tin hoặc thốt
ra khỏi form đăng ký.

c. Đăng nhập hệ thống
 Tác nhân: Người dùng.
 Điều kiện trước: Người dùng vào trang đăng nhập của Website.
 Điều kiện sau: Tên và mật khẩu của người dùng hợp lệ, đăng nhập thành
công.
 Mô tả: Người dùng nhập tên và mật khẩu, hệ thống cho phép đăng nhập
thành công nếu đã đăng ký tài khoản.
 Các sự kiện chính:
Hành động của tác nhân

Hành động của hệ thống

1. Người dùng chọn đăng nhập.

2. Hệ thống hiển thị form đăng nhập.
3. Người dùng nhập tên và mật khẩu vào 4. Hệ thống kiểm tra tên và mật khẩu
form đăng nhập.
của thành viên có hợp lệ khơng.
5. Hệ thống hiển thị thành viên đăng
nhập thành công.

 Các sự kiện phụ:

Hành động của tác nhân

Hành động của hệ thống

4. Người dùng đăng nhập lại hoặc chọn 5. Hệ thông báo nhập sai thông tin, hiển
chức năng quên mật khẩu ở hệ thống.
thị form nhập lại.
6. Người dùng tiếp tục đăng nhập hệ
thống hoặc rời khỏi.
11


d. Xem, sửa thông tin cá nhân





Các tác nhân: Người dùng ( đã đăng ký tài khoản)
Điều kiện trước: Người dùng đăng nhập thành công vào hệ thống.
Điều kiện sau: Thông tin người dùng được cập nhật trong hệ thống.
Mô tả: Người dùng vào hệ thống xem, sửa thông tin cá nhân và hệ thống cho
phép người dùng các thông tin đã đăng ký.

 Các sự kiện chính:

Hành động của tác nhân

Hành động của hệ thống

1. Người dùng chọn chức năng xem 2. Hệ thống hiển thị form xem thông tin
thông tin cá nhân.
với các thông tin cũ của người dùng.
3. Người dùng chọn sửa và nhập các 4. Hệ thống lưu lại thông tin mới của
thông tin mới và nhấn nút lưu thông tin.
Người dùng.
 Các sự kiện phụ:

Hành động của tác nhân

Hành động của hệ thống

5. Người dùng nhập lại thông tin và lưu 6. Hệ thống thông báo việc nhập thơng
vào hệ thống.
tin khơng hợp lệ.

e. Bình luận





Tác nhân: Người dùng
Điều kiện trước: Khi người dùng ghé thăm Website để xem công thức nấu ăn.
Điều kiện sau: Bình luận về cơng thức của món ăn đó.
Mơ tả: Người dùng ghé thăm vào hệ thống xem công thức. Hệ thống sẽ tự
động tạo cho họ ơ bình luận. Nếu người dùng xem bài viết muốn bình luận sẽ
nhấn vào đó.
Các sự kiện chính:
Hành động của tác nhân

Hành động của hệ thống

1. Người dùng ghé thăm website xem 2. Hệ thống hiển thị bài viết kèm theo
cơng thức món ăn.
đó là ơ bình luận ở dưới.
12


3. Nếu người dùng muốn bình luận sẽ 4.Hệ thống sẽ lưu lại bình luận của Của
Nhấn vào đó
người dùng vào bài viết
5.Người dùng muốn xóa, sửa bình luận

6.Hệ thống hiển thị cho người dùng xóa
hoặc sửa bình luận

 Các sự kiện phụ:
Hành động của tác nhân

Hành động của hệ thống

3/5. Người dùng chưa hồn tất bình luận 4/6. Hệ thống hiện thị chưa hồn tất bình
mà đã rời khỏi trang web
luận. Người dúng có muốn tiếp tục hồn
tất hoặc rời khỏi.

f. Yêu thích






Tác nhân: Người dùng
Điều kiện trước: Khi người dùng ghé thăm Website để xem công thức nấu ăn.
Điều kiện sau: u thích về cơng thức của món ăn đó.
Mơ tả: Người dùng ghé thăm vào hệ thống xem công thức. Hệ thống sẽ tự

động tạo cho họ nút yêu thích. Nếu người dùng xem bài viết muốn lưu bài viết
u thích sẽ nhấn vào đó.
 Các sự kiện chính:
Hành động của tác nhân

Hành động của hệ thống

1. Người dùng ghé thăm website xem 2. Hệ thống hiển thị bài viết kèm theo
cơng thức món ăn.
đó là nút yêu thích.
3. Nếu người dùng muốn lưu bài viết yêu 4. Hệ thống sẽ lưu bài người dũng đã
thích sẽ nhấn vào đó
u thích vào trang u thích

 Các sự kiện phụ
Hành động của tác nhân
3. Người

dùng xóa
khỏitrang u thích

baifyeeu

Hành động của hệ thống
thích 4. Hệ thống hiện thị xác nhận xóa bài
viết khỏi trang u thích

13


g. Phân loại
 Các tác nhân: Người dùng
 Điều kiện trước: Người dùng chọn phân loại cơng thức món ăn theo tên,

nguyên liệu, giá thành nguyên liệu,…
 Điều kiện sau: Xác nhận chọn phân loại
 Mô tả: Người dùng sẽ xác nhận phân loại công thức nấu ăn theo nhu cầu tìm
kiếm của bản thân tùy vào giá thành, tên,..
 Các sự kiện chính:

Hành động của tác nhân
1. Người dùng nhấn chọn phân loại

Hành động của hệ thống
2. Hệ thống xác nhận phân loại công
thức nấu ăn

3. Người dùng sẽ cho thấy hiển thị các
4. Xuất bài viết theo yêu cầu
bài viết công thức nấu ăn theo nhu cầu.

h. Quản lí người dùng

 Các tác nhân: Người quản trị
 Điều kiện trước: Người quản trị đăng nhập thành công vào hệ thống.
 Điều kiện sau: Người quản trị hệ thống được thông tin của các người dùng
trong hệ thống.
 Mô tả: Người quản trị vào hệ thống, truy cập vào chức năng quản lí người
dùng, xem thơng tin người dùng và cập nhập một số thông tin của người dùng.
 Các sự kiện chính:
Hành động của tác nhân

Hành động của hệ thống

1. Người quản trị truy cập vào hệ thống, 2. Hệ thống yêu cầu chọn quản lí người
chọn chức năng quản lí người dùng.
dùng
3. Nếu người quản trị chọn chức năng 4. Hệ thống hiển thị form quản lí người
quản lí người dùng.
dùng.
6. Hệ thống hiển thị thơng tin và yêu cầu
5. Người quản trị xem, cập nhật thông
xác nhận.
tin người dùng
7. Người quản trị xác nhận hoàn thành.
 Các sự kiện phụ:

Hành động của tác nhân

Hành động của hệ thống
14

1. Người quản lí khơng xác nhận hồn 2. Hệ thống hiển thị lại form quản lí.
thành.

i. Quản lí bài viết.
 Các tác nhân: Người quản trị.
 Điều kiện trước: Người quản trị đăng nhập vào hệ thống thành công.
 Điều kiện sau: Website được người quản trị cập nhật thông tin bài viết công
thức nấu ăn.
 Mô tả: Người quản trị kiểm tra bài viết và cập nhật trên hệ thống.
 Các sự kiện chính:
Hành động của tác nhân

Hành động của hệ thống

1. Người quản trị đăng nhập vào hệ thống 2. Hệ thống yêu cầu chọn quản lí bài viết
thành cơng.
4. Hệ thống hiển thị form quản lí bài viết
3. Người quản trị chọn chức năng quản lí bài
viết.
7. Hệ thống tiếp nhận và cập nhật bài viết lên
5. Người quản trị cập nhật viết lên hệ thống.
website.
 Các sự kiện phụ:
Hành động của tác nhân
1. Cập nhật thông tin sai.

Hành động của hệ thống
2. Hệ thống cập nhật thơng tin sai.

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

1. Biểu đồ use case mức tổng quát

15


2. Biểu đồ use case Đăng nhập

16


3. Biểu đồ use case Quản lý danh mục sản phẩm
* Use case Quản lý danh mục món ăn:


Mục đích: quản lý danh mục món ăn cho website



Tác nhân: Quản trị viên.
17




Mô tả: sau khi đăng nhập vào webservice, admin tiến hành thêm, xóa
danh mục sản phẩm.

4. Biểu đồ use case Quản lý sản phẩm
*Use case Quản lý sản phẩm:


Mục đích: quản lý món ăn cho website.



Tác nhân: quản trị viên.



Mơ tả: sau khi đăng nhập vào webservice, quản trị viên tiến hành thêm,
cập nhật, xóa sản phẩm.

5. Biểu đồ use case Tìm kiếm sản phẩm
*Use case Tìm kiếm sản phẩm:


Mục đích: tìm kiếm các món ăn mong muốn.



Tác nhân: người dùng
18




Mơ tả: người dùng khơng cần đăng nhập vẫn có thể tìm kiếm món ăn
bằng cách nhập các từ khóa cần tìm.

6. Biểu đồ use case Xem sản phẩm

*Use case Xem sản phẩm:


Mục đích: Xem các món ăn và thơng tin về món ăn.



Tác nhân: người dùng.



Mơ tả: người dùng khơng cần đăng nhập vẫn có thể xem các món ăn và
thơng tin món ăn.

7. Biểu đồ use case Bình luận, u thích
*Use case Bình luận và u thích



Mục đích:u thích và bình luận về món ăn
Tác nhân: người dùng.

19




Mơ tả: nếu người dùng đăng nhập thì tên người đánh giá sẽ là tên lúc
người dùng đăng ký tài khoản. Nếu người dùng chưa đăng nhập thì tên
người đánh giá sẽ là tên thiết bị mà người dùng đánh giá.

Chương 4: TRIỂN KHAI VÀ XÂY DỰNG

1. Công cụ sử dụng:
Chương 3
Ngôn ngữ CSS
CSS (Cascading Style Sheets) là một ngôn ngữ quy định cách trình bày
cho các tài liệu viết bằng HTML, XHTML, XML, SVG, hay UML,…CSS quy định
cách hiển thị của các thẻ HTML bằng cách quy định các thuộc tính của các thẻ đó
20


(font chữ, kích thước, màu sắc...).CSS có cấu trúc đơn giản và sử dụng các từ tiếng
anh để đặt tên cho các thuộc tính. CSS khi sử dụng có thể viết trực tiếp xen lẫn vào mã
HTML hoặc tham chiếu từ một file css riêng biệt. Hiện nay CSS thường được viết
riêng thành một tập tin với mở rộng là “.css”. Chính vì vậy mà các trang web có sử
dụng CSS thì mã HTML sẽ trở nên ngắn gọn hơn. Ngồi ra có thể sử dụng một tập tin
CSS đó cho nhiều website tiết kiệm rất nhiều thời gian và cơng sức. Một đặc điểm
quan trọng đó là tính kế thừa của CSS do đó sẽ giảm được số lượng dòng code mà vẫn
đạt được yêu cầu. Tuy nhiên, đối với CSS thì các trình duyệt hiểu theo kiểu riêng của
nó. Do vậy, việc trình bày một nội dung trên các trình duyệt khác nhau là khơng thống
nhất. CSS cung cấp hàng trăm thuộc tính trình bày dành cho các đối tượng với sự sáng
tạo cao trong kết hợp các thuộc tính giúp mang lại hiệu quả.
Chương 4
Ngơn ngữ lập trình PHP
PHP (Hypertext Preprocessor) là một ngơn ngữ lập trình kịch bản hay một loại
mã lệnh chủ yếu được dùng để phát triển các ứng dụng viết cho máy chủ, mã nguồn
mở, dùng cho mục đích tổng qt. Nó rất thích hợp với web và có thể dễ dàng nhúng
vào trang HTML. Do được tối ưu hóa cho các ứng dụng web, tốc độ nhanh,nhỏ gọn,
cú pháp giống ngôn ngữ lập trình C và ngơn ngữ lập trình Java, dễ học và thời gian

xây dựng sản phẩm tương đối ngắn hơn so với các ngôn ngữ khác nên PHP đã nhanh
chóng trở thành một ngơn ngữ lập trình web phổ biến nhất thế giới. Một tập tin PHP có
phần mở rộng *.php, nó có thể chứa các văn bản, mã nguồn HTML, CSS, Javascript,
Jquery... và đương nhiên có thể chứa mã nguồn PHP. Đối với các trang PHP khi có yêu
cầu xem trang web thì Server sẽ tiến hành phát sinh trang web đó từ mã nguồn PHP
sang mã nguồn HTML, sau đó mới chuyển mã nguồn đó về trình duyệt web để người
dùng xem. Vì các trình duyệt web không thể đọc được các mã nguồn PHP mà chỉ đọc
được các mã nguồn HTML.
- Xampp
Xampp là một mã nguồn mở máy chủ web đa nền được phát triển bởi Apache Friends,
bao gồm chủ yếu là Apache HTTP Server, MariaDB database, và interpreters dành cho
những đối tượng sử dụng ngôn ngữ PHP và Perl. Xampp là viết tắt của CrossPlatform (đa nền tảng-X), Apache (A), MariaDB (M), PHP (P) và Perl (P). Nó phân
bố Apache nhẹ và đơn giản, khiến các lập trình viên có thể dễ dàng tạo ra máy chủ
web local để kiểm tra và triển khai trang web của mình. Tất cả mọi thứ cần cho phát
triển một trang web - Apache (ứng dụng máy chủ), Cơ sở dữ liệu (MariaDB) và ngơn
ngữ lập trình (PHP) được gói gọn trong 1 tệp. Xampp cũng là 1 đa nền tảng vì nó có
thể chạy tốt trên cả Linux, Windows và Mac. Hầu hết việc triển khai máy chủ web
thực tế đều sử dụng cùng thành phần như XAMPP nên rất dễ dàng để chuyển từ máy
chủ local sang máy chủ online.

Chương 5

Hình ảnh demo giao diện:

a. Giao diện trang chủ:
Khách hàng vào trang web để xem sản phẩm, tìm các cơng thức nấu ăn.

21

Hình 1: Giao diện trang chủ
b. Giao diện phân loại món ăn:
Để tiện cho việc chọn lọc ra những món ăn theo loại thì trang phân loại món ăn
sẽ phân ra từng mục, từng loại để người dùng có thể dễ dàng lựa chọn hơn.

Hình 2: Giao diện phân loại món ăn
c. Giao diện chi tiết sản phẩm/chi tiết bài viết:
Nếu cần xem chi tiết về các món ăn như tên, nguyên liệu nấu,…cũng như một chi
tiết bài viết nào đó thì trang chi tiết sẽ là trang mà người quản trị muốn upload
lên để người dùng có thể hiểu rõ hơn về món ăn, bài viết.

22


Hình 3: Giao diện chi tiết món ăn

Hình 4: Giao diện chi tiết món ăn

d. Giao diện các món ăn được u thích:
Người dùng xem lại các món ăn mình u thích trước đó.

23


Hình 5: Giao diện các món ăn được u thích

e. Giao diện tìm kiếm: Người dùng timg kiếm món ăn theo tên,..

Hình 6: Giao diện tìm kiếm

f.Giao diện tài khoản: Người dùng thay đổi mật khẩu, thay đổi thông tin tài khoản,…

24


Hình 7: Giao diện tài khoản

g. Giao diện danh mục:
Hiện danh sách các danh mục có trong bài viết và quản trị viên có thể thêm, sửa, xóa
các danh mục.

Hình 8: Giao diện danh mục

25