Báo cáo kết thúc môn học thiết kế website

Em nhận được sự quan tâm giúp đỡ tận tỉnh của các giáo viên Viên Kỹ thuật - Công nghê cũng như các thầy cô trong nhà trường đã tạo điều kiện thuận lợi cho em hoàn thành chương trình đào

TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT VIỆN KỸ THUẬT CÔNG NGHỆ

PAI HOC

THU DAU MOT

2009 ~=THU DAU MOT UNIVERSITY

BAO CAO KET THUC MON HOC

THIET KE WEBSITE

Sinh viên thực hiện: Nguyễn Minh khôi

Ma SV: 2324802010261

Lop: D23CNTT05

Giang vién giang day: Tran Thu Huong

Binh Duong, 3/2024

VIEN KY THUAT - CÔNG NGHỆ

NHẬN XÉT VA CHAM DIEM CUA GIANG VIEN

Ho và tên giảng viên: Trần Thu Hương

Tên đề tài: THIẾT KẺ WEBSITE CÁM TRẠI

Nội dung nhận xét:

Băng sSỐ: 2 2.

GIANG VIEN CHAM

(KV, ghi rõ họ tên)

Trần Thu Hương

Mục lục

CHUONG 1: CO SO LY THUYET

1 Tổng quan về thương mại điện tử

2 Tìm hiểu về Visual Studio Code

CHƯƠNG 2: PHÂN TICH THIET KE

1 Các chức năng của hệ thống:

2 Mô tả chức năng:

3.Quản trị viên

a Phục vụ khách hàng:

CHƯƠNG 3: XÂY DỰNG WEBSITE

A: PHONG CACH THIET KE WEBSITE CAM TRAI

1 Khái quát về trang web cắm trại

1.1 Phong cách thiết kế website

1.2 phong cách thiết kế classic _ màu sắc và điểm nhấn "

1.3 Camping là gì ?

B.GIỚI THIỆU TRANG WEB TỪ TỎNG QUÁT ĐẾN CHI TIẾT 52 25255 ©5+

2/ DICH VU

LOI CAM ON

Trong quá trình hoc tap và nghiêm cứu tại Trường Đại học Thủ Dầu Một Em nhận được sự quan tâm giúp đỡ tận tỉnh của các giáo viên Viên Kỹ thuật - Công nghê cũng như các thầy cô trong nhà trường đã tạo điều kiện thuận lợi cho em hoàn thành chương trình đào tạo môn học “Thiết kế Web”

Nhân địp hoàn thành báo cáo kết thúc môn học này, em xin tỏ lòng biết ơn sâu sắc tới cô Trần Thu Hương, lời chào trân trọng và lời chúc sức khỏe và lời cảm ơn sâu sắc đến cô Với sự quan tâm dạy đỗ, chia sẻ những kinh nghiệm và tràn đầy phong phú đến cho em, đến nay em đã hoàn thành môn học của mình, với đề tài:

“Thiết kế Webside cắm trại”

Bài báo cáo của em còn nhiều sai sót kính mong nhận được những đóng góp và giúp

đỡ chân thành đến từ phía cô để em có thê bỗ sung những gì bồ ích và nâng cao kiến thức của mình đề giúp bán thân tốt hơn phục vụ và cộng tác sau nay

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

Binh Dương, ngày 17 tháng 3 năm 2024

Sinh viên thục hiện

Nguyễn Minh Khôi

LỚI MƠ ĐẦU

Công nghệ thông tin là một trong những lĩnh vực bức thiết không thẻ thiếu trong

bộ máy kinh tế của nhiều nước trên thê giới đặc biệt là những nước đang phát triển như Việt Nam hiện nay

Việc cập nhập thông tin là rất cần thiết với nhà quản lý, nhà kinh doanh trong lĩnh

vực này Để quảng bá sản phẩm nhiều nhà kinh doanh của các công ty lớn đã có chiến lược quảng bá sản phẩm trên các thông tin đại chủng như báo, radio, TV trong đó quảng

bá sản phẩm trên website là một trong những giải pháp hữu hiệu nhất.Đây là hình thức truyền tải thông tin nhanh chóng, hiệu quả và chỉ phí thấp Những khách hàng có nhu cầu mua cho mình một cuốn sách có thể trực tiếp mua thông qua website trực tuyến, không mắt nhiều thời gian mà khách hàng đã có thể sở hữu cuốn sách mà mình yêu thích Với nhiều thành quả quan trọng, công nghệ thông tin đã được ứng dụng rộng rãi trong nhiều lĩnh vực, trở thành một trong những yếu tố quan trọng nhất của sự phát triển kinh tế - xã hội, an ninh - quốc phòng Việc đây mạnh ứng dụng công nghệ thông tin sẽ làm thay đôi tác phong làm việc, nâng cao năng suất lao động, nâng cao đân trí, Chính

