Hướng dẫn cách dùng Cursor AI deploy website lên Vercel

Sau khi hoàn thành một website bằng Cursor AI, bước tiếp theo thường là đưa dự án lên Internet. Với Vercel, quá trình này khá đơn giản. Nền tảng này hiện đã cung cấp plugin chính thức dành cho Cursor AI, giúp người dùng kiểm tra dự án, quản lý biến môi trường và deploy ngay trong quy trình Vibe Code. Cùng Tino tìm hiểu cách dùng Cursor AI deploy website lên Vercel qua bài viết dưới đây nhé!

Cursor AI deploy website lên Vercel như thế nào?

Cursor AI và Vercel đảm nhận hai vai trò khác nhau trong quy trình phát triển website. Trong đó:

• Cursor AI hỗ trợ viết code, kiểm tra cấu trúc dự án, tìm lỗi, chỉnh sửa tệp và chạy lệnh trong Terminal.
• Vercel nhận mã nguồn, cài đặt thư viện, chạy lệnh build, tạo bản triển khai và cung cấp đường dẫn truy cập.

Có thể hiểu đơn giản, Cursor AI là nơi bạn xây dựng và hoàn thiện dự án, còn Vercel là nền tảng đưa dự án lên môi trường trực tuyến.

Khi sử dụng Vercel Plugin, Cursor Agent có thêm các lệnh chuyên biệt như:

• /bootstrap
• /deploy
• /env
• /status
• /marketplace

Lệnh /deploy dùng để triển khai bản Preview. Khi muốn phát hành chính thức, bạn có thể dùng /deploy prod.

Lưu ý: Vercel Plugin yêu cầu Node.js 18 trở lên và cung cấp 28 kỹ năng, 3 Agent chuyên biệt cùng 5 lệnh nhanh phục vụ triển khai, tối ưu hiệu suất và phát triển ứng dụng AI.

Xem thêm: Deploy ứng dụng lên Vercel

Chuẩn bị trước khi deploy dự án từ Cursor AI lên Vercel

Cài đặt Cursor AI và tạo dự án

Trước tiên, cần tải Cursor AI từ trang chủ chính thức và cài đặt như một ứng dụng bình thường trên máy tính. Sau khi mở Cursor AI, người dùng có thể tạo một thư mục dự án mới, sau đó dùng khung chat tích hợp để yêu cầu Cursor AI khởi tạo ứng dụng, ví dụ một trang web bằng Next.js. Cursor AI sẽ tự động sinh các file cần thiết, cài thư viện và giải thích từng phần code theo yêu cầu.

Xem chi tiết hướng dẫn tại các bài viết:

• Hướng dẫn cách đăng ký Cursor AI free
• Hướng dẫn sử dụng Cursor AI từ A-Z

Tạo tài khoản Vercel và liên kết GitHub

Bước tiếp theo là truy cập trang Vercel và đăng ký tài khoản, cách nhanh nhất là dùng chính tài khoản GitHub để đăng nhập. Việc liên kết GitHub với Vercel ngay từ đầu giúp quá trình deploy về sau diễn ra tự động, không cần thao tác thủ công mỗi lần cập nhật ứng dụng.

Một số cách dùng Cursor AI deploy website lên Vercel

Cách 1: Deploy website lên Vercel bằng plugin chính thức

Đây hiện là cách nhanh và hiện đại nhất để dùng Cursor AI deploy lên Vercel.

Bước 1: Cài đặt plugin Vercel ngay trong Cursor

Vào File -> Open Folder -> mở dự án đang có trên máy tính của bạn. Sau đó, nhấn Ctrl + L để mở cửa sổ chat.

Trong cửa sổ chat của Cursor, chỉ cần gõ lệnh /add-plugin vercel để cài đặt tự động.

Xác nhận cài đặt:

Bước 2: Liên kết dự án bằng lệnh /bootstrap

Gõ lệnh /bootstrap -> nhấn Enter ngay trong Cursor để liên kết dự án hiện tại với tài khoản Vercel, thiết lập biến môi trường cần thiết và chạy các lệnh khởi tạo lần đầu.

Toàn bộ quá trình này diễn ra tự động dưới sự điều phối của trợ lý AI, người dùng chỉ cần xác nhận từng bước khi được hỏi.

Bước 3: Deploy chỉ với một lệnh /deploy

