Dùng để: Dựng một ứng dụng web tra công thức nấu ăn, lọc theo nguyên liệu đang có và xếp thành thực đơn cho cả tuần.
Nội dung prompt
VAI TRÒ Bạn là lập trình viên frontend dựng ứng dụng ẩm thực cho người dùng phổ thông. NHIỆM VỤ Viết một ứng dụng web tìm công thức nấu ăn bằng HTML, CSS và JavaScript, dữ liệu lấy từ một API công khai hoặc từ tệp JSON mẫu. ĐẦU VÀO - Nguồn dữ liệu công thức: [URL API HOẶC TỆP JSON] - Nguyên liệu người dùng hay có: [DANH SÁCH NGUYÊN LIỆU] - Chế độ ăn cần hỗ trợ: [CHAY, ÍT ĐƯỜNG, KHÔNG GLUTEN] - Số bữa mỗi tuần: [SỐ BỮA] - Bộ màu giao diện: [MÃ MÀU] QUY TẮC 1. Trang chủ hiển thị lưới món ăn kèm ảnh, tên món và thời gian nấu. 2. Bộ lọc gồm nguyên liệu, phong cách ẩm thực, chế độ ăn và thời gian chuẩn bị. 3. Mỗi món có thể lưu vào danh sách yêu thích và xếp vào thực đơn theo ngày. 4. Khi mở một món, hiện khẩu phần, nguyên liệu và các bước nấu theo thứ tự. 5. Cho phép đổi khẩu phần và tự tính lại lượng nguyên liệu tương ứng. 6. Lưu dữ liệu vào bộ nhớ trình duyệt để không mất khi tải lại trang. 7. Giao diện chạy tốt trên điện thoại và máy tính. KHUÔN ĐẦU RA 1. Toàn bộ mã trong các tệp tách rời. 2. Cấu trúc tệp và cách chạy thử. 3. Vài ghi chú về chỗ thay dữ liệu mẫu bằng dữ liệu thật.
Thay nội dung trong dấu [ ] trước khi sử dụng.
Mẹo tinh chỉnh
Nếu dữ liệu công thức nằm ở API bên ngoài, hãy giới hạn số lần gọi bằng cách lưu tạm kết quả trong bộ nhớ trình duyệt. Muốn dùng thật trong gia đình, thêm phần ghi chú món không hợp khẩu vị để lần sau dễ lọc. Đặt tên trường dữ liệu thống nhất ngay từ đầu để khỏi phải sửa nhiều khi đổi nguồn. Kiểm tra kỹ phần hiển thị trên màn hình nhỏ vì danh sách món có thể rất dài.
Prompt khác cùng nhóm
Dựng ứng dụng web tạo avatar cá nhân hóaNêu các phong cách và trường mô tả, nhận về mã ứng dụng web tạo avatar với lưới kết quả và lịch sử lưu trên máy.Xem promptTư vấn di chuyển hệ thống lên AWSMô tả hệ thống hiện tại, nhận về phương án di chuyển lên AWS, điểm cần cân nhắc và thứ tự thực hiện.Xem promptĐóng vai chuyên gia lập trình Swift và iOSNêu đoạn mã và mục tiêu, nhận về hướng dẫn Swift hiện đại, SwiftUI và xử lý bất đồng bộ theo chuẩn của Apple.Xem promptDựng trang HTML hiện lời nhắn khi nhấp chuộtĐiền lời nhắn và tông màu, nhận về một tệp HTML nhẹ, nhấp vào màn hình là hiện thông điệp.Xem promptThiết kế hệ thống nhiều tác nhân AINêu bài toán và các vai trò, nhận về sơ đồ hệ thống nhiều tác nhân, cách nhớ ngữ cảnh và hàng rào an toàn.Xem promptViết Bash script tự động hóa chuẩn chuyên nghiệpMô tả công việc cần tự động, nhận về Bash script có xử lý lỗi, tô màu đầu ra và cờ trợ giúp đầy đủ.Xem promptDựng ứng dụng web nhật ký và phản hồi bản thânMô tả lĩnh vực và giọng phản hồi, nhận về đặc tả ứng dụng web ghi nhật ký ngày và nhận lại lời nhận xét cá nhân.Xem promptThiết kế hệ thống điều hướng cho ứng dụng di độngMô tả ứng dụng và số màn hình, nhận về phương án điều hướng dễ hiểu kèm lý do và các điểm cần kiểm thử.Xem promptĐóng vai kiến trúc sư kỹ thuật di động Native và CloudNêu bài toán ứng dụng di động, nhận về phương án kiến trúc Native kết hợp Cloud chạy tốt cả khi mất mạng.Xem prompt