Báo cáo môn thiết kế web bằng bootstrap thiết kế trang web bán hàng

TRƯỜNG CAO ĐẲNG CẦN THƠ KHOA KỸ THUẬT CÔNG NGHỆ - MÔI TRƯỜNG BÀI BÁO CÁO MÔN THIẾT KẾ WEB BẰNG BOOTSTRAP THIẾT KẾ TRANG WEB BÁN HÀNG Giảng Viên Hướng Dẫn: Ths.Tần Duy Khánh Sinh Viên Thực Hiện: Nông Tấn Phước MSSV 21C27039 Lớp: Hệ Thống Thông Tin K46 Khoa: Kĩ Thuật Công Nghệ - Môi Trường TRƯỜNG CAO ĐẲNG CẦN THƠ KHOA KỸ THUẬT CÔNG NGHỆ - MÔI TRƯỜNG BÀI BÁO CÁO MÔN THIẾT KẾ WEB BẰNG BOOTSTRAP THIẾT KẾ TRANG WEB BÁN HÀNG Giảng Viên Hướng Dẫn: Ths.Tần Duy Khánh Sinh Viên Thực Hiện: Nông Tấn Phước MSSV 21C27039 Lớp: Hệ Thống Thông Tin K46 Khoa: Kĩ Thuật Công Nghệ - Môi Trường Mục Lục CHƯƠNG 1: TỔNG QUAN 1.1 Giới Thiệu 1.2 Chủ đề: 1.2.1 mô tả 1.3 mục tiêu 1.4 yêu cầu CHƯƠNG 2: THIẾT KẾ WEBSITE 2.1 Đặt tả trang web: 2.1 Các Trang nội dung 2.1.1 Trang Chủ 2.1.2 Trang Đăng Nhập .2 2.1.3 Trang Đăng ký 2.1.4 Trang Thông tin .3 2.1.5 Trang Giỏ hàng 2.1.6 Trang toán .3 2.2 Công cụ phát triển 2.3 Chương trình chạy demo 3.1 Kết Quả Đạt Được 3.2 Hạn Chế 3.3 Ưu điểm CHƯƠNG 1: TỔNG QUAN 1.1 Giới Thiệu Ngày ứng dụng công nghệ thông tin việc tin học hóa xem yếu tố định hoạt động đời sống người Cùng với phát triển không ngừng kỹ thuật máy tính mạng điện tử, website phần không thiếu đời sống ngày Với phát triển mạnh mẽ công nghệ làm xuất loại hình kinh doanh mới, số kinh doanh website bán hàng online Kinh doanh online bùng nổ mạnh mẽ với lượng sử dụng mạng internet cho kinh doanh ngày gia tăng Hay phát triển thương mại điện tử Vốn ít, cơng cụ truyền thơng đa dạng nguồn lợi lớn ưu điểm dễ thấy phương thức kinh doanh online 1.2 Chủ đề: Website bán họa cụ, màu ,viết, giấy dùng mĩ thuật, hội họa 1.2.1 mô tả Một Website chuyên buôn bán họa cụ dùng hội họa, với mục đích giới thiệu cho người dùng sản phẩm mang chất lượng cao, mang mức giá phải Liên kết trang web: https://artdraw.000webhostapp.com/trangchu.html 1.3 mục tiêu + Website có bố cục đơn giản dễ dàng tiếp cận, sử dụng, + Website cung cấp cho người dùng thông tin sản phẩm bật có thị trường mà người dùng muốn + Người dùng xem thông tin sản phẩm đăng ký thành viên, trở thành thành viên Website toán sản phẩm mà người dùng muốn mua + Quản trị viên dễ dàng điều chỉnh, thêm, sữa, xóa 1.4 yêu cầu Trang web phải có tối thiểu từ trang trở lên: trang chủ, trang hiển thị sản phẩm, trang chi tiết sản phẩm, trang giỏ hàng, trang toán, trang liên hệ, trang đăng ký thành viên Giao diện phải đồng trang, có menu, có phần footer thể thơng tin website (địa chỉ, số dt, google map, ) CHƯƠNG 2: THIẾT KẾ WEBSITE 2.1 Đặt tả trang web: + Trang chủ gồm:  Thanh menu  Carousel  Nội dung  sản phẩm  Footer + Trang đăng ký thành viên gồm:  Form đăng ký  Nút quay trang chủ +Trang đăng nhập gồm:  Form đăng nhập  Nút quay trang chủ + Trang giỏ hàng gồm:  Thanh menu  Form thông tin sản phẩm  nút toán  Footer + Trang toán gồm:  Form toán thẻ  Nút quay trang chủ + Trang Thông tin gồm:  Thanh menu  Carousel  Mô tả sản phẩm  Chi tiết sản phẩm  Footer  Giới thiệu sản phẩm khác 2.1 Các Trang nội dung 2.1.1 Trang Chủ Nơi người dùng đăng nhập vào, nơi tập trung giới thiệu nội dung sản phẩm 2.1.2 Trang Đăng Nhập Là nơi người dùng đăng nhập tài khoản 2.1.3 Trang Đăng ký Là nơi người dùng đăng ký tài khoản 2.1.4 Trang Thông tin Là nơi chứa thông tin sản phẩm, mô tả 2.1.5 Trang Giỏ hàng Là nơi chứa sản phẩm người dùng dự kiến mua 2.1.6 Trang toán Là Trang người dùng tốn sản phẩm 2.2 Cơng cụ phát triển  Visual studio code  https://vn.000webhost.com 2.3 Chương trình chạy demo Trang Đăng Ký Trang Đăng Nhập Trang Giỏ Hàng Trang tốn Trang Thơng tin Footer trang web CHƯƠNG 3:KẾT QUẢ 3.1 Kết Quả Đạt Được + Vận dụng kiến thức học áp dụng vào báo cáo + Giải vấn đề nội dung yêu cầu báo cáo + Chọn lọc hình ảnh phù hợp với nội dung +Trang web tương tác truy cập trang khác 3.2 Hạn Chế  Thiếu sót chức năng, giao diện chưa thẩm mĩ  Thiếu hiệu ứng cần thiết cho trang web  Giao diện đơn giản  Kỹ viết html, css, bootstrap chưa tốt nên số chỗ chưa hoàn thiện 3.3 Ưu điểm  Hoàn thành chức website  Có thể chuyể n đổ i t giao diệ n máy tnh, sang giao diệ n điệ n thoạ i,máy tnh máy tnh bảng TÀI LIỆU THAM KHẢO Website [1] https://www.w3schools.com/bootstrap5/ [2] https://getbootstrap.com/docs/5.0/getting-started/introduction/ [3] https://www.w3schools.com/howto/howto_css_checkout_form.asp [4] https://www.w3schools.com/bootstrap5/bootstrap_carousel.php [5] https://www.w3schools.com/bootstrap5/bootstrap_navbar.php [6] https://www.w3schools.com/bootstrap5/bootstrap_form_validation.php [7] https://www.w3schools.com/bootstrap5/bootstrap_containers.php TRƯƠNG CAO ĐĂNG CÂ(N THƠ CÔNG HOA XA HÔI CHU NGHIA VIÊT NAM KHOA KTCN-MƠI TRƯƠNG Đơc lâp - Tư – Hanh Phuc NHÂN X T V" Đ$NH GI$ GVHD: Ths Tần Duy Khánh Sinh viên: Lớp: Hê oThống Thơng Tin Khóa 46 Nhânh xjt Giảng viên hướng dẫn Sinh Viên Thực Hành Giảng Viên Hướng Dpn Ths Tần Duy Khánh