Đồ án Xây dựng Website Hellen Tea Coffe

MỤC LỤC GIỚI THIỆU 1 Mục tiêu đề tài Giải pháp cách thực đề tài Tìm hiểu Hellen Tea & Coffee Ý nghĩa CHƯƠNG I: TỔNG QUAN 1.1 Tổng quan World Wide Web 1.1.1 Khái niệm .2 1.1.2 Cách tạo website .2 1.1.3 Trình duyệt web (web Client hay web Browser) .2 1.1.4 Webserver .3 1.2 Tổng quan Html-Css 1.2.1 Giới thiệu html 1.2.2 Giới thiệu Css 1.3 Ngôn ngữ PHP 1.3.1 Định nghĩa PHP .5 1.3.2 Lý nên dùng PHP 1.3.3 Hoạt động PHP 1.3.4 Tổng quan PHP .7 1.3.5 Hàm PHP 1.3.6 Biểu mẫu PHP 1.3.7 PHP OOP(Object-Oriented Programming.) .9 1.3.8 Session Cookie 1.4 My SQL 10 1.5.Giới thiệu Bootstrap 10 1.5.1 Bootstrap gì? 10 1.5.2 Lịch sử Bootstrap 11 1.5.3 Tại nên sử dụng Bootstrap? 11 1.5.4 Cấu trúc tính Bootstrap gì? .12 1.6 Giới thiệu jQuery 12 1.6.1 Định nghĩa jQuery 12 1.6.2 Tại nên chọn jQuery 13 1.6.3 Cài đặt tích hợp jQuery vào website 13 1.6.4 Cú pháp jQuery 14 1.7 Tìm hiểu mơ hình MVC 14 1.7.1 MVC gì? 14 1.7.2 Các thành phần MVC .15 1.7.3 MVC làm việc nào? 16 1.7.4 Ưu điểm nhược điểm MVC 16 CHƯƠNG II: THIẾT KẾT BACK-END, FRONT-END 17 1.Phân tích thiết kế hệ thống 17 1.1 Thiết kế sở liệu 20 1.2 Lược đồ quan hệ 26 1.3 Mô hình thực thể E-R 27 1.4 Mơ hình liên kết liệu 28 1.5 Sơ đồ phân rã chức 29 Phân tích cấu trúc thư mục 30 2.1 Controller .30 2.2 Model 31 2.3 View 32 Xây dựng Back-end 33 3.1 Các chức quản lý đồ uống 34 3.2 Các chức quản lý Banner Slider 44 3.3 Các chức quản lý viết 50 3.4 Các chức quản lý tài khoản 58 3.5 Các chức đăng nhập phân quyền 65 Xây dựng Front-end 71 4.1 Trang chủ .73 4.2 Thanh điều hướng 77 4.3 Trang danh sách đồ uống .78 4.4 Trang danh sách viết 82 4.5 Banner Slider 86 4.6 Footer .87 CHƯƠNG III: DEMO WEBSITE 89 Demo Back-end 89 Demo Front-end 94 2.1 Demo trang chủ .94 2.2 Demo trang viết .95 2.3 Demo trang đồ uống 96 2.4 Demo trang giới thiệu 98 2.5 Demo trang liên hệ 98 KẾT LUẬN 99 TÀI LIỆU THAM KHẢO 100 LỜI MỞ ĐẦU Ngày nay, ứng dụng công nghệ thông tin việc tin học hóa xem yếu tố mang tính định hoạt động phủ, tổ chức, công ty, doanh nghiệp Điều đóng vai trị quan trọng tảng để tạo bước đột phá mạnh mẽ Cùng với phát triển khơng ngừng kỹ thuật máy tính mạng Internet, công nghệ thông tin chứng minh ngành mũi nhọn, chinh phục hết đỉnh cao đến đỉnh cao khác Trên thực tế, mạng Internet sản phẩm có giá trị mức độ ảnh hưởng to lớn trở thành công cụ thiếu, tảng để giúp truyền tải, trao đổi thơng tin tồn cầu Ngày nay, việc liên quan đến thông tin trở nên thật dễ dàng cho người dùng, cần có máy tính kết nối Internet dịng liệu truy tìm gần lập tức, giới vấn đề mà bạn quan tâm ra, có đầy đủ thơng tin, hình ảnh chí đơi lúc có âm bạn cần, v.v Thông qua Internet, thực nhiều công việc với tốc độ nhanh chi phí thấp nhiều so với cách thức truyền thống Chính điều này, thúc đẩy khai sinh phát triển thương mại điện tử phủ điện tử khắp giới, làm biến đổi đáng kể văn hóa, nâng cao chất lượng sống người Trong hoạt động sản xuất, kinh doanh, thương mại điện tử khẳng định vai trò xúc tiến thúc đẩy phát triển doanh nghiệp Đối với cửa hàng hay shop, việc quảng bá giới thiệu đến khách hàng sản phẩm đáp ứng nhu cầu khác hàng quan trọng cần thiết Một cơng cụ hữu ích xây dựng Website cho cửa hàng để giới thiệu quảng bá tất sản phẩm, dịch vụ đến người dùng Chính lý này, em chọn thực đồ án “Xây dựng Website Hellen Tea & Coffee” làm đồ án tốt nghiệp để xây dựng website hữu ích cho người dùng Với hướng dẫn tận tình giáo Nguyễn Thị Xn Hương em hoàn thành đồ án Tuy cố gắng tìm hiểu, phân tích thiết kế cài đặt hệ thống không tránh khỏi thiếu sót Em mong nhận ý kiến đóng góp q báu Thầy Cơ Em xin chân thành cảm ơn GIỚI THIỆU Mục tiêu đề tài Tìm hiểu, nghiên cứu xây dựng Website Hellen Tea & Coffee Xây dựng website động với nội dung linh hoạt, cấu trúc rõ ràng, bắt mắt để phù hợp với mục đích quảng bá, bán hàng Giải pháp cách thực đề tài Tìm hiểu website đồ uống phổ biến, tham khảo bố cục website Đến quán Hellen Tea để tìm hiểu thông tin hoạt động quán, thu thập hình ảnh, liệu Sau phân tích thiết kế hệ thống thông tin, xây dựng nội dung quản trị Back-end giao diện Front-end website Xây dựng website việc lựa chọn ngơn ngữ ứng dụng làm việc điều quan trọng Đề tài sử dụng ngơn ngữ PHP làm ngơn ngữ lập trình để xây dựng website số thư viện hỗ trợ việc xây dựng website Tìm hiểu Hellen Tea & Coffee Quán Hellen Tea & Cofffee nơi kinh doanh đồ uống, khai trương vào tháng năm 2020 Quán thuộc quyền sở hữu gia đình, có quy mơ nhỏ (sức chứa khoảng 30 người) Tại bán đa dạng loại đồ uống như: trà sữa, coffee, sinh tố, v.v Hellen Tea & Coffee cịn nhận tổ chức kiện có quy mơ vừa nhỏ ví dụ như: tiệc, sinh nhật, v.v Ngồi việc bán hàng trực tiếp qn cịn bán online giao hàng tận nơi sử dụng dịch vụ Foody.vn Địa chỉ: 147B Trung Lực, P Đằng Lâm, Quận Hải An, Hải Phòng Ý nghĩa Lợi ích việc xây dựng website nói chung website Hellen Tea & Coffee nói riêng điều cần thiết quan trọng Giúp ích việc truyền đạt thơng tin tới người mua hàng, quảng bá hình ảnh quán Giúp thực khách cập nhật tin tức thú vị xoay quanh chủ đề đồ uống , thông báo khuyến mại quan trọng giúp ích cho q trình mua sản phẩm qn thơng qua internet Sinh viên: Trần Duy Hải - Lớp: CT2001C - Ngành Công nghệ Thông tin CHƯƠNG I: TỔNG QUAN 1.1 Tổng quan World Wide Web 1.1.1 Khái niệm World Wide Web (WWW) hay gọi web dịch vụ phổ biến Internet, 85% giao dịch Internet ước lượng thuộc WWW Ngày số website giới đạt tới số khổng lồ WWW cho phép truy xuất thơng tin văn bản, hình ảnh, âm thanh, video tồn giới Thơng qua website, q cơng ty giảm thiểu tối đa chi phí in ấn phân phát tài liệu cho khách hàng nhiều nơi 1.1.2 Cách tạo website Có nhiều cách để tạo website, tạo website chương trình xử lí văn nào: Tạo web cách viết mã nguồn trình soạn thảo văn như: - Notepad, WordPad, v.v chương trình soạn thảo văn có sẵn Window - Thiết kế cách dùng web Wizard công cụ Word 97, Word 2000 - Thiết kế web phần mềm chuyên nghiệp: PHPStorm, Dreamweaver, Nescape Editor, giúp thiết kế website dễ dàng hơn, nhanh chóng hơn, phần lớn mã lệnh HTML có sẵn phần code - Để xây dựng ứng dụng web hoàn chỉnh có tính thương mại, cần kết hợp Client Script (kịch trình khách) Server Script (kịch trình chủ) với loại sở liệu đó, chẳng hạn như: MSAccess, SQL Server, MySQL, Oracle, v.v - Khi muốn triển khai ứng dụng web mạng, ngồi điều kiện cấu hình phần cứng, cần có trình chủ web thường gọi web Server 1.1.3 Trình duyệt web (web Client hay web Browser) Trình duyệt Web công cụ truy xuất liệu mạng, phần mềm giao diện trực tiếp với người sử dụng Nhiệu vụ Web Browser nhận yêu cầu người dùng, gửi yêu cầu qua mạng tới Web Server nhận liệu cần thiết từ Server để hiển thị lên hình Để sử dụng dịch vụ WWW, Client cần có chương trình duyệt Web, kết nối vào Internet thơng qua ISP Các trình duyệt thơng dụng là: Microsoft Internet Explorer, Google Chrome, Mozilla FireFox, v.v Sinh viên: Trần Duy Hải - Lớp: CT2001C - Ngành Công nghệ Thơng tin 1.1.4 Webserver "Web server" phần cứng phần mềm, hai - Ở khía cạnh phần cứng, web server máy tính lưu trữ file thành phần website (ví dụ: tài liệu HTML, file ảnh, CSS file JavaScript) phân phát chúng tới thiết bị người dùng cuối (end-user) Nó kết nối tới mạng Internet truy cập tới thông qua tên miền giống mozilla.org - Ở khía cạnh phần mềm, web server bao gồm số phần để điều khiển cách người sử dụng web truy cập tới file lưu trữ HTTP server(máy chủ HTTP) Một HTTP server phần mềm hiểu URL (các địa web) HTTP (giao thức trình duyệt bạn sử dụng để xem website) - IIS (Internet Information Service): Hỗ trợ ASP, mở rộng hỗ trợ PHP - Apache: Hỗ trợ PHP - Tomcat: Hỗ trợ JSP (Java Servlet Page) 1.2 Tổng quan Html-Css 1.2.1 Giới thiệu html Hình 1.1: Cấu trúc website - Thẻ định nghĩa trang html, kiểu khai báo html - Thẻ tạo tiêu đề trang tiêu đề, thẻ bắt buộc Thẻ title cho phép trình bày chuỗi tựa đề website website duyệt trình duyệt web Sinh viên: Trần Duy Hải - Lớp: CT2001C - Ngành Công nghệ Thông tin - Thẻ tất thơng tin khai báo thẻ xuất website Những thơng tin nhìn thấy website - Thẻ … định nghĩa nội dung - Thẻ

