Hướng Dẫn ClaudeKit CLI

Cài đặt ClaudeKit, chạy lệnh claude, và sử dụng các skill AI mạnh mẽ từ terminal của bạn!

ClaudeKit CLI là gì?

ClaudeKit CLI giúp bạn thiết lập ClaudeKit trong các dự án, sau đó bạn sử dụng Claude Code để nhận trợ giúp AI. Cài đặt ClaudeKit, chạy claude, và tận hưởng các skill mạnh mẽ như UI/UX Pro Max — tất cả từ terminal của bạn!

Quy trình làm việc nhanh

$ ck init # Thiết lập ClaudeKit trong dự án của bạn

$ claude # Bắt đầu Claude Code CLI

→ Sau đó chat với AI để xây dựng UI đẹp mắt ngay lập tức! 🎨

Lưu ý: ClaudeKit CLI là công cụ miễn phí giúp cài đặt các kit. Engineer Kit và Marketing Kit là sản phẩm trả phí cần mua riêng. Mua ClaudeKit (Giảm 20%)

Giao diện trong Terminal của bạn

Đây chính xác là những gì bạn sẽ thấy khi sử dụng ClaudeKit CLI

Terminal — bash — 80×24

➜ ~/projects claude

Đang khởi động Claude Code CLI...

Nhập tin nhắn của bạn (hoặc /help để xem lệnh)

You: Using ui-ux-pro-max skill, tạo một landing page cho studio yoga

ClaudeKit AI đang suy nghĩ...

✓ Đang tìm kiếm domain sản phẩm: làm đẹp/sức khỏe

✓ Style guide: tối giản + thanh lịch

✓ Typography: Playfair Display + Inter

✓ Bảng màu: pastel nhẹ nhàng (#E8E5F2)

✓ Thiết Kế Hoàn Tất!

Đã tạo: yoga-studio-landing.html

- Bảng màu hoa oải hương êm dịu

- Typography Playfair Display thanh lịch

- Thiết kế ưu tiên mobile responsive

- Tuân thủ WCAG AA

Các file được tạo trong thư mục hiện tại

➜ ~/projects ls -la

drwxr-xr-x 5 user staff 160 Dec 3 15:20 .

drwxr-xr-x 12 user staff 384 Dec 3 15:15 ..

-rw-r--r-- 1 user staff 8420 Dec 3 15:20 yoga-studio-landing.html

➜ ~/projects open yoga-studio-landing.html

Đang mở trong trình duyệt mặc định...

→ Bạn đang ở trong Claude Code CLI. Cứ tiếp tục chat!

You:

Using ui-ux-pro-max skill, làm cho các nút nổi bật hơn với hiệu ứng hover

AI:

Tôi sẽ cải thiện kiểu dáng nút với:

• Hiệu ứng chuyển đổi mượt mà (200ms)

• Hiệu ứng phóng to (hover:scale-105)

• Đổ bóng khi hover

• Chỉ báo con trỏ rõ ràng

✓ Đã cập nhật yoga-studio-landing.html

➜ ~/projects ▊

Thiết Lập Dự Án

ck init

Khởi tạo ClaudeKit trong dự án của bạn (thiết lập một lần)

Bắt Đầu Claude Code

claude

Mở trợ lý AI tương tác - chat và lặp lại

Sử Dụng Skill

Using ui-ux-pro-max skill...

Bên trong Claude, kích hoạt trí tuệ thiết kế mạnh mẽ

Hướng Dẫn Bắt Đầu Nhanh

Khởi động ClaudeKit CLI trong 3 bước đơn giản

Cài Đặt ClaudeKit CLI

Cài đặt công cụ ClaudeKit CLI toàn cục:

npm install -g claudekit-cli

# hoặc với bun

bun add -g claudekit-cli

# Kiểm tra cài đặt

ck --version

Khởi Tạo ClaudeKit trong Dự Án của Bạn

Điều hướng đến dự án của bạn và thiết lập ClaudeKit:

cd ~/projects/my-project

ck init

# Chế độ tương tác - làm theo hướng dẫn

# Tạo thư mục .claude/ chứa các file ClaudeKit

💡 Chọn Cách Thiết Lập:

Khi chạy ck init, bạn sẽ thấy hai tùy chọn:

Global (Khuyên dùng): Cài đặt cho tài khoản người dùng của bạn. Hoạt động mọi nơi.
Local: Chỉ cài đặt cho thư mục dự án cụ thể này.

Chọn "Global" thường là dễ nhất!

⚙️ Yêu Cầu Xác Thực:

ClaudeKit yêu cầu xác thực GitHub CLI để tải xuống bộ kit ClaudeKit Engineer.

gh auth login # Xác thực trước khi ck init

📝 Lưu ý: Personal Access Tokens (PAT) không còn được hỗ trợ

Bắt Đầu Claude Code & Tạo Dự Án!

Khởi động Claude Code CLI và trò chuyện với AI:

claude

# Khởi động Claude Code CLI tương tác

Đang khởi động Claude Code CLI...

You: Using ui-ux-pro-max skill, tạo một landing page cho quán cà phê của tôi

Vậy đó! AI sẽ tìm kiếm cơ sở dữ liệu thiết kế và tạo code đẹp mắt cho bạn.

Thói Quen Hàng Ngày

💡 Mẹo chuyên nghiệp: Chạy các lệnh này trước khi bắt đầu công việc để đảm bảo bạn luôn có các khả năng thông minh mới nhất.

1 Cập Nhật Công Cụ CLI

$ ck update

Đảm bảo claudekit-cli của bạn có các tính năng và bản sửa lỗi mới nhất.

2 Cập Nhật Engineer Kit

$ ck init --kit engineer

Hoặc qua cờ global:

$ ck init -g --kit engineer

Cập nhật bộ kit engineer để lấy các prompt và khả năng AI mới nhất.

CÔNG CỤ MẠNH MẼ

CCS - Claude Code Switch

Cần chuyển đổi giữa tài khoản công việc/cá nhân hoặc sử dụng các mô hình rẻ hơn như Gemini/GLM? CCS là một công cụ wrapper mạnh mẽ cho Claude Code giúp bạn tiết kiệm tiền và hợp lý hóa quy trình làm việc.

Tiết kiệm ~80% chi phí Đa tài khoản Ủy quyền nhanh

Xem Hướng Dẫn CCS

Mẹo Chuyên Nghiệp cho Người Dùng CLI Nâng Cao

Sử Dụng Dấu Ngoặc Kép cho Yêu Cầu Nhiều Từ

Luôn bọc yêu cầu của bạn trong dấu ngoặc kép: "yêu cầu của bạn ở đây"

Chế Độ Tương Tác = Tốt Hơn cho Việc Lặp Lại

Sử dụng ccs không có đối số để tinh chỉnh qua lại

Tham Chiếu File với @

Sử dụng @tên_file để cho AI biết những file nào cần sửa đổi

Luôn Sử Dụng "Using ui-ux-pro-max skill"

Điều này kích hoạt hệ thống thiết kế thông minh để có kết quả chuyên nghiệp