Thiết kế giao diện với Claude hoặc ChatGPT

Bạn nhờ trợ lý AI sửa code giao diện ngay trên máy tính của mình, bằng Claude Code trong ứng dụng Claude hoặc Codex trong ứng dụng ChatGPT. Bạn nói điều muốn đổi, trợ lý chạy lệnh và đẩy kết quả lên một bản nháp.

Khách chưa thấy gì cho tới khi bạn xem trước và tự xuất bản bản nháp trong Thư viện giao diện.

Kiểm tra cửa hàng có Hosting

1. Ở thanh bên, bấm Online Store.
2. Bấm vào tên giao diện đang sử dụng, trên ảnh ở đầu trang.
3. Bấm Sửa code để mở mục này.
4. Nếu mục này báo gói hiện tại không gồm hosting, bấm Nâng cấp gói.
5. Chọn gói có dòng Tải lên mã giao diện tùy chỉnh.

Nếu mục này báo Hosting chưa bật, hãy liên hệ EcomWeb để bật Hosting cho cửa hàng. Nếu không thấy thông báo nào, thường là cửa hàng đã sẵn sàng.

Chuẩn bị máy tính

1. Tải và cài ứng dụng Claude hoặc ChatGPT cho máy tính.
2. Cài Node.js bản 24 trở lên, pnpm và Git nếu máy chưa có. Trợ lý cũng có thể cài giúp bạn.
3. Mở Claude Code trong ứng dụng Claude, hoặc Codex trong ứng dụng ChatGPT.

Lấy mã cửa hàng và mã giao diện

Prompt cần hai mã. Bạn lấy chúng ở mục Sửa code của giao diện đang sử dụng, như ở phần trên.

1. Trong Dùng CLI, tìm dòng bắt đầu bằng ecomweb auth login –store-ref. Phần sau –store-ref là mã cửa hàng.
2. Tìm dòng bắt đầu bằng ecomweb storefront init –theme. Phần sau –theme là mã giao diện.

Cho trợ lý dựng bản nháp

1. Sao chép prompt bên dưới.
2. Dán vào Claude Code hoặc Codex.
3. Thay các phần trong ngoặc vuông bằng tên cửa hàng, hai mã vừa lấy và điều bạn muốn đổi.
4. Gửi prompt.

Duyệt đăng nhập CLI

Khi trợ lý chạy lệnh đăng nhập, trình duyệt mở trang Đăng nhập ecomweb CLI?.

1. So Mã trên trang với mã trong cửa sổ trợ lý.
2. Nếu hai mã khớp, bấm Cho phép.
3. Quay lại ứng dụng để trợ lý làm tiếp.

Nếu bạn không vừa nhờ trợ lý đăng nhập, bấm Từ chối.

Xem trước bản nháp

Lần đầu trợ lý triển khai, EcomWeb tạo trong Thư viện giao diện một giao diện mang tên giao diện đang sử dụng, kèm chữ (bản nháp). Những lần sau trợ lý đẩy vào đúng bản nháp đó. Khi build xong, trợ lý gửi bạn đường dẫn xem trước, có hiệu lực 24 giờ.

1. Mở đường dẫn xem trước trên máy tính và trên điện thoại.
2. Nói với trợ lý những gì cần sửa thêm, nếu có.

Để mở lại bản xem trước sau này:

1. Vào Online Store.
2. Ở dòng bản nháp trong Thư viện giao diện, bấm biểu tượng ba chấm.
3. Chọn Xem trước. Bản xem trước có thể mất một lúc để khởi động.

Xuất bản bản nháp

1. Vào Online Store.
2. Ở dòng bản nháp trong Thư viện giao diện, bấm Xuất bản.
3. Trong hộp Xuất bản giao diện này?, bấm Xuất bản.

Giao diện cũ chuyển vào Thư viện giao diện. Nếu bản mới có lỗi, xuất bản lại giao diện cũ, xem Chọn và đổi giao diện.

Câu hỏi thường gặp