vì thế, công nghệ thông tin sẽ trở thành nền kinh tế mũi nhọn của nước ta trong những năm tới đây

Qua quá trình được học trên lớp và tìm hiểu về môn học lập trình website em đã áp

dụng những kiến thức đã học đề xây dựng và thiết kế hệ thống “WEBSITE CẮM TRẠI”

với sự hướng dẫn tận tình của giáo viên hướng dẫn Ngoài ra làm đồ án này cũng giúp cho em nâng cao khả năng lập trình, thiết kế và rút được nhiều kinh nghiệm cho các trang web sau Do kiến thức và kinh nghiệm lập trình, thiết kế còn hạn chế nên phan mém cua

em còn có nhiều thiếu xót Rất mong được sự đóng góp của thầy cô và các bạn đề phần mềm của em được hoàn thiện hơn nữa

CHUONG 1: CO SO LY THUYET

Tim hiéu li thuyét

1 Tông quan về thương mại điện tử

Thương mại điện tử (hay còn gọi là e-commerce) là quá trình mua bán hàng hóa và dịch vụ thông qua các nên tảng trực tuyến như internet Điều này có thể bao gồm các hoạt động như mua sắm trực tuyến, thanh toán điện tử, quảng cáo trực tuyên và các dịch vụ tài chính trực tuyến khác Thương mại điện tử cho phép doanh nghiệp và cá nhân tiếp cận và tương tác với khách hàng một cách thuận tiện và linh hoạt hơn, cũng như mở rộng phạm vị kinh doanh của họ sang các thị tường toàn cầu

Thương mại điện tử đã phát triển mạnh mẽ trong những năm gần đây nhờ vào sự tiện lợi, linh hoạt và rộng lớn của internet Điều nay đã tạo ra một môi trường kinh doanh mới và cung cấp cơ hội cho các doanh nghiệp đề tiếp cận khách hàng toàn cầu một cách hiệu quả hơn

2 Tim hiéu vé Visual Studio Code

Visual Studio Code (VS Code) là một trình soạn thảo mã nguồn mở và miễn phi, được phát triển bởi Microsoft Nó được thiết kế đề hỗ trợ việc phát triển phân mềm

và các dự án lập trình khác nhau bằng nhiều ngôn ngữ lập trình khác nhau V§ Code cung cấp một loạt các tính năng hữu ích như hỗ trợ cú pháp, gợi ý mã, debug, hé thống mở rộng mạnh mẽ và tích hợp với các công cụ quản lý mã nguồn như Git Đặc biệt, nó có hiệu suất cao và có khả năng tùy chính linh hoạt, điều này đã làm cho nó trở thành một trong những trình soạn thảo phố biến nhất trong cộng đồng phát triển phần mềm

Ly do ma Visual Studio Code là một lựa chon pho biến cho việc lâp trình web:

e _ Miễn phí và mã nguồn mở: VS Code là một phần mềm miễn phí và mã nguôn mở, điều này có nghĩa là bạn có thê sử dụng nó mà không cân phải trả bât kỷ khoản phí nào và có thê tùy chỉnh mã nguôn tùy theo nhu câu của bạn

® - Đa năng và linh hoạt: VS Code hỗ trợ nhiều ngôn ngữ lập trình và công nghệ web pho bién nhu HTML, CSS, JavaScript, TypeScript, và nhiều ngôn ngữ khác Điều nay làm cho nó trở thành một công cụ phát triển linh hoạt cho các

Hiệu suật cao: Về Code được tôi ưu hóa đề có hiệu suật cao, cho phép bạn làm việc một cách mượt mà và hiệu quả ngay cả trên các dự án lớn

Hỗ trợ mạnh mẽ cho mở rộng: VS Code có một hệ thống mở rộng mạnh mẽ, cho phép bạn tùy chỉnh và mở rộng chức năng của nó theo nhu câu cụ thê của bạn thông qua các tiện ích mở rộng của cộng đồng

Tích hợp với các công cụ phát triển web: VS Code tích hợp tốt với các công

cụ và dịch vụ phát triển web phổ biến như Git, GitHub, Docker, và nhiều công

cụ khác, giúp bạn đê dàng quản lý mã nguồn và triên khai ứng dụng