tạo đoạn - Thẻ thay đổi phông chữ, kích cỡ màu kí tự - Thẻ thẻ định dạng bảng website Sau khai báo thẻ này, phải khai báo thẻ hàng thẻ cột với thuộc tính - Thẻ cho phép chèn hình ảnh vào website Thẻ thuộc loại thẻ khơng có thẻ đóng - Thẻ loại thẻ dùng để liên kết website liên kết đến địa Internet, Mail hay Intranet (URL) địa tập tin mạng cục (UNC) - Thẻ cho phép người dùng nhập liệu hay thị thực thi hành động đó, thẻ Input bao gồm loại thẻ như: text, password, submit, button, reset, checkbox, radio, hidden, image - Thẻ < textarea> < \textarea> cho phép người dùng nhập liệu với nhiều dịng Với thẻ khơng thể giới hạn chiều dài lớn website - Thẻ … cho phép người dùng chọn phần tử tập phương thức định nghĩa trước Nếu thẻ cho phép người dùng chọn phần tử danh sách phần tử thẻ giống combobox Nếu thẻ cho phép người dùng chọn nhiều phần tử lần danh sách phần tử, thẻ dạng listbox - Thẻ … muốn submit liệu người dùng nhập từ website phía Client lên phía Server, có hai cách để làm điều nàu ứng với hai phương thức POST GET thẻ form Trong website có nhiều thẻ khác nhau, thẻ