Mục lục

I-Lý do chọn đề tài.................................................................................................................................. 1

II-Các chức năng chính của trang web.................................................................................................... 1
1. Phần frontend(Người dùng)........................................................................................................ 1
1.1 Trang chủ............................................................................................................................ 1
1.2 Trang danh mục sản phẩm.................................................................................................. 3
1.3 Trang chi tiết sản phẩm....................................................................................................... 4
2. Phần backend(Admin)................................................................................................................ 5
2.1 Login...................................................................................................................................5
2.2 Giao diện trang admin.........................................................................................................5
III- Công việc........................................................................................................................................... 9
I-Lý do chọn đề tài

Lời đầu tiên, em xin chân thành gửi lời cảm ơn tới hai giảng viên môn Công nghệ Web là
thầy Phạm Trí Công và thầy Kiều Tuấn Dũng đã hướng dẫn em học tập và hoàn thành bài tập
lớn tạo nên một trang web bán hàng bằng các ngôn ngữ HTML, CSS, JS và PHP ngoài ra còn
học thêm cách sử dụng thư viện Bootstrap.

Ofélia là hãng mỹ phẩm trẻ được sáng lập ra từ một nhóm bạn trẻ người Việt đang học tập và
sinh sống tại nước ngoài. Với đam mê với mỹ phẩm, đặc biệt là với son, cuối năm 2016,
những thỏi son đầu tiên của Ofélia ra đời. Để tiện cho khách hàng trong và ngoài nước mua
hàng, trang web Ofélia được phát triển và đưa vào hoạt động. Em chọn đề tài này một phần là
do sở thích và phần còn lại muốn tìm hiểu cách thức tạo nên một trang web cùng phương
thức hoạt động của nó.

II-Các chức năng chính của trang web

1. Phần frontend(Người dùng)
1.1 Trang chủ
● Đây là trang chính, chứa tất cả thông tin sản phẩm của hãng Ofélia. Trong
trang này có chứa:
● Một danh sách danh mục sản phẩm gồm có son thỏi, son kem và cọ.
● Chức năng tìm kiếm sản phẩm trong trang.
● Chức năng giỏ hàng giúp người mua hàng nhanh chóng chọn lựa và thanh toán
sản phẩm.
● Cuối cùng là những bức ảnh về sản phẩm trên trang mạng xã hội chính là
Instagram.

Dưới đây là hình ảnh của trang chủ:

1
2
1.2 Trang danh mục sản phẩm

Trang danh mục giúp khách hàng dễ dàng tìm kiếm sản phẩm mình quan tâm. Tùy
vào sản phẩm mà có trang danh mục của riêng nó, như danh mục son thỏi sẽ chỉ chứa
thông tin chung của những cây son thỏi. Tương tự như vậy đối với son kem và cọ,
ngoài ra còn có các danh mục chứa thông tin khác như cách thức mua hàng, kiểm tra
đơn hàng, tuyển dụng và hỗ trợ.

3
1.3 Trang chi tiết sản phẩm

Trang chi tiết sản phẩm giúp khách hàng có thể nhìn thấy thông tin sản phẩm mình
quan tâm một cách chi tiết nhất về tên sản phẩm, giá sản phẩm, mã sản phẩm, mô tả
sản phẩm cũng như tình trạng sản phẩm, ngoài ra còn có mục chọn số lượng sản phẩm
để đặt hàng.

Phần dưới của trang chi tiết một sản phẩm đó là những sản phẩm cùng danh mục để
khách hàng có thể dễ dàng tìm hiểu thêm các sản phẩm khác.

4
2. Phần backend(Admin)
2.1 Login

Muốn vào trang quản lý, người sử dụng phải đăng nhập với tài khoản và mật khẩu sẵn
có.

Form đăng nhập:

2.2 Giao diện trang admin

Sau khi đăng nhập thành công sẽ hiện ra trang quản lý các sản phẩm với các chức
năng thêm, sửa, xóa cơ bản cùng tìm kiếm sản phẩm trong mục.

2.2.1 Trang quản lý sản phẩm

5
6
a. Thêm sản phẩm

b. Sửa sản phẩm

7
 c. Kết quả xóa sản phẩm:

2.2.2 Trang quản lý danh mục

a. Thêm danh mục sản phẩm

b. Sửa danh mục sản phẩm

c. Kết quả xóa danh mục

8
III- Công việc
Bảng phân chia ưu điểm và nhược điểm của từng phần:

ST
T Công việc Ưu điểm Nhược điểm Ghi chú
Trang chủ Hoàn thành chức năng: Chưa làm được chức năng Làm giao diệ
+Tìm kiếm trên trang giỏ hàng, hiển thị trên bằng bootstr
+Sử dụng PHP đổ được trang chủ. html, css tuy
danh mục lên Các mục không phải sản vẫn phải tha
1
+Hiển thị toàn bộ sản phẩm phẩm đang phát triển khảo code củ
Có sử dụng bootstrap để thêm nên đang để tĩnh. trang Ofélia,
chia cột và sử dụng thư viện và sửa thành
icon của mình
Trang danh Giao diện tương tự như Chưa làm được chức năng Làm được gi
mục sản trang chủ, tuy nhiên sản giỏ hàng, chưa làm được diện và đổ d
2 phẩm phẩm đổ ra sắp xếp được chức năng xem dạng lưới
theo giá tăng dần và giảm hay danh sách
dần
Trang chi Trang chi tiết gồm có: Phần chọn số lượng sản Làm giao diệ
tiết sản +Dữ liệu sản phẩm tương phẩm cho vào giỏ hàng đổ dữ liệu tư
phẩm ứng với từng mục chưa làm được tự trang chủ
3 +Có mục sản phẩm cùng
danh mục, sử dụng php đổ
được sản phẩm tương ứng

Trang đăng Giao diện sử dụng bootstrap Muốn đăng nhập phải Giao diện sử
nhập nhập đúng link do từ trang form có sẵn,
4
chủ không cần đăng nhập và sửa lại th
bài của mình
Trang quản Có đầy đủ chức năng tìm Giao diện khá đơn giản, Code PHP sử
lý danh kiếm, thêm, sửa, xóa các chưa được chau chuốt của thầy, hiể
mục, quản mục; tìm kiếm được sản sửa thành bà
lý sản phẩm trong danh sách sản mình
5
phẩm và phẩm
các trang
chức năng
liên quan