Cộng đồng lớn: VS Code có một cộng đồng lớn và tích cực, với nhiều tài nguyên học tập, tiện ích mở rộng và hồ trợ từ cộng đông giúp bạn giải quyết các vân đề và học hỏi từ những người khác

CHUONG 2: PHAN TICH THIET KE

Mô tả hệ thống

1 Các chức năng của hệ thống:

Hệ thông website hoạt động theo hình thức mua bán thông thường nhưng thông qua giao điện web dễ đàng và tiện lợi hơn khi xem thông tin món hàng cần thiết,chọn và đặt hàng kèm theo cách thức thanh toán nhanh chóng thuận lợi đem lại trải nghiệm tốt Ngoài ra website còn cung cấp gợi ý về địa điểm cắm trại, vị trí cửa hàng, cùng với hệ thống bảo mật đảm bảo an toàn thông tin cho người dùng

2, Mô tả chức năng:

Website cho phép doanh nghiệp và khách hàng có thê tiên hành việc mua bán sản pham/ dịch vụ trực tuyến.Có hai đối tượng hoạt động cơ bản: Quản trị website và khách hàng với từng đối tượng sử dụng có từng chức năng riêng biệt

3.Quản trị viên

- Là người có quyền quản trị cao nhât,có thê ra vào chỉnh sửa trang web

- Là người phân quyền và hủy quyền cho người những người cùng sử dụng hệ thống

- Là người quản lý, tối ưu nhằm đảm bảo cho website vận hành tốt hơn và nâng cao trải nghiệm người dùng

Với những người trải nghiệm mua hàng có quyền đăng ký tài khoản thành viên website,khi đã có thi có quyền thay đôi thông tin cá nhận,có quyền xem các mặt hàng đang bán, mua hàng ,thanh toán và đề lại đánh gia san pham

5.Phân tích hệ thống

Một website thì phải thực hiện được các chức năng chính sau:

a Phục vụ khách hàng:

-Khách hàng nhận được sự phục vụ tử tê, cung cấp thông tin một cách trực quan

-Nhận được nhiều ưu đãi tốt, chính sách hậu mãi lâu đài

b Quản lý hệ thống:

- Quan trị viên là người quản lí website, đăng thông tim, sản phâm, bảo mật thông tin khách hàng, hệ thông của website

6.Quản lý sản phẩm:

- Quản lý danh mục sản phâm

- Thêm mới sửa ,xóa sản phẩm

- Thay đổi trạng thái giao diện hiển thị sản phẩm trên trang chủ,hiển thị đanh sách các mục mới ,sản phâm noi bat ban chay

-_ Cập nhập hình ảnh bắt mắt,thu hút người mua

-_ Cập nhập thông tin sản phâm chính xác có nguồn gốc xuất xứ rõ ràng

- Tìm kiếm sản phâm nhanh chóng đưa ra các gợi ý nhận xét tăng độ tin cậy sản phẩm

7.Quản lý khách hàng

- Quản lý thông tin danh sách các khách hàng

- Khi đăng ký cũng như thanh toán sẽ gửi về email thông báo

- Hệ thông hotline luôn trực 24/7 đề hỗ trợ khách hàng

8 Quan ly don hang

- Khách hàng gửi đơn đặt hàng sẽ lưu trên cơ sở đữ liệu

- Hệ thống tự động xử lý đơn hàng giao cho khách,xử lý xong sẽ xác nhận đã

hoàn thành đơn hàng trên hệ thống.

CHƯƠNG 3: XÂY DỰNG WEBSITE

A: PHONG CACH THIET KE WEBSITE CAM TRẠI

1 Khai quat về trang web cắm trại

1.1 Phong cách thiết kế website

Trong phong cách thiết kế website cắm trại, yếu tố được chú trọng nhất chính là tính đối xứng Nếu bước vào một không gian được thiết kế theo phong cách thư giản, bạn sẽ nhìn thấy được sự sắp xếp cân đối và đẹp đến hoàn hảo Đối xứng chính là nếu bạn chia phòng thành 2 phần thì mỗi bên sẽ sở hữu các thiết kế giống hệt bên còn lại theo từng bức tường hay tone màu

AX Daily Camping DỊCH VỤ THÔNGTIN BLOG SHOP

Các địa điểm du lịch thú vị TẠI ĐÂY

Tính đối xứng được đánh giá đầu tiên trong phong cách

Tin tức trong thành phô

Điểm đến cuối tuần

Công cụ cắm trại

Những cửa

