ĐẠI HỌC HUẾ TRƯỜNG ĐẠI HỌC KINH TẾ KHOA HỆ THỐNG THÔNG TIN QUẢN LÝ KHÓA LUẬN TỐT NGHIỆP XÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN ĐẶC SẢN TRÊN THÀNH PHỐ HUẾ BẰNG FRAMEWORK LARAVEL DỰA TRÊN NỀN TẢNG N.
Trang 1ĐẠI HỌC HUẾ
TRƯỜNG ĐẠI HỌC KINH TẾ
KHOA HỆ THỐNG THÔNG TIN QUẢN LÝ - -
KHÓA LUẬN TỐT NGHIỆPXÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN ĐẶC SẢN
TRÊN THÀNH PHỐ HUẾ BẰNG FRAMEWORK LARAVEL DỰA TRÊN NỀN TẢNG NGÔN NGỮ PHP
SINH VIÊN THỰC HIỆN:
HUỲNH THỊ HẠNH
Khóa học: 2016-2020
Trang 2ĐẠI HỌC HUẾ
TRƯỜNG ĐẠI HỌC KINH TẾ
KHOA HỆ THỐNG THƠNG TIN QUẢN LÝ - -
KHĨA LUẬN TỐT NGHIỆPXÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN ĐẶC SẢN
TRÊN THÀNH PHỐ HUẾ BẰNG FRAMEWORK LARAVEL DỰA TRÊN NỀN TẢNG NGÔN NGỮ PHP
Sinh viên thực hiện: Huỳnh Thị Hạnh Lớp: K50A - THKT
Giảng viên hướng dẫn: TS Lê Thị Quỳnh Liên
Huế, 05/2020
Trang 3
Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh I
LỜI CẢM ƠN
Học phải đi đôi với hành và với sinh viên thì việc tiếp xúc làm việc trong một môi trường chuyên nghiệp là vô cùng cần thiết vì thế em xin chân thành cảm ơn Ban lãnh đạo Khoa Hệ thống Thông tin Quản lý, trường Đại học Kinh tế, Đại học Huế, đã tạo điều kiện cho em thực tập tại Công ty TNHH Công nghệ sự kiện và Truyền thông Thanh Niên
Em xin chân thành cảm ơn Ban lãnh đạo tại Công ty TNHH Công nghệ sự kiện và Truyền thông Thanh Niên, đặc biệt là các anh chị trực tiếp hướng dẫn em trong thời gian hồn thành đề tài đã tận tình chỉ bảo giúp em hoàn thành tốt bài báo cáo này
Tiếp theo em xin chân thành cảm ơn các thầy cô trong ngành Tin học Kinh tế, khoa Hệ thống Thông tin Kinh tế, trường Đại học Kinh tế, Đại học Huế đã tận tình hướng dẫn để em làm tốt bài báo cáo này, đặc biệt là giảng viên hướng dẫn cô TS Lê Thị Quỳnh Liên đã tận tâm hướng dẫn em rất tâm huyết
Cuối cùng em xin gửi lời cảm ơn đến gia đình, ba mẹ, anh chị, bạn bè và thầy cô đã quan tâm, hỗ trợ và động viên em hết mình trong thời gian qua để em có thể hồn thành đề tài một cách tốt nhất
Do kiến thức và kinh nghiệm còn hạn chế cho nên bài báo cáo của em còn nhiều thiếu sót, kính mong được sự đánh giá, góp ý của quý thầy cô
Em xin chân thành cảm ơn!
Huế, tháng 4 năm 2020
Sinh viên
Huỳnh Thị Hạnh
Trang 4Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh II
MỤC LỤC
LỜI CẢM ƠN I MỤC LỤC II DANH MỤC HÌNH VẼ V DANH MỤC SƠ ĐỒ VII DANH MỤC BẢNG BIỂU VIII DANH MỤC THUẬT NGỮ VIẾT TẮT IX
PHẦN 1: MỞ ĐẦU 1
1 Lý do chọn đề tài 1
2 Mục tiêu nghiên cứu 2
3 Đối tượng và phạm vi nghiên cứu 2
4 Phương pháp nghiên cứu 3
5 Cấu trúc khóa luận 3
PHẦN 2: NỘI DUNG 5
CHƯƠNG I: CƠ SỞ LÝ THUYẾT XÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN, ĐẶC SẢN TRÊN THÀNH PHỐ HUẾ 5
1.1 Tổng quan về website 5
1.2 Tổng quan về ngôn ngữ và công cụ sử dụng để xây dựng website 5
1.2.1 Các ngôn ngữ sử dụng để xây dựng website 5
1.2.1.1 Giới thiệu HTML (HyperText Markup Language) 5
1.2.1.2 Giới thiệu CSS (Cascading Style Sheet language) 7
1.2.1.3 Giới thiệu thư viện Bootstrap 8
1.2.1.4 Giới thiệu JavaScript và thư viện Jquery của JavaScript 8
Trang 5Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh III
1.2.2 Các công cụ sử dụng xây dựng website 14
1.2.2.1 Phần mềm Sublime text 3 14
1.2.2.2 Phần mềm Xampp 15
CHƯƠNG II: GIỚI THIỆU ẨM THỰC HUẾ, TẦM QUAN TRỌNG, Ý NGHĨA THỰC TIỄN VÀ BÀI TOÁN XÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN, ĐẶC SẢN TRÊN THÀNH PHỐ HUẾ 17
2.1 Giới thiệu ẩm thực Huế và thực trạng ứng dụng các website vào giới thiệu các món ăn, đặc sản trên thành phố Huế 17
2.1.1 Giới thiệu ẩm thực Huế 17
2.1.2 Thực trạng ứng dụng website vào giới thiệu món ăn, đặc sản trên thành phố Huế 18
2.2 Tầm quan trọng của website giới thiệu các món ăn, đặc sản trên thành phố Huế 18 2.3 Ý nghĩa thực tiễn của website giới thiệu các món ăn, đặc sản trên thành phố Huế 18
2.4 Bài tốn xây dựng website giới thiệu các món ăn, đặc sản trên thành phố Huế 19
2.4.1 Quản lý hệ thống 19 2.4.2 Quản lý danh mục món 19 2.4.3 Quản lý món 19 2.4.4 Quản lý cách chế biến 20 2.4.5 Quản lý nhà hàng 20 2.4.6 Quản lý bình luận 20 2.4.7 Quản lý đánh giá 20 2.4.8 Quản lý thống kê 21
CHƯƠNG III: XÂY DỰNG WEBSITE GIỚI THIỆU MÓN ĂN, ĐẶC SẢN TRÊN THÀNH PHỐ HUẾ 22
Trang 6Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh IV
3.1 Phân tích hệ thống 22
3.1.1 Sơ đồ chức năng BFD (Business Function Diagram) 22
3.1.2 Sơ đồ ngữ cảnh (CD - Context Diagram) 23
3.1.3 Sơ đồ luồng dữ liệu (DFD - Data Flow Diagram) 24
3.1.3.1 Sơ lược về sơ đồ DFD 24
3.2.3.2 Sơ đồ luồng dữ liệu DFD phân rã mức 0 24
3.1.3.3 Sơ đồ luồng dữ liệu DFD phân rã mức 1 26
3.2 Thiết kế cơ sở dữ liệu (CSDL) 36
3.2.1 Các tập thực thể và thuộc tính tương ứng 36
3.2.2 Sơ đồ thực thể mối quan hệ (ERD – Entity Relationship Diagram) 37
3.2.3 Chuẩn hóa CSDL 41
3.2.4 Lược đồ quan hệ CSDL 45
3.3 Môi trường xây dựng website 46
3.4 Giao diện 46
3.4.1 Giao diện quản lý 46
3.4.2 Giao diện người dùng 55
PHẦN 3: KẾT LUẬN 63
1 Kết quả đạt được 63
1.1 Những điểm đạt được 63
1.2 Những điểm chưa đạt được 63
2 Hướng phát triển của đề tài 63
3 Kết luận 64
TÀI LIỆU THAM KHẢO 65
Trang 7Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh V
DANH MỤC HÌNH VẼ
Hình 1.1: Bố cục HTML của một website 6
Hình 1.2: Cấu trúc một đoạn CSS 7
Hình 1.3: Mơ hình MVC trong Laravel 13
Hình 1.4: Cách thức hoạt động mơ hình MVC của Laravel 13
Hình 1.5: Giao diện chính của Sublime text 3 14
Hình 1.6: Giao diện quản lý của Xampp 16
Hình 3.1: Lượt đồ quan hệ CSDL 46
Hình 3 2: Giao diện đăng ký tài khoản 47
Hình 3.3: Giao diện đăng nhập tài khoản 47
Hình 3.4: Giao diện Admin quản lý thống kê 48
Hình 3 5: Giao diện Admin quản lý người dùng 48
Hình 3.6: Giao diện Admin thêm người dùng 49
Hình 3.7: Giao diện Admin quản lý danh mục món ăn 50
Hình 3.8: Giao diện Admin thêm danh mục món 50
Hình 3.9: Giao diện Admin quản lý nhà hàng 51
Hình 3.10: Giao diện Admin thêm nhà hàng 52
Hình 3.11: Giao diện Admin quản lý món ăn 52
Hình 3.12: Giao diện Admin thêm món ăn 53
Hình 3.13: Giao diện Admin quản lý cách chế biến 54
Hình 3.14: Giao diện Admin thêm cách chế biến 54
Hình 3.15: Giao diện đăng nhập 55
Trang 8Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh VI
Hình 3.17: Giao diện chỉnh sửa thơng tin người dùng 56
Hình 3.18: Giao diện trang chủ 57
Hình 3.19: Giao diện món ăn 58
Hình 3.20: Giao diện nhà hàng 59
Hình 3.21: Giao diện thơng tin nhà hàng 60
Hình 3.22: Giao diện liên hệ 61
Hình 3.23: Giao diện cách chế biến 62
Trang 9Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh VII
DANH MỤC SƠ ĐỒ
Sơ đồ 3.1: Sơ đồ chức năng – BDF 22
Sơ đồ 3.2: Sơ đồ ngữ cảnh – CD 23
Sơ đồ 3.3: Sơ đồ phân rã mức 0 25
Sơ đồ 3.4: Sơ đồ phân rã mức 1 - QL hệ thống 26
Sơ đồ 3.5: Sơ đồ phân rã mức 1 - QL danh mục món 28
Sơ đồ 3.6: Sơ đồ phân rã mức 1 - QL món 30
Sơ đồ 3.7: Sơ đồ phân rã mức 1 - QL cách chế biến 31
Sơ đồ 3.8: Sơ đồ phân rã mức 1 - QL nhà hàng 33
Sơ đồ 3.9: Sơ đồ phân rã mức 1 - QL bình luận 34
Sơ đồ 3.10: Sơ đồ phân rã mức 1 - QL đánh giá 35
Sơ đồ 3.11: Sơ đồ phân rã mức 1 - QL thống kê 36
Sơ đồ 3.12: Sơ đồ thực thể - ERD 40
Trang 10Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh VIII
DANH MỤC BẢNG BIỂU
Bảng 3.1: Hệ thống kí hiệu sơ đồ thực thể 37
Bảng 3.2: Cấu trúc các bảng trong CSDL 41
Bảng 3.3: Cấu trúc bảng User (Người dùng) 41
Bảng 3.4: Cấu trúc bảng UserInfo (Thông tin người dùng) 42
Bảng 3.5: Cấu trúc bảng danh mục món 42 Bảng 3.6: Cấu trúc bảng món ăn 43 Bảng 3.7: Cấu trúc bảng cách chế biến 43 Bảng 3.8: Cấu trúc bảng nhà hàng 44 Bảng 3.9: Cấu trúc bảng món ăn nhà hàng 44 Bảng 3.10: Cấu trúc bảng bình luận 45 Bảng 3.11: Cấu trúc bảng đánh giá 45
Trang 11Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh IX
DANH MỤC THUẬT NGỮ VIẾT TẮT
STT Chữ viết tắt Ý nghĩa
1 AJAX Asynchronous JavaScript and XML
2
BFD Business Function Diagram
3 CD Context Diagram
4
CSDL Cơ sở dữ liệu
5 CSS Cascading Style Sheet language
6
DFD Data Flow Diagram
7
DOM Document Object Model
8 ERD Entity Relationship Diagram
9
HTML HyperText Markup Language
10 JS Javascript
11
JSON JavaScript Object Notation
12 MVC Model, View, Controller
13
PHP Personal Home Page
Trang 12Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 1
PHẦN 1: MỞ ĐẦU
1 Lý do chọn đề tài
Ẩm thực Việt Nam phong phú, đa dạng khi vừa giữ những nét truyền thống lâu
đời vừa kế thừa những tinh hoa của thế giới Cũng chính nhờ sự giao thoa văn hóa và sự
phát triển của xã hội hiện đại, mà ẩm thực Việt Nam mỗi ngày đều trở nên đặc sắc hơn Cùng với sự du nhập của các nền văn hóa đến từ phương Tây và các quốc gia như Nhật Bản, Hàn Quốc, Thái Lan… nền ẩm thực Việt Nam vẫn giữ được những tinh hoa vốn có nhưng thêm vào đó là sự sáng tạo, biến tấu thành những hương vị mới mẻ, hấp dẫn và chú trọng vào cách trình bày món ăn bắt mắt Do vậy nhu cầu ẩm thực là một trong những nhu cầu rất cần thiết và quan trọng không những đối với cá nhân mà còn đối với xã hội, kinh tế, du lịch
Ngày nay, khoa học công nghệ thông tin phát triển nhanh và thể hiện được sức quan trọng của nó đối với đời sống con người Ứng dụng công nghệ thông tin được xem là một trong những yếu tố quyết định hoạt động của các chính phủ, tổ chức, hay các cơng ty; nó đóng vai trị quan trọng, tạo ra bước đột phá mạnh mẽ Việc xây dựng các trang website để phục vụ cho các nhu cần riêng của các tổ chức, công ty không còn là xa lạ nữa
Điểm mạnh của các trang website hiện nay đó là tính nhanh chóng, tiện lợi Ở bất kỳ nơi nào có Internet thì có thể đăng nhập và truy cập vào trang website để xem thông tin tin tức cũng như là cập nhật những thơng tin của mình mong muốn một cách nhanh chóng nhất
Nắm bắt được xu hướng, lợi ích mà cơng nghệ thơng tin nói chung và website nói riêng mang lại cho con người và tâm lý của mọi người trong xã hội hiện đại ngày nay là nhu cầu ẩm thực cao, nhưng không phải ai cũng có thời gian để tìm hiểu nhiều cách chế biến nấu ăn ngon cho bản thân và gia đình Việc truy cập vào website là một bước rất đơn giản và khơng mất nhiều thời gian để có thể tìm kiếm cho mình một cơng thức nấu ăn phù hợp Ngồi ra, với cuộc sống tất bận hiện nay, thì nhu cầu ăn uống tại các nhà hàng cũng ngày một cao hơn, tuy vậy nhưng không phải ai cũng biết được những
Trang 13Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 2
nhà hàng nào có món ăn nào và ngon như thế nào Do vậy để tìm kiếm cho mình một địa điểm nhà hàng ngon và phù hợp thì đó khơng phải là một điều dễ dàng đối với một số người, nên việc truy cập vào website để tìm kiếm một địa điểm phù hợp nhưng vơ cùng nhanh chóng là rất cần thiết và bổ ích đối với nhiều người Khơng những mang lại sự tiện ích cho mọi người mà Website cịn giúp cho các nhà hàng có thể tiếp cận được khách hàng của mình nhanh chóng hơn, đem lại lợi ích kinh tế cao hơn
Xuất phát từ những lý do trên, đề tài: “XÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN ĐẶC SẢN NỔI TIẾNG TRÊN THÀNH PHỐ HUẾ BẰNG FRAMEWORK DỰA TRÊN NỀN TẢNG NGÔN NGỮ PHP” được chọn để thực hiện
2 Mục tiêu nghiên cứu
- Mục tiêu tổng quát của đề tài là xây dựng thành công một website hướng dẫn chế biến nấu ăn ngon, quảng cáo nhà hàng đặc sản trên trên thành phố Huế một cách an toàn, bảo mật và tiện lợi Cập nhật nhanh chóng nhưng món ăn ngon, nhà hàng nổi tiếng thu hút được nhiều người dùng đến với website để chia sẽ kinh nghiệm cũng như những cơng thức bổ ích Đối với các doanh nghiệp nhà hàng khách sạn tiếp cận, thu hút khách hàng một cách nhanh nhất, xây dựng và nâng cao được thương hiệu riêng, tạo được lợi thế so với đối thủ cạnh tranh và tiết kiệm chi phí hiệu quả
- Mục tiêu cụ thể:
+ Phân tích đánh giá đúng bài tốn xây dựng website;
+ Nghiên cứu các công cụ, framework được sử dụng để xây dựng website: Ngôn ngữ PHP, Laravel Framework, mơ hình MVC, công nghệ Bootstrap, JavaScript, HTML, CSS, hệ quản trị cơ sở dữ liệu MySQL
3 Đối tượng và phạm vi nghiên cứu
- Đối tượng nghiên cứu
+ Quy trình xây dựng một website cơ bản;
Trang 14Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 3
+ Các nền tảng, công cụ xây dựng website hiện nay - Phạm vi nghiên cứu
+ Về không gian: nhà hàng, quán ăn, các địa điểm ẩm thực trên thành phố Huế; + Về thời gian: từ 31/12/2019 đến 20/04/2020;
+ Về nội dung: xây dựng thành công website đúng như yêu cầu đặt ra
4 Phương pháp nghiên cứu
Phương pháp thu thập thông tin: Tiếp thu ý kiến của giáo viên hướng dẫn về các vấn đề liên quan đến đề tài, theo cáo phương pháp sau:
- Nghiên cứu tài liệu: Nghiên cứu các tài liệu, bài viết về xây dựng website qua sách, Internet… và các khóa luận của các năm trước để từ đó có thể thấy được những ưu, nhược điểm, tiếp thu những cái mới để đề ra hướng xây dựng website hoàn chỉnh, trực quan và dễ tương tác hơn
- Phỏng vấn: Tiếp cận phỏng vấn các chủ và nhân viên của cửa hàng, nhà hàng ẩm thực trên địa bàn thành phố Huế về nhu cầu quảng bá các món ăn của nhà hàng Phỏng vấn nhanh nhưng người có thói quen nấu ăn và yêu ẩm thực
Phương pháp phát triển hệ thống thống thông tin: Dựa trên những thông tin thu được để tiến hành phân tích, thiết kế website bao gồm những chức năng chính của website sẽ xây dựng thơng qua q trình mơ hình hóa, chuẩn hóa cơ sở dữ liệu một cách phù hợp
Phương pháp kiểm thử hệ thống: Phương pháp này dùng để theo dõi và đánh giá hành vi của sản phẩm hoặc hệ thống phần mềm hồn chỉnh và đã được tích hợp đầy đủ, dựa vào đặc tả và các yêu cầu chức năng đã được xác định trước
5 Cấu trúc khóa luận
Ngồi phần mở đầu, kết luận, phụ lục và các danh mục, khóa luận bao gồm 3 chương với kết cấu như sau:
Trang 15Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 4
Chương 1: CƠ SỞ LÝ THUYẾT XÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN, ĐẶC SẢN TRÊN THÀNH PHỐ HUẾ
Trình bày một số khái niệm, giới thiệu tổng quan về website và các vấn đề liên quan đến website Giới thiệu về ngôn ngữ PHP, Laravel Framework, HTML, CSS, BOOTSTRAP, mơ hình MVC, các cơng cụ phần mềm SUBLIME TEXT 3, XAMPP
Chương 2: GIỚI THIỆU ẨM THỰC HUẾ, TẦM QUAN TRỌNG, Ý NGHĨA THỰC TIỄN VÀ BÀI TỐN XÂY DỰNG WEBSITE GIỚI THIỆU CÁC MĨN ĂN, ĐẶC
SẢN TRÊN THÀNH PHỐ HUẾ
Nội dung chương này nêu đặc điểm ẩm thực Huế, thực trạng sử dụng website để giới thiệu món ăn đặc sản ở Huế và đồng thời nêu tầm quan trọng và ý nghĩa thực tiễn và bài toán xây dựng website giới thiệu món ăn, đặc sản tại thành phố Huế
Chương 3: XÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN ĐẶC, SẢN TRÊN THÀNH PHỐ HUẾ
Chương này phân tích hệ thống, thiết kế cơ sở dữ liệu cho website và xây dựng môi trừng và thiết kế giao diện cho website
Trang 16Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 5
PHẦN 2: NỘI DUNG
CHƯƠNG I: CƠ SỞ LÝ THUYẾT XÂY DỰNG WEBSITE GIỚI THIỆU CÁC MÓN ĂN, ĐẶC SẢN TRÊN THÀNH PHỐ HUẾ
1.1 Tổng quan về website
Website [1] là một tập hợp các trang web bao gồm văn bản, hình ảnh, video,… nằm trong một tên miền hoặc tên miền phụ trên World Wide Web của Internet Một trang web là tập tin HTML hoặc XHTML có thể truy nhập dùng giao thức HTTP Trang web được lưu trữ (web hosting) trên máy chủ web (server web) có thể truy cập thơng qua Internet Trang web có thể được xây dựng bằng nhiều ngơn ngữ lập trình khác nhau như PHP,.NET, Java, Ruby on Rails
Website cũng là một kênh thu thập các luồng thông tin phản hồi tốt nhất từ khách hàng đề từ đó họ có cơ sở điều chỉnh, thay đổi các sản phẩm, dịch vụ của mình sao cho phù hợp với thị hiếu Vì thế một website ấn tượng, bắt mắt, làm nổi bật được ý đồ của chủ doanh nghiệp hay người thiết kế giao diện website và thu hút được sự quan tâm của nhiều người sẽ trở thành một công cụ quảng bá hữu hiệu, tạo lợi thế cho các công ty, doanh nghiệp trong cuộc chạy đua với các đối thủ cạnh tranh
Ngày nay nhu cầu sử dụng website ngày càng được tăng cao, do sự phát triển mạnh mẽ của công nghệ, của thông tin, nên số lượng website tăng lên hằng ngày để đáp ứng nhu cầu của cộng đồng
1.2 Tổng quan về ngôn ngữ và công cụ sử dụng để xây dựng website
1.2.1 Các ngôn ngữ sử dụng để xây dựng website
1.2.1.1 Giới thiệu HTML (HyperText Markup Language)
Theo Wikipedia, HTML [2] là ngôn ngữ đánh dấu siêu văn bản, là ngôn ngữ đánh dấu tiêu chuẩn để tạo các trang web và ứng dụng, các mẫu thơng tin được trình bày trên World Wide Web
Trang 17Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 6
HTML được ví như là “bộ xương” của một trang web Nó giúp cho lập trình viên có thể xây dựng lên giao diện và cố định các thành phần bằng các thẻ nhất định, gán vai trò cho các thẻ để tạo thành website
Bố cục HTML của một website được mơ tả ở hình 1.1:
Hình 1.1: Bố cục HTML của một website
(Nguồn: Nghiên cứu của tác giả)
Trong đó:
- <!DOCTYPE html> là phần khai báo kiểu dữ liệu hiển thị là html để trình duyệt biết
- <html> và </html> là cặp thẻ nằm ngoài cùng và nó có nhiệm vụ là bao hết nội dung của trang web lại Thẻ này là bắt buộc
- <head> và </head> là phần khai báo thông tin của trang web
- <title> và </title> nằm bên trong thẻ <head> và đây chính là khai báo tiêu đề cho trang web
- <body> và </body>là thành phần quan trọng nhất, nó chứa nhưng đoạn mã HTML dùng để hiển thị trên website
- Các thẻ cịn lại nằm trong thẻ <body> chính là các thẻ định dạng dữ liệu HTML là cầu nối giao tiếp giữa người dùng và trình duyệt Bằng việc sử dụng nhiều thẻ khác nhau, mỗi thẻ có mỗi chức năng và nhiệm vụ nhất định Lập trình viên có thể tùy theo mục đích tư duy của mình mà có thể tạo nên một giao diện đẹp mắt và đúng ý.
Trang 18Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 7
1.2.1.2 Giới thiệu CSS (Cascading Style Sheet language)
CSS [3] là ngôn ngữ tạo phong cách cho trang web Nó dùng để tạo phong cách và định kiểu cho những yếu tố được viết dưới dạng ngôn ngữ đánh dấu, như là HTML Nó có thể điều khiển định dạng của nhiều trang web cùng lúc để tiết kiệm cơng sức cho người viết web Nó phân biệt cách hiển thị của trang web với nội dung chính của trang bằng cách điều khiển bố cục, màu sắc, và font chữ
CSS là một file có phần mở rơng là css, file này có tác dụng tách riêng phần định
dạng (style) ra khỏi nội dung HTML Cấu trúc một đoạn CSS:
Hình 1.2: Cấu trúc một đoạn CSS
(Nguồn: https://thachpham.com/)
Một đoạn CSS gồm có 4 phần:
- Nghĩa là nó sẽ được khai báo bằng vùng chọn;
- Sau đó các thuộc tính và giá trị sẽ nằm bên trong cặp dấu ngoặc nhọn {};
- Mỗi thuộc tính sẽ ln có một giá trị riêng, giá trị có thể là dạng số hoặc các tên giá trị trong danh sách có sẵn của CSS; và
- Phần giá trị và thuộc tính phải được cách nhau bằng dấu hai chấm, và mỗi một dòng khai báo thuộc tính sẽ ln có dấu chấm phẩy ở cuối Một vùng chọn có thể sử dụng khơng giới hạn thuộc tính
CSS khơng những vừa tạo cho website một giao diện như ý muốn mà còn giúp: - Mã nguồn HTML của web được gọn gàng, tối ưu; và
Trang 19Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 8
- Tách biệt được web với CSS để dễ dàng cập nhật nội dung mà không phải lo về định dạng bài viết
Nếu như HTML là bộ xương của một website thì CSS là bộ áo đẹp, giúp cho giao diện website trở nên sinh động và đẹp mắt hơn
1.2.1.3 Giới thiệu thư viện Bootstrap
Bootstrap [4] là nền tảng framework HTML, CSS hay JavaScript cho phép lập trình viên có thể thiết kế được website dựa trên responsive web mobile
Bootstrap [5] là bao gồm các HTML templates, CSS templates và Javascript tao ra những cái cơ bản có sẵn như: typography, forms, buttons, tables, navigation, modals, image carousels và nhiều thứ khác Trong bootstrap có thêm các plugin Javascript trong nó Giúp cho việc thiết kế reponsive của bạn dễ dàng hơn và nhanh chóng hơn
Ưu điểm của Bootstrap: - Rất dễ dàng sử dụng;
- Nhiều tính năng đáp ứng (Responsive features); - Tiếp cận Mobile-first; và
- Khả năng tương thích nhiều trình duyệt
Do có nhiều ưu điểm như vậy nên Bootstrap được các lập trình viên sử dụng rất nhiều và thường xuyên, giúp cho các lập trình viên thiết kế giao diện nhanh chóng và bắt mắt hơn
1.2.1.4 Giới thiệu JavaScript và thư viện Jquery của JavaScript
a Giới thiệu JavaScript
JavaScript [6] là ngôn ngữ lập trình phổ biến nhất trên thế giới trong suốt 20 năm qua JavaScript được tạo trong mười ngày bởi Brandan Eich, một nhân viên của Netscape, vào tháng 9 năm 1995 Được đặt tên đầu tiên là Mocha, tên của nó được đổi thành Mona rồi LiveScript trước khi thật sự trở thành JavaScript nổi tiếng như bây giờ Phiên bản đầu tiên của ngôn ngữ này bị giới hạn độc quyền bởi Netscape và chỉ có các
Trang 20Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 9
tính năng hạn chế, nhưng nó tiếp tục phát triển theo thời gian, nhờ một phần vào cộng đồng các lập trình viên đã liên tục làm việc với nó
Trong năm 1996, JavaScript được chính thức đặt tên là ECMAScript ECMAScript 2 phát hành năm 1998 và ECMAScript 3 tiếp tục ra mắt vào năm 1999 Liên tục phát triển thành JavaScript ngày nay, giờ đã hoạt động trên khắp mọi trình duyệt và trên khắp các thiết bị từ di động đến máy tính bàn
JavaScript liên tục phát triển kể từ đó, có lục đạt đến 92% website đang sử dụng JavaScript vào năm 2016 Chỉ trong 20 năm, nó từ một ngơn ngữ lập trình riêng trở thành cơng cụ quan trọng nhất trên bộ cơng cụ của các chun viên lập trình web Nếu bạn đang dùng internet, vậy chắc chắn bạn đã từng sử dụng JavaScript rồi
JavaScript có rất nhiều ưu điểm khiến nó vượt trội hơn so với các đối thủ, đặc biệt trong các trường hợp thực tế Sau đây chỉ là một số lợi ích của JavaScript:
- Bạn không cần một compiler vì web browser có thể biên dịch nó bằng HTML;
- Noa dễ học hơn các ngơn ngữ lập trình khác; - Lỗi dễ phát hiện hơn vì vậy dễ sữa hơn;
- Nó có thể được gắn trên mộ số element của trang web hoặc event của trang web như là thông qua click chuột hoặc di chuột tới;
- Js hoạt động trên nhiều trình duyệt, nền tảng;
- Bạn có thể sủ dụng JavaScript để kiểm tra input và giảm thiểu việc kiểm tra thủ công khi truy xuất qua database;
- Giúp website tương tác tốt hơn với khách truy cập; và - Nhanh hơn và nhẹ hơn các ngôn ngữ lập trình khác
b Thư viện Jquery của JavaScript
Jquery [7] là một thư viện JavaScript phổ biến trong cộng đồng lập trình Nó được tạo bởi John Resig vào năm 2006 với mục đích giúp lập trình viên dễ ứng dụng
Trang 21Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 10
JavaScript vào website hơn Nó khơng phải là một ngơn ngữ lập trình riêng biệt và hoạt động liên kết với JavaScript
Các tính năng chính jQuery cung cấp gồm: - Tương tác với HTML/DOM; - Tương tác với CSS;
- Bắt và xử lý sự kiện HTML;
- Các hiệu ứng và chuyển động trong HTML; - AJAX (Asynchronous JavaScript and XML); - JSON parsing; và
- Các tiện ích xây dựng sẵn
` Ưu điểm của jQuery thì vừa quan trọng vừa đáng giá: - jQuery xử lý code rất nhanh và có khả năng mở rộng;
- jQuery tạo điều kiện cho người dùng viết các mã chức năng bằng các dòng tối thiểu;
- jQuery cải thiện hiệu suất lập trình web;
- jQuery phát triển các ứng dụng có tương thích với trình duyệt; và
- Hầu hết các tính năng mới của trình duyệt mới đều được jQuery sử dụng Bạn sẽ có thể tạo ra những tác vụ phức tạp mà không tốn nhiều công sức Câu khẩu hiệu của jQuery “Code ít hơn, làm nhiều hơn” vơ cùng chính xác
1.2.1.5 Giới thiệu PHP, Laravel Framework và mơ hình MVC
a Giới thiệu PHP (Persional Home Page hay PHP Hypertext Preprocessor)
Giới thiệu chung
Theo Wikipedia [8], PHP là 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 từ phía máy chủ phổ biến nhất thế giới được thiết kế để phát triển Web, chạy trên server và trả về mã HTML
Trang 22Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 11
cho trình duyệt Xu hướng sử dụng PHP trong việc thiết kế Web đang ngày càng phát triển trong giai đoạn hiện nay và trong tương lai
PHP chạy trên môi trường Webserver và được lưu trữ thông tin qua hệ quản trị cơ sở dữ liệu PHP có thể chạy được trên nhiều nền tảng hệ điều hành khác nhau như Windows, MAC OS và Linux
PHP là ngơn ngữ lập trình sử dụng mã nguồn mở nên việc sử dụng ngôn ngữ này là hồn tồn miễn phí cho website
Đặc trưng của ngơn ngữ lập trình PHP
Một trong những đặc trưng hay còn được xem là lợi thế lớn nhất của PHP đó là tính cộng đồng PHP được phát triển và tối ưu bởi các nhà phát triển trên toàn thế giới vì vậy có thể nói ngơn ngữ PHP ngày càng hoàn thiện và thân thiện với mọi người hơn
PHP là ngơn ngữ lập trình web sử dụng mã nguồn mở, sử dụng hồn tồn miễn phí Điều đó mang lại sự linh hoạt và dễ dàng sử dụng cho các lập trình viên
PHP là ngơn ngữ lập trình web đơn giản, gọn nhẹ, hoạt động với tốc độ nhanh và hiệu quả, một server bình thường có thể đáp ứng hàng triệu truy cập trên một ngày Do đó nó là ngơn ngữ lập trình web dễ sử dụng đối với nhiều người mới bắt đầu học lập trình web Ngơn ngữ này có thể hỗ trợ kết nối hàng triệu hệ quản trị cơ sở dữ liệu khác nhau Nó có thể sử dụng được trên nhiều hệ điều hành khác nhau
Ngơn ngữ lập trình PHP cung cấp một lượng dữ liệu khá phong phú Vì từ ban đầu PHP được xây dựng để xây dựng và phát triển các ứng dụng web nên bản thân nó cung cấp rất nhiều hàm xây dựng sẵn giúp cho lập tình viên và người dùng có thể thực hiện việc gửi, nhận Mail, làm việc với Cookie một cách dễ dàng PHP là ngôn ngữ phổ biến nên phù hợp với hầu hết các doanh nghiệp vừa và nhỏ
Trang 23Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 12
b Laravel framework
Laravel [9] là một framework phát triển ứng dụng web với sự diễn cảm và cú pháp lịch lãm Chúng tôi tin rằng việc phát triển phải là một trải nghiệm thú vị và đầy sáng tạo để thực sự thỏa mãn Laravel cố gắng xóa đi những đau khổ ấy khỏi quá trình phát triển bằng cách giảm tối thiểu các tác vụ thường dùng trong các dự án web như xác thực, định tuyến, phiên làm việc và caching
Laravel nhằm giúp cho quá trình phát triển trở nên dễ chịu với developer mà khơng làm thiếu sót các chức năng của ứng dụng Những developer hạnh phúc sẽ tạo ra những dịng code tốt nhất Để có được điều này, chúng tôi đã cố gắng kết hợp rất nhiều điều tuyệt vời mà chúng tôi thấy được từ những web framework khác, bao gồm cả những framework của các ngôn ngữ khác như Ruby on Rails, ASP.NET MVC và Sinatra
Laravel dễ gần, nhưng mạnh mẽ, cung cấp những công cụ mạnh cần thiết cho những ứng dụng lớn, tráng kiện
c Mơ hình MVC
Mơ hình MVC [10] là viết tắt của 3 chữ Model, View, Controller Mô hình này tách một ứng dụng web ra làm 3 thành phần đảm nhiệm chức năng tách biệt, thuận tiện cho việc xử lý và bảo trì
Model: Chịu trách nhiệm quản lý dữ liệu, nó lưu trữ và truy xuất các thực thể từ cơ sở dữ liệu như mysql, sql server, postresSQ,… đồng thời chưa các logic được thực thi bởi ứng dụng
View: Chịu trách nhiệm hiển thị dữ liệu đã được truy xuất từ model theo một format nào đó theo ý đồ của lập trình viên Cách sử dụng của View tương tự như các module templates thường thấy trong các ứng dụng web phổ biến như WordPress, Joomla,…
Controller: trung gian, làm nhiệm vụ xử lý cho model và view tương tác với nhau Controller nhận request từ client, sau đó gọi các model để thực hiện các hoạt động được yêu cầu và gửi ra ngoài View View sẽ chịu trách nhiệm format lại data từ controller gửi ra và trình bày dữ liệu theo 1 định dạng đầu ra (html)
Trang 24Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 13
Trong laravel mơ hình MVC này có sơ đồ như sau:
Hình 1.3: Mơ hình MVC trong Laravel
(Nguồn:https://hoclom.com/hoc-laravel/) Laravel Framework hỗ trợ lập trình theo mơ hình MVC khá mạnh mẽ Ngồi các thành phần chính Model, View, Controller thì Routes được sử dụng định tuyến người dùng theo đúng Urls
Ở đây, mọi Request từ phía người dùng đều phải qua Route, dữ liệu được gửi
xuống Controller để xử lý, cần dữ liệu sẽ lấy từ Model lên hoặc cập nhật dữ liệu xuống Model, kết quả gửi ra View cho người sử dụng
Hình 1.4: Cách thức hoạt động mơ hình MVC của Laravel
(Nguồn:Nghiên cứu của tác giả)
Trang 25Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 14
Cách thức hoạt động của mơ hình MVC trong laravel: User tạo ra một yêu cầu với URL dựa trên ứng dụng Xác định “route” tương ứng với URL của user, chuyển tới controller tương ứng Controller xử lý nghiệp vụ, nếu cần thiết thì truy vấn dữ liệu
từ model và trả thông tin cho View View cung cấp thông tin trả về cho user.
1.2.2 Các công cụ sử dụng xây dựng website
1.2.2.1 Phần mềm Sublime text 3
Sublime Text 3 [11] là phiên bản mới nhất của chương trình soạn thảo văn bản đang được rất nhiều lập trình viên sử dụng bởi các tính năng cũng như hiệu năng mà nó mang lại Tuy ra đời sau Notepad++ nhưng Sublime Text được đánh giá cao và trở nên phổ biến hơn nhờ khả năng hoạt động mượt mà, chiếm ít tài nguyên máy, hỗ trợ đa ngơn ngữ lập trình và đặc biệt hỗ trợ Plugin với cộng đồng hỗ trợ mạnh mẽ Nó nhẹ, gọn, rất nhanh và nó cịn hỗ trợ rất nhiều như plugins, snippets, highlight beautiful, code auto complete, tùy biến giao diện, phím tắt, và rất nhiều thứ khác nữa Sublime Text là phần mềm cho phép dùng thử vô thời hạn, được tạo ra vào năm 2008 bởi Jon Skinner
Hình 1.5: Giao diện chính của Sublime text 3
(Nguồn: Nghiên cứu của tác giả)
Trang 26Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 15
Sublime có giao diện dễ dùng, các chức năng mạnh mẽ Có thể mở rộng thêm thơng qua Package Control Các ngôn ngữ như HTML, CSS, javascript, C++, C#, SQL, XML… đều được Sublime hỗ trợ nhận diện Ngoài ra, nó cịn hỗ trợ tơ màu cho các từ khóa
Sublime Text có rất nhiều các tính năng nổi bật So với các IDE, Sublime Text khác ở điểm rất nhẹ, linh hoạt, cài đặt dễ dàng, dễ sử dụng, cung cấp nhiều tính năng tiện lợi cho các lập trình viên Thời gian khởi động của Sublime Text rất nhanh, rơi vào khoảng 1-2 giây, khác với các IDE khác chúng ta thường phải chờ tầm 10 giây để mở lên
Sublime Text cho phép chúng ta tùy biến thông qua việc cài đặt các Plugin hoặc các Automation Task bằng việc tùy biến các đoạn snippet Sublime Text có giao diện người dùng trực quan, đơn giản, dễ sử dụng Nó cịn hỗ trợ nhiều chức năng mạnh mẽ có thể mở rộng thêm thơng qua Package Control Sublime Text hỗ trợ nhận diện, tơ màu từ khóa cho hơn 20 ngôn ngữ khác nhau như HTML, CSS, Javascript, PHP,…
1.2.2.2 Phần mềm Xampp
XAMPP [12] là chương trình tạo máy chủ Web (Web Server) được tích hợp sẵn Apache, PHP, MySQL, FTP Server, Mail Server và các công cụ như phpMyAdmin Web Server (máy phục vụ Web), máy tính mà trên đó cài đặt phần mềm phục vụ Web Đôi khi người ta cũng gọi chính phần mềm đó là Web Server Hiểu đơn giản, XAMPP là ứng dụng dùng để tạo và điều hành máy chủ nội bộ (localhost)
XAMPP chính là một phần mềm cho phép bạn giả lập môi trường server hosting Nhờ server hosting giả định này, bạn có thể chạy thử demo một website ngay trên chiếc máy vi tính của bạn khơng cần thiết phải mua hosting hay VPS
Đặc biệt, Xampp có giao diện quản lý khá tiện lợi, cho phép người dùng chủ động bật tắt hoặc khởi động lại các dịch vụ máy chủ bất kỳ lúc nào Phần mềm này cũng được thiết lập và phát triển dựa trên mã nguồn mở
Trang 27Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 16
Hình 1.6: Giao diện quản lý của Xampp
(Nguồn: Nghiên cứu của tác giả)
Apache là một chương trình máy chủ, dùng để giao tiếp với các giao thức HTTP Apache chạy tốt trên mọi hệ điều hành
Mysql là hệ quản trị cơ sở dữ liệu, được dùng để lưu trữ thông tin của một
website Mỗi website có thể sử dụng một hoặc nhiều cơ sở dữ liệu
PHP là ngơn ngữ kịch bản trên phía Server, dùng để xử lý các thao tác của người
dùng Và làm việc trực tiếp với cơ sở dữ liệu (Database)
Perl là một tầng cao hơn, một ngơn ngữ lập trình năng động hơn Sử dụng rộng rãi trong lập trình mạng và quản trị hệ thống Ít phổ biến cho mục đích phát triển web, Perl thích hợp với rất nhiều ứng dụng
Người dùng có thể khởi động lại Xampp mà không bị tắc nghẽn, phục vụ máy chủ bất kể lúc nào, vì vậy nó rất tiện ích Phần mềm này cũng được thiết lập và phát triển dựa trên mã nguồn mở
Trang 28Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 17
CHƯƠNG II: GIỚI THIỆU ẨM THỰC HUẾ, TẦM QUAN TRỌNG, Ý NGHĨA THỰC TIỄN VÀ BÀI TỐN XÂY DỰNG WEBSITE GIỚI
THIỆU CÁC MĨN ĂN, ĐẶC SẢN TRÊN THÀNH PHỐ HUẾ
2.1 Giới thiệu ẩm thực Huế và thực trạng ứng dụng các website vào giới thiệu các món ăn, đặc sản trên thành phố Huế
2.1.1 Giới thiệu ẩm thực Huế
Ẩm thực Huế là cách gọi của phương thức chế biến món ăn, nguyên lý chế biến, trang trí, phong cách dọn ăn, mời uống và những thói quen ăn uống nói chung của người Huế, Việt Nam Theo thời gian, ẩm thực Huế chịu ảnh hưởng của những luồng văn hoá đến từ những cộng đồng dân cư khác nhau và những đặt thù của xứ sở nên mang những sắc thái riêng trở thành một phần của văn hóa Huế cũng như văn hố Việt Nam với sự lan tỏa của mình
Nếu như một lần đến Huế, có lẽ du khách bốn phương sẽ phải suy nghĩ ăn gì sau một chuỗi hành trình dài đi tham quan tại Huế, khơng phải vì Huế có ít món ăn mà là vì ẩm thực Huế q phong phú, khắp các đường phố, ngõ, hẽm trong Huế đều có các quán ăn từ dân dã đến sang trọng Nhưng điểm đặc biệt ở đây chính là nét giản dị, và đậm đà trong hương vị của ẩm thực Huế
Huế là cái nôi của nền ẩm thực Việt, từ những món truyền thống cung đình cầu kì và tao nhã đến những món ăn dân dã và mộc mạc Ẩm thực Huế còn lưu giữ hơn 1000 món ăn mang đậm bản chất xứ Huế Từ món ăn dân dã nhất đến món ăn cầu kì phức tạp thì người làm ra các món ăn Huế cũng phải là người khéo léo, giỏi gian và thông minh, bởi người Huế ngoài ăn bằng vị giác, nếm được sự đậm đà của món ăn, cịn ăn bằng mắt bởi họ rất coi trọng cách trình bày tao nhã, đặc sắc của món ăn
Nhìn chung, các món ăn kiểu Huế khá cầu kì do chịu ảnh hưởng của văn hoá cung đình và kiểu cách của con người xứ Huế, chú trọng thưởng thức chứ không cốt để ăn cho no, bữa ăn hoặc bữa tiệc, cổ bàn được trình bày mỗi món một chút chút chứ khơng bày thịnh soạn, la liệt
Trang 29Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 18
2.1.2 Thực trạng ứng dụng website vào giới thiệu món ăn, đặc sản trên thành phố Huế
Ngày nay với sự phát triển mạnh mẽ và khơng ngừng của cơng nghệ thơng tin nói chung và website nói riêng và xu hướng của nhiều người là sử dụng website vào đời sống hằng ngày nhiều hơn Khơng những chỉ phục vụ cho việc giải trí, mà vai trò lớn của một trang web còn là cung cấp những thông tin cần thiết cho con người
Hiện nay, xu hướng tìm kiếm món ăn, cách chế biến món ăn bằng website được rất nhiều người lựa chọn bởi sự tiện nghi của các website mang lại Ở Việt Nam có khá nhiều website mang hình thức giới thiệu món ăn ngon như Foody.vn, Cookie.vn,… mang lại nhiều sự bổ ích cho người dùng Tuy vậy, nhưng tại Huế thì có rất ít website mang tính cộng đồng cung cấp, giới thiệu các món ăn ngon tại Huế cho nhiều người được biết
2.2 Tầm quan trọng của website giới thiệu các món ăn, đặc sản trên thành phố Huế
Website giới thiệu món ăn, đặc sản trên thành phố Huế này đóng vai trị như một cộng đồng tin cậy cho mọi người có thể tìm kiếm, chia sẻ, đánh giá và bình luận các món ăn, cách chế biến trên thành phố Huế Trang web này sẽ kết nối những người yêu ẩm thực Huế lại với nhau thông qua các bài chia sẻ cách chế biến, và những đánh giá, bình luận của họ Trang web còn cung cấp cách dễ nhất để người dùng có thể tìm kiếm và lựa chọn địa điểm ăn uống tốt nhất cho mình và bạn bè khi đến Huế
Tâm quan trọng của trang web này khơng những mang tính chất chia sẽ trong nước, mà cịn quảng ba nền văn hóa của Huế đến với bạn bè năm châu khi được mở rộng
2.3 Ý nghĩa thực tiễn của website giới thiệu các món ăn, đặc sản trên thành phố Huế
Website giới thiệu các món ăn, đặc sản của thành phố Huế này cung cấp nhưng thông tin vô cùng cần thiết đối với nhiều người Và đặc biệt hơn là nó đáp ứng các tính năng mà người dùng hiện nay đang rất chú ý, đó là:
Trang 30Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 19
- Tìm kiếm dễ dàng: Hệ thống tìm kiếm giúp người dùng cách chế biến món ăn phù hợp, món ăn, địa điểm ăn uống đặc sản nhanh nhất trên địa bàn tp Huế - Phân loại rõ ràng: Trang web cho phép phân loại rõ ràng các loại danh mục món ăn tại Huế, giúp người dùng có cái nhìn rõ dễ dàng hơn, dễ dàng tiếp cận hơn - Bình luận và đánh giá: Trang web cho phép thành viên vào bình luận, đánh giá cách chế biến món ăn bất kì, điều này sẽ giúp cho mọi người có cái nhìn tổng quan hơn về cách chế biến món ăn, món ăn và các đặc sản trên thành phố Huế
2.4 Bài tốn xây dựng website giới thiệu các món ăn, đặc sản trên thành phố Huế
2.4.1 Quản lý hệ thống
Hệ thống có nhiệm vụ quản lý thơng tin về các tài khoản sử dụng hệ thống của website Để đăng thơng tin món ăn, cách chế biến món ăn, tương tác trực tiếp với website thì mỗi người dùng sẽ được phép đăng kí một tài khoản cá nhân, tài khoản này bao gồm các thông tin như tên tài khoản, họ và tên, ngày sinh, email, số điện thoại, địa chỉ, mật khẩu Mỗi tài khoản sẽ được phân quyền theo chức năng người dùng Mật khẩu của mỗi tài khoản sẽ do chủ tài khoản quản lý và có thể đổi mặt khẩu Các tài khoản này sẽ phục vụ cho việc đăng nhập đăng xuất trong website
2.4.2 Quản lý danh mục món
Website sẽ thực hiện quản lý danh mục món, danh mục món này do admin cập nhật Các danh mục món có nhiệm vụ quản lý các món ăn tương ứng trong từng danh mục,để tìm kiếm được món ăn phù hợp với nhu cầu thì người phải thơng qua danh mục món để tìm kiếm một cách dễ dàng hơn, tiện lợi hơn Danh mục món gồm các thuộc tính như tên danh mục món, user id, ảnh danh mục
2.4.3 Quản lý món
Website cịn quản lý các món ăn tương ứng trong từng danh mục món Bất kì người dùng nào đã đăng ký tài khoản, đăng nhập vào hệ thống đều có thể tìm kiếm, cập nhật món ăn lên website Quản lý món giúp cho việc tìm kiếm cách chế biến của người
Trang 31Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 20
dùng trang web một cách nhanh chóng hơn Mỗi món ăn được cập nhật bao gồm các thuộc tính như tên món ăn, ảnh món, danh mục ID, user ID
2.4.4 Quản lý cách chế biến
Sau khi cập nhật món ăn hoặc tìm kiếm một món ăn nào đó từ website, nếu người dùng muốn cập nhật cách chế biến cho món ăn mới tìm kiếm hoặc món ăn mới cập nhật thì có thể cập nhật Sau khi hoàn tấc việc cập nhật cách chế biến thì bất kì người dùng nào khác đều có thể xem, tìm kiếm nhưng nội dung đã được cập nhật Quản lý cách chế biến bao gồm các thuộc tính như tiêu đề, tóm tắt, cách chế biến, món ăn ID, nguyên liệu, user Id
2.4.5 Quản lý nhà hàng
Website chỉ cho phép admin quản lý cập nhật nhà hàng Quản lý nhà hàng bao gồm quản lý tên nhà hàng, địa chỉ, kinh độ, vĩ độ, ảnh nhà hàng Các nhà hàng sau khi được admin cập nhật lên website thì bất kỳ người dùng nào cũng có thể thấy thông tin của các nhà hàng Việc quản lý này giúp cho mọi người có thể dễ dàng tìm kiếm một nhà hàng phù hợp nhất đối với nhu cầu của mình
2.4.6 Quản lý bình luận
Website cho phép người dùng cập nhật bình luận ngắn đối với cách chế biến món ăn nào đó đã được đăng tải lên website Dịng bình luận đó chỉ có thể được chỉnh sửa từ chính người cập nhật nó Admin có quyền xem, xóa các dịng bình luận từ người dùng đối với các cách chế biến món ăn trong website Việc cho phép tất cả người dùng bình luận trong website sẽ giúp cho website tương tác qua lại tốt hơn đối với website cũng như là tất cả người dùng Quản lý bình luận gồm nội dung bình luận, bình luận cha, cách chế biến ID
2.4.7 Quản lý đánh giá
Quản lý đánh cho phép người đánh giá cách chế biến của một món ăn bất kì nào đó trên website mà họ mong muốn Việc đánh giá này sẽ giúp cho người quản lý website cũng như là người đăng tải cách chế biến lên website sẽ nhận được những phản hồi từ người xem, giúp cho họ phát triển món ăn của họ tốt hơn
Trang 32Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 21
2.4.8 Quản lý thống kê
Website còn cho phép thơng kê theo bình luận, lượt xem và đánh giá theo yêu cầu của admin.
Trang 33Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 22
CHƯƠNG III: XÂY DỰNG WEBSITE GIỚI THIỆU MÓN ĂN, ĐẶC SẢN TRÊN THÀNH PHỐ HUẾ
3.1 Phân tích hệ thống
3.1.1 Sơ đồ chức năng BFD (Business Function Diagram)
Sơ đồ chức năng [13] là sơ đồ được sử dụng để thực hiện phân tích chức năng, mô tả sự phân chia các chức năng thành các chức năng nhỏ hơn trong hệ thống Mục đích của phân tích chức năng là xác định một cách chính xác và cụ thể các chức năng chính của hệ thống thông tin
Từ mô tả bài tốn và q trình thu thập thơng tin, khảo sát có thể xây dựng được sơ đồ BFD quản lý Website giới thiệu món ăn, đặc sản như hình sau:
Sơ đồ 3.1: Sơ đồ chức năng – BDF
(Nguồn: Nghiên cứu của tác giả)
Như sơ đồ trên, quản lý website sẽ bao gồm 8 chức năng chính là QL hệ thống, QL danh mục món, QL món, QL cách chế biến, QL nhà hàng, QL bình luận, QL đánh
Trang 34Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 23
giá và QL thống kê Theo đó chức năng quản lý hệ thống sẽ bao gồm các nghiệp vụ đăng nhập, đổi mật khẩu, đăng xuất và quản lý tài khoản Các chức năng QL danh mục món, món, cách chế biến, nhà hàng, bình luận và đánh giá đều có các nghiệp vụ chức năng thêm, sửa, xóa và tìm kiếm Ngồi các chức năng thêm, sửa, xóa và tìm kiếm thì chức năng QL bình luận cịn có chức năng nữa là trả lời bình luận cha Chức năng thống kê có nhiệm vụ thống kê số liệu về bình luận, lượt xem và đánh giá của người dùng
3.1.2 Sơ đồ ngữ cảnh (CD - Context Diagram)
Sơ đồ ngữ cảnh [14] là sơ đồ hình học được xây dựng theo điểm cơng tác nào đó dùng để làm rõ mối quan hệ thơng tin giữa các điểm công tác của hệ thống Điểm trung tâm là điểm đang xét, các điểm công tác khác có liên hệ thơng tin với điểm trung tâm sẽ được mô tả bằng mũi tên và ghi chú kèm theo
Từ sơ đồ chức năng ta xây dựng được sơ đồ CD như hình 2.2:
Sơ đồ 3.2: Sơ đồ ngữ cảnh – CD
(Nguồn: Nghiên cứu của tác giả)
Với sơ đồ ngữ cảnh đã cho, ta có được một cái nhìn tổng qt về luồng dữ liệu của các chức năng trong website ở mức cao nhất
Trang 35Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 24
3.1.3 Sơ đồ luồng dữ liệu (DFD - Data Flow Diagram)
3.1.3.1 Sơ lược về sơ đồ DFD
Sơ đồ dịng dữ liệu [15] là cơng cụ để trợ giúp cho bốn hoạt động chính sau đây của các phân tích viên hệ thống trong q trình phân tích thơng tin:
- Phân tích: xác định u cầu của người sử dụng
- Thiết kế: vạch kế hoạch và minh hoạ các phương án cho phân tích viên hệ thống và người dùng khi thiết kế hệ thống mới
- Biểu đạt: là công cụ đơn giản, dễ hiểu đối với phân tích viên hệ thống và người dùng
- Tài liệu: cho phép biểu diễn tài liệu phân tích hệ thống một cách đầy đủ, súc tích và ngắn gọn DFD cung cấp cho người sử dụng một cái nhìn tổng thể về hệ thống và cơ chế lưu truyền thông tin trong hệ thống
3.2.3.2 Sơ đồ luồng dữ liệu DFD phân rã mức 0
Sơ đồ phân rã mức 0 là sơ đồ phân rã từ sơ đồ ngữ cảnh Với mục đích mơ tả hệ thống chi tiết hơn, sơ đồ mức 0 được phân rã từ sơ đồ ngữ cảnh với các tiến trình được trình bày chính là các mục chức năng chính của hệ thống
Từ sơ đồ ngữ cảnh đã được xây dựng, tiến hành xây dựng sơ đồ phân rả mức 0 như sau:
Trang 36Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 25
Sơ đồ 3.3: Sơ đồ phân rã mức 0
(Nguồn: Nghiên cứu của tác giả)
Sơ đồ DFD mức 0 là tổng quan các chức năng chính của hệ thống Mô tả tất cả các luồng thông tin trong website bao gồm luồng thông tin vào, xử lý và luồng thơng tin ra
Trang 37Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 26
3.1.3.3 Sơ đồ luồng dữ liệu DFD phân rã mức 1
Dựa trên sơ đồ phân rã mức 0, ta đi sâu tìm hiểu và xây dựng sơ đồ phân rã mưc 0 của từng chức năng chính trong hệ thống website
a Sơ đồ phân rã mức 1 quản lý hệ thống
Quản lý hệ thống thực hiện các chức năng đăng nhập, đăng xuất, đổi mật khẩu và quản lý tài khoản Sơ đồ dưới đây thể hiện rõ hơn về luồng thông tin dữ liệu quản lý hệ thống của website
Sơ đồ 3.4: Sơ đồ phân rã mức 1 - QL hệ thống
(Nguồn: Nghiên cứu của tác giả)
Sơ đồ trên mô tả các chức năng quản lý hệ thống:
Trang 38Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 27
- Đăng nhập: Để vào sử dụng website, mỗi người phải thức hiện đăng nhập vào website bằng tài khoản đã đăng kí bao gồm tên tài khoản và mật khẩu Thực hiện việc đăng nhập bằng cách nhấn vào đăng nhập, màn hình đăng nhập sẽ xuất hiện, yêu cầu người dùng thực hiện điền thông tin tên tài khoản và mật khẩu vào Nếu chính xác hệ thống sẽ thông báo đăng nhập thành cơng, nếu sai thì thơng báo nhập sai mật khẩu, tên người dùng hoặc cả hai - Đổi mật khẩu: Nếu người dùng muốn đổi mật khẩu thì thực hiện yêu cầu đổi mật khẩu, yêu cầu này sẽ gửi đến admin để xác nhận, màn hình giao diện đổi mật khẩu xuất hiện, khi đó người dùng có nhiệm vụ nhập tài khoản cũ, nhập tài khoản mới và nhập lại tài khoản mới để thực hiện đổi mật khẩu Nếu nhập đúng thì hệ thống sẽ thông báo đổi mật khẩu thành công Nếu nhập sai hệ thống thông báo đổi mật khẩu thất bại, yêu cầu nhập lại
- Đăng xuất: Nếu muốn đăng xuất thì người dùng sẽ thực hiện nhấn vào đăng xuất bất cứ lúc nào Hệ thống sẽ cập nhật là người dùng đã đăng xuất - Quản lý tài khoản: Quản lý tên đăng nhập và mật khẩu của các tài khoản đã
thêm vào website Nếu người dùng muốn đổi mật khẩu, đăng nhập hay đăng xuất đều phải được hệ thống quản lý tài khoản xác nhận và thông báo
Trang 39Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 28
b Sơ đồ phân rã mức 1 quản lý danh mục món
Sơ đồ 3.5: Sơ đồ phân rã mức 1 - QL danh mục món
(Nguồn: Nghiên cứu của tác giả)
Sơ đồ trên mô tả 4 nghiệp vụ chức năng chính của quản lý danh mục món: - Thêm danh mục món: Nếu muốn thêm một danh mục món mới admin thực
Trang 40Khóa luận tốt nghiệp GVHD: TS Lê Thị Quỳnh Liên
SVTH: Huỳnh Thị Hạnh 29
là đã hoàn tất việc thêm Sau khi admin thêm danh mục món thì người dùng sẽ nhận được thơng tin danh mục món mới trên website
- Sửa danh mục món: Nếu muốn sửa một danh mục món admin vào quản lý danh mục món, thực hiện sửa danh mục món theo ý muốn, sau đó nhấn lưu thì hệ thống sẽ lưu danh mục món vào hệ thống Sau khi admin sửa danh mục món thì người dùng sẽ nhận được thơng tin danh mục món đã sửa trên website
- Xóa danh mục món: Nếu không muốn danh mục nào đó xuất hiện trên website thì admin có quyền xóa danh mục món đó bằng cách vài danh mục món, nhấn vào danh mục món đó và nhấn xóa Khi đó người dùng sẽ khơng thấy danh mục món đó trên website nữa
- Tìm kiếm danh mục món: Admin nếu muốn tìm kiếm một danh mục món nào đó thì thực hiện vào danh mục món, nhập thông tin danh mục món muốn tìm và nhấn tìm, nếu có thì danh mục món đó xuất hiện trên màn hình, cịn ngược lại nếu khơng thì hiện màn hình trống
Tất cả các nghiệp vụ chức năng của quản lý danh mục món đều do admin thực hiện, người dùng chỉ nhận kết quả sau khi đã được cập nhật lên website
c Sơ đồ phân rã mức 1 quản lý món
Quản lý món bao gồm thêm, sửa, xóa và tìm kiếm danh mục món, sơ đồ dưới đây mơ tả chi tiết luồng dữ liệu thực hiện để quản lý: