Danh mục hình ảnhHình 2.1 Layout trang đăng nhập Hình 2.2 Layout trang đăng kí Hình 2.3 Lauout trang cá nhân Hình 2.4 Layout trang chủ Hình 2.5 Layout trang công thức món ăn Hình 2.6 Lau
TRÌNH BÀY TỔNG QUAN VỀ BÀI TOÁN LỰA CHỌN
Tổng quan
Trang web “Chia sẻ món ngon - Delicious” cung cấp công thức nấu ăn ngon, đơn giản và sáng tạo từ các đầu bếp chuyên nghiệp và những người yêu thích ẩm thực Người dùng có thể chia sẻ món ăn của mình, nhận phản hồi từ cộng đồng và tham gia các cuộc thi nấu ăn hấp dẫn Khám phá và thưởng thức những món ăn tuyệt vời trên trang web của chúng tôi!
1.1.1 Một số khái niệm cơ bản
Ngôn ngữ HTML (HyperText Markup Language) là ngôn ngữ chính của các trang web, giúp trình duyệt hiểu cấu trúc và kiểu của tài liệu trên internet HTML cho phép lưu trữ âm thanh, video, bảng tính và các ứng dụng khác, đồng thời tạo điều kiện cho việc điều hướng giữa các trang web thông qua siêu văn bản.
Cũng giống như bất kỳ ngôn ngữ máy tính nào khác, HTML có những điểm mạnh và hạn chế Dưới đây là những ưu và nhược điểm của HTML:
+ Thân thiện với người mới bắt đầu: HTML có một đánh dấu rõ ràng và nhất quán, cũng như một đường cong học tập nông và dễ hiểu.
+ Tính ủng hộ: Ngôn ngữ này được sử dụng rộng rãi, với rất nhiều tài nguyên và một cộng đồng lớn đằng sau nó.
+ Dễ dàng truy cập: HTML là mã nguồn mở và hoàn toàn miễn phí HTML chạy tự nhiên trong tất cả các trình duyệt web.
+ Linh hoạt: HTML có thể dễ dàng tích hợp với các ngôn ngữ phụ trợ như PHP và Node.js.
Ngôn ngữ Tĩnh chủ yếu được áp dụng cho các trang web tĩnh, trong khi để thực hiện các chức năng động, bạn có thể cần sử dụng JavaScript hoặc các ngôn ngữ phụ trợ như PHP.
+ Trang HTML riêng biệt: Người dùng phải tạo các trang web riêng lẻ cho HTML, ngay cả khi các phần tử giống nhau.
Tính tương thích của trình duyệt web là yếu tố quan trọng, vì một số trình duyệt có thể áp dụng các tính năng mới một cách chậm chạp Điều này dẫn đến việc các trình duyệt cũ hơn không hiển thị đúng các thẻ mới, ảnh hưởng đến trải nghiệm người dùng.
CSS (Cascading Style Sheets) là ngôn ngữ dùng để tìm và định dạng các phần tử do HTML tạo ra, giúp tạo phong cách cho trang web Nếu HTML định dạng các phần tử như đoạn văn, tiêu đề và bảng, thì CSS cho phép thêm style cho các phần tử HTML, bao gồm thay đổi bố cục, màu sắc trang, màu chữ, font chữ và cấu trúc.
1.1.2 Mục đích của website cần thiết kế
Để xây dựng một trang web hiệu quả, cần tập trung vào nhu cầu của người dùng và những gì mình có thể cung cấp Mục tiêu chính là chia sẻ công thức các món ngon một cách hợp lý và thiết thực.
Dựa trên kiến thức từ cô Trịnh Hiền Anh và tài liệu tham khảo, chúng em đã tổng hợp để xây dựng một trang web Báo cáo sẽ lập trình trang web “Website chia sẻ món ăn ngon” với giao diện tích hợp các chức năng cần thiết.
1.1.3 Mục tiêu quảng bá của website
Chúng tôi cung cấp một cái nhìn chi tiết về các công thức món ăn từ khắp nơi trên thế giới, giúp người dùng hiểu rõ về nguyên liệu và quy trình chế biến Bài viết không chỉ trang bị kiến thức nấu ăn mà còn chia sẻ những mẹo vặt và bí quyết quý giá Hơn nữa, người dùng có thể chia sẻ công thức và bí quyết nấu ăn của riêng mình, tạo nên một cộng đồng vững mạnh cho những người đam mê ẩm thực.
1.1.4 Một số trang web chính
Trang đăng nhập và đăng ký cho phép người dùng tạo tài khoản và truy cập vào trang web, từ đó họ có thể chia sẻ các công thức món ăn của mình và đánh giá các món ăn của người dùng khác.
Trang cá nhân cho phép người dùng cập nhật thông tin cá nhân, quản lý các công thức món ăn yêu thích và theo dõi các món ăn mà họ đã đăng tải.
- Trang chủ: hiển thị thanh điều hướng đến các trang khác và các công thức món ăn nổi bật.
Tất cả các công thức món ăn được tổng hợp và phân loại thành 6 loại chính: món ăn sáng, món tráng miệng, món chính, món chay, món mỳ và nước uống.
- Chi tiết công thức: hiển thị chi tiết nguyên liệu, cách làm cụ thể các món ăn.
- Đăng tải món ăn: là nơi người dùng đăng tải các công thức món ăn của bản thân.
- Blog: hiển thị các tin tức về món ăn trên toàn thế giới, các mẹo vặt hữu ích trong quá trính nấu ăn cũng như lựa chọn nguyên liệu
- Liên hệ: để người dùng có thể liên hệ tới nhà phát triển và cung cấp các góp ý hữu ích.
- Giới thiệu: hiển thị tổng quan các thông tin liên quan đến nhà phát triển.
KHẢO SÁT VÀ PHÂN TÍCH HỆ THỐNG
Khảo sát hiện trạng
Trong thời đại công nghệ thông tin hiện nay, việc ứng dụng internet vào cuộc sống là thiết yếu, đặc biệt trong lĩnh vực ẩm thực Nấu ăn không chỉ là nghệ thuật mà còn là đam mê của nhiều người Tuy nhiên, không phải ai cũng có thời gian tham gia các khóa học nấu ăn truyền thống Do đó, xây dựng một trang web dạy nấu ăn trực tuyến là giải pháp hiệu quả để đáp ứng nhu cầu học tập và chia sẻ kinh nghiệm ẩm thực của cộng đồng.
Yêu cầu về chức năng
Người dùng là những cá nhân có nhu cầu tìm hiểu và chia sẻ các công thức món ăn Do đó, trang web cần đáp ứng các chức năng cần thiết để hỗ trợ việc tìm kiếm và đăng tải công thức của người dùng.
+ Hiển thị danh sách các công thức món ăn để người dùng có thể xem và đánh giá
+ Có thanh tìm kiếm để người dùng có thể tìm kiếm các công thức món ăn theo tên, nguyên liệu.
+ Có chức năng đăng tải món ăn để người dùng đăng tải các công thức của bản thân.
- Người quản trị : Là người làm chủ ứng dụng có quyền kiểm soát mọi hoạt động của hệ thống và thực hiện các chức năng :
+ Chức năng quản lý, kiểm duyệt các bài đăng.
Trang web cần phải dễ hiểu, có giao diện thân thiện và hấp dẫn, giúp người dùng dễ dàng tìm kiếm thông tin Đồng thời, nó cũng nên cung cấp những quảng cáo chân thực và hấp dẫn, tạo ra một cộng đồng đam mê nấu ăn thực sự.
Phân tích thiết kế website
Hình 2.1 Layout trang đăng nhập
Hình 2.2 Layout trang đăng ký
Hình 2.3 Layout trang cá nhân
Hình 2.5 Layout trang công thức món ăn
Hình 2.6 Layout trang chi tiết công thức
Hình 2.7 Layout trang đăng tải món ăn
Hình 2.9 Layout trang liên hệ
Hình 2.10 Layout trang giới thiệu
THIẾT KẾ TRANG WEB
Đăng nhập
Hình 3.1 Giao diện trang đăng nhập
Đăng ký
Hình 3.2 Giao diện trang đăng ký
Trang cá nhân
Hình 3.3 Giao diện trang cá nhân
Trang chủ
Hình 3.4 Giao diện trang chủ
Công thức món ăn
Hình 3.5 Giao diện trang công thức món ăn
Chi tiết công thức
Hình 3.6 Giao diện trang chi tiết công thức
Đăng tải món ăn
Hình 3.7 Giao diện trang đăng tải món ăn
Blog
Hình 3.8 Giao diện trang blog
Liên hệ
Hình 3.9 Giao diện trang liên hệ
Giới thiệu
Hình 3.10 Giao diện trang giới thiệu