Khi ứng dụng đã sẵn sàng, chỉ cần gõ /deploy trong khung chat của Cursor.

Hệ thống sẽ tự động build ứng dụng, kiểm tra lỗi và tạo đường dẫn triển khai.

Để đưa thẳng lên môi trường chính thức, có thể yêu cầu Cursor AI deploy lên Vercel ở chế độ production ngay trong câu lệnh. Nhập:

/deploy prod

Bước 4: Theo dõi trạng thái và quản lý biến môi trường

Lệnh /status cho phép xem nhanh tình trạng deploy, log lỗi và các chỉ số hiệu năng ngay trong Cursor. Lệnh /env giúp thêm, sửa hoặc đồng bộ biến môi trường giữa máy cá nhân và Vercel mà không cần mở dashboard riêng.

Cách 2: Deploy website lên Vercel bằng Vercel CLI

Bước 1: Mở và kiểm tra dự án trong Cursor

Mở Cursor, sau đó chọn File → Open Folder và chọn thư mục dự án cần deploy.

(Tùy chọn) Trước khi chạy lệnh, hãy mở Cursor Agent và nhập prompt sau:

Hãy kiểm tra toàn bộ dự án trước khi deploy lên Vercel.

Xác định framework, lệnh cài đặt, lệnh build, thư mục đầu ra, các biến môi trường cần thiết và những lỗi có thể khiến quá trình build thất bại.

Chưa chỉnh sửa code cho đến khi hoàn thành báo cáo.

Sau khi Cursor trả kết quả, bạn có thể tiếp tục bằng prompt:

Hãy sửa các lỗi ảnh hưởng đến quá trình build lên Vercel.

Giữ nguyên giao diện và chức năng hiện tại.

Sau khi sửa, hãy chạy lại lệnh build và giải thích ngắn gọn từng thay đổi.

Yêu cầu trên giúp hạn chế tình trạng Agent chỉnh sửa quá nhiều phần không liên quan. Tuy nhiên, nếu đã chắc chắn đoạn code của mình không có lỗi, bạn có thể bỏ qua bước này.

Bước 2: Cài Vercel CLI

Với website HTML, CSS và JavaScript thuần (ví dụ trong bài viết), bạn có thể deploy trực tiếp bằng Vercel CLI. Trong Cursor, chọn Terminal → New Terminal.

Sau đó chạy:

npm install -g vercel

vercel login

vercel

Vercel sẽ yêu cầu bạn chọn phương thức đăng nhập, chẳng hạn email hoặc tài khoản liên kết.

Sau khi xác thực thành công, Terminal sẽ thông báo tài khoản đã được kết nối.

Bước 3: Tạo project

Dùng phím mũi tên xuống để chọn:

Create a new project

(Không chọn Search all projects trừ khi bạn đã tạo sẵn một Project tương ứng trên Vercel.)

Vercel có thể hỏi:

What’s your project’s name?

Nhập:

game-doan-so

Hoặc chỉ cần nhấn Enter để giữ tên được gợi ý. Tên Project cần viết thường, không dấu và dùng dấu gạch ngang.

Bước 4: Chọn thư mục chứa website

Khi Vercel hỏi:

In which directory is your code located?

Nếu mã nguồn nằm ngay trong thư mục đang mở, giữ nguyên:

./

Sau đó nhấn Enter.

Bước 5: Tùy chọn thay đổi thiết lập không

Khi Vercel hỏi

Customize settings?

Chọn:

N

Khi được hỏi tiếp:

Customize advanced settings?

Tiếp tục chọn:

N

Bước 6: Kiểm tra kết quả triển khai

Sau khi hoàn tất, Terminal sẽ trả về một hoặc nhiều đường dẫn dạng:

https://game-doan-so-....vercel.app

Hãy mở đường dẫn và kiểm tra:

• Giao diện có hiển thị đầy đủ hay không.
• CSS và JavaScript có được tải hay không.
• Các nút bấm có hoạt động hay không.
• Website có hiển thị tốt trên điện thoại hay không.
• Các trang con có truy cập được hay không.
  

Với Project mới, Terminal đôi khi có thể hiển thị:

Deployed to production (giống hình minh họa bên trên)

Nếu đã xuất hiện thông báo, website đã được đưa lên Production và chưa cần chạy lại vercel –prod ngay lập tức.

