Dùng để: Dựng giao diện cho hệ thống quản trị tự phục vụ nội bộ, chạy mượt trên nhiều màn hình và nối được API.
Nội dung prompt
VAI TRÒ Bạn là lập trình viên frontend chuyên dựng giao diện quản trị nội bộ cho doanh nghiệp. NHIỆM VỤ Từ mô tả trong phần ĐẦU VÀO, dựng giao diện cho hệ thống quản trị tự phục vụ nội bộ bằng HTML, CSS và JavaScript. ĐẦU VÀO - Tên hệ thống: [TÊN HỆ THỐNG] - Khung giao diện: [VÍ DỤ: BOOTSTRAP, TAILWIND, THUẦN CSS] - Màu thương hiệu: [MÃ MÀU CHÍNH] - Các màn hình cần có: [VÍ DỤ: ĐĂNG NHẬP, BẢNG ĐIỀU KHIỂN, DANH SÁCH YÊU CẦU] - Dữ liệu hiển thị: [CÁC TRƯỜNG CẦN HIỆN] - Điểm cuối API: [ĐƯỜNG DẪN API] QUY TẮC 1. Bố cục rõ ràng, có thanh điều hướng, vùng nội dung và chỗ hiển thị trạng thái. 2. Giao diện hiển thị tốt trên máy tính, máy tính bảng và điện thoại. 3. Thêm thành phần tương tác: lọc, tìm kiếm, phân trang và thông báo khi tải. 4. Nối dữ liệu từ điểm cuối API, có trạng thái đang tải và báo lỗi. 5. Mã sạch, tách phần giao diện và phần xử lý, có chú thích bằng tiếng Việt. 6. Không dùng thư viện nặng nếu khung giao diện đã đủ dùng. KHUÔN ĐẦU RA 1. Cấu trúc tệp. 2. Mã HTML, CSS và JavaScript hoàn chỉnh. 3. Ghi chú cách nối API và cách thay màu thương hiệu.
Thay nội dung trong dấu [ ] trước khi sử dụng.
Mẹo tinh chỉnh
Giao diện quản trị nội bộ thành công khi thao tác nhanh và ít bước, nên hãy mô tả công việc thật của người dùng thay vì chỉ liệt kê trang. Nếu hệ thống có phân quyền, thêm phần mô tả vai trò để mô hình ẩn hoặc hiện đúng nút. Bạn có thể yêu cầu tách riêng một tệp cấu hình cho màu và chữ để đổi nhận diện dễ hơn. Khi nối API thật, nhớ bổ sung xử lý khi mất mạng. Cuối cùng, kiểm tra lại các trạng thái trống, đang tải và báo lỗi trước khi bàn giao.
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