Khung nên đơn giản, đề nhìn, hài hòa màu sắc

1.2 phong cách thiết kế classic _ mau sắc và điểm nhấn

a/Màu sắc trong thiết kế phong cách Classic

Sử dụng màu được lây cảm hứng từ các tông màu thiên nhiên như màu nâu, xanh xám đây là những màu thường được sử dụng trong phong cách Classic Tuy nhiên, Classic không bị gò bó như phong cách cô điện, những món đỗ nội thất của bạn không nhất thiết cũng là những món đồ cô hay có hoa văn rườm rà, uốn lượn mà hoàn toàn co thé chon những món hiện đại với sắc màu bắt mắt vui tươi

Ụ THÔNGTIN BLOG red Da

Q

Hãy để cuối tuần của bạn

Trang web cắm trại không quá gò bó như cô điền

b/ Điểm nhắn của phong cách

Mỗi trang web con được thiết kế theo phong cách classic sẽ được chọn một điểm nhắn Các kiến trúc sư sẽ lĩnh hoạt và khéo léo lựa chọn điểm nhắn, giúp cho sự tiện nghi của buổi cắm trại được hữu ích hơn

HONG TIN BL

Tai ngay

AiLyCANNS

“| ra ——_

Google Play 4 App Store —

eI

Điểm nhắn có thê là một bức ảnh về ứng dụng

1.3 Camping la gi ?

Camping la gi? Camping (dung trại, cắm trại): Đây là từ có nguồn gốc từ tiếng Anh nhằm diễn tá các hoạt động căm trại và vui chơi ngoài trời Thuật ngữ ` 'camping” có thê được giải thích: “camp” có nghĩa là “trại” Việc thêm hậu td “-ing” dé dién ta hanh động dựng trại, căm trại nên người Việt thường hay sử dụng la “camping” voi nghia cam trai, khi nhắc đến từ này sẽ làm chúng ta liên tưởng đến hoạt động cắm trại vui chơi ngoài trời Ngày nay, bên cạnh hoạt động cắm trại và vui chơi thông thường, nhiều ngườ1/ tô chức còn phát triển camping thành các buổi da ngoai, picnic, tiéc, trekking, hiking, Tóm lại, những hoạt động vui chơi ngoài trời có kế hoạch trong một thời gian nhất định được gọi là camping

B.GIOI THIEU TRANG WEB TU TONG QUAT DEN CHI TIET

I TONG QUAT

1/TRANG CHU

“Những công cụ cắm trại”— Tìm dụng cụ cắm trại tốt nhất cho bạn, như đã đề cập, đây là một website chuyên kinh doanh về những dụng cụ giúp cho bạn có một trải nghiệm tuyệt vời với thiên nhiên Trang web được sử dụng tông màu chủ đạo

là xanh đen một sự kết hợp hoàn mĩ tôn lên vẻ đẹp đơn giản nhưng không kém phân sang trọng

^ Daily Camping OỊCHVỤ THÔNGTIN BLOG SHOP

Những công cụ cắm trại TẠI ĐÂY

Tìm kiếm nhanh

—

Hình ảnh minh họa, không gian trang web trang chủ

Tin tức trong thành phô

Điểm đến cuối tu

Những cửa

2/ DICH VU

Trang web này chứa đựng toàn bộ những dịch vụ từ tốt đến tốt hơn có thê tư vấn cho bất cứ lúc nào khách hàng cần, trang web sắp xếp theo bố cục ngang, tuy không nhiều màu sắc những cũng đủ kiến tạo nên sự sang trọng vốn có của trang web

Le REM eM To

Tim kiém nhanh

` s

= Balo eer Bật lừa Leo núi pyres Hydration XEM THÊM XEM THÊM XEM THÊM XEM THÊM XEM THÊM bo Ga

DAILY TRUY CAP THÔNG TIN KHÁM PHÁ

CAMPING none LIEN LAC

3/DANG KY

Là một trong những trang con quan trọng nhất của cả website, trang đăng ký sẽ

mang đến cho các khách hang một công cụ để có thê liên lạc được với chúng tôi đồng thời cung có thể được sự tư vấn tận tâm, nhờ đó trang liên hệ phải đầy đủ các

ô thông tin đề 2 bên có thê liên hệ được với nhau một cách dé đàng nhất Cũng

như các trang web khác, đề có thê xây đựng nên một website mang tính thống

nhất, các màu sác chủ đạo cần phải liên quan với nhau, với bố cục nằm ngang cô điển cùng những hình ảnh phong phú tạo thêm tính uy tín cho website