Nếu Terminal chỉ tạo bản Preview, sau khi kiểm tra thành công hãy chạy:

vercel --prod

Lưu ý, bạn sẽ thấy 2 đường dẫn:

• Production: Đây là địa chỉ riêng của lần triển khai hiện tại. Mỗi lần deploy mới, địa chỉ này có thể thay đổi.
• Aliased: Đây là địa chỉ chính, cố định của website. Khi deploy phiên bản mới, Vercel tự cập nhật nội dung tại địa chỉ này.

Kiểm tra trên Vercel:

Những lần chỉnh sửa tiếp theo

Sau khi chỉnh sửa website trong Cursor, chạy lại:

vercel --prod

Vercel sẽ tạo deployment mới và cập nhật địa chỉ Aliased sang phiên bản vừa triển khai.

Cách 3: Deploy qua GitHub và Vercel Dashboard, không cần dùng dòng lệnh

Đây là phương pháp đơn giản nhất, phù hợp cho người không quen thao tác dòng lệnh.

Bước 1: Đẩy mã nguồn từ Cursor AI lên GitHub

Ngay trong Cursor AI, có thể yêu cầu trợ lý AI khởi tạo git repository, commit code và đẩy lên GitHub bằng ngôn ngữ tự nhiên, ví dụ yêu cầu “tạo repository mới và đẩy toàn bộ code lên GitHub”. Cursor AI sẽ tự thực hiện các lệnh git cần thiết.

Xem hướng dẫn chi tiết tại bài viết: Hướng dẫn đẩy code lên GitHub bằng Cursor AI

Bước 2: Import dự án vào Vercel Dashboard

Trước tiên, bạn cần đăng nhập vào Vercel.com.

Trong giao diện Vercel, chọn New Project.

Sau đó chọn Import Git Repository -> Connect with GitHub.

Xác thực ứng dụng:

Các dự án trên GitHub sẽ hiển thị. Bạn chỉ cần trỏ đến repository vừa tạo bằng cách Import.

Vercel sẽ tự động phát hiện framework đang dùng và thiết lập sẵn các lệnh cài đặt, build phù hợp, người dùng chỉ cần nhấn Deploy.

Bước 3: Tự động deploy mỗi khi cập nhật code

Sau lần liên kết đầu tiên, mọi lần đẩy code mới lên GitHub đều kích hoạt một lần deploy mới trên Vercel một cách tự động, kèm theo đường dẫn xem trước riêng cho từng nhánh, giúp việc thử nghiệm tính năng mới trở nên an toàn trước khi đưa vào production.

So sánh các cách dùng Cursor AI deploy website lên Vercel

Nên chọn phương pháp nào?

• Muốn Cursor Agent hỗ trợ từ đầu đến cuối: Chọn Vercel Plugin, nhưng cần lưu ý mức sử dụng credit.
• Muốn tiết kiệm credit và deploy nhanh từ máy: Chọn Vercel CLI.
• Muốn website tự động cập nhật sau mỗi lần đẩy code: Chọn GitHub kết hợp Vercel Dashboard.

Với người mới đang deploy một website HTML đơn giản, Vercel CLI thường dễ theo dõi và kiểm tra từng bước. Khi dự án đã hoạt động ổn định, có thể kết nối thêm GitHub để tự động hóa các lần cập nhật sau.

Các bài viết liên quan:

• So sánh Cursor AI vs Antigravity
• So sánh Cursor AI vs GitHub Copilot
• So sánh Codex vs Cursor AI: Hai AI Agent Coding đáng chú ý
• So sánh Windsurf (Devin AI) vs Cursor AI: Lựa chọn nào tối ưu cho coding?
• So sánh Claude Code vs Cursor AI: Đánh giá khả năng Vibe Code ai hơn?
• Hướng dẫn thêm API Key riêng vào Cursor AI A-Z
• Hướng dẫn tích hợp Cursor AI vào VSCode đơn giản

Kết luận

Dùng Cursor AI deploy website lên Vercel giúp rút ngắn đáng kể quá trình đưa dự án từ máy tính lên Internet. Người dùng có thể chọn Vercel Plugin để thao tác ngay trong Cursor Agent, dùng Vercel CLI để kiểm soát từng bước hoặc kết nối GitHub để tự động triển khai sau mỗi lần cập nhật mã nguồn.

Những câu hỏi thường gặp