Facebook Pixel

Cursor AI là gì? Hướng dẫn Sử dụng Cursor AI cơ bản

16 Sep, 2024

Cursor AI là một trình chỉnh sửa code tích hợp AI, được tạo ra để đơn giản hóa quá trình phát triển phần mềm

Cursor AI là gì?  Hướng dẫn Sử dụng Cursor AI cơ bản

Mục Lục

Với khả năng dự đoán và đề xuất code trên nhiều dòng cùng lúc, Cursor AI có thể giúp bạn tiết kiệm đến 30% thời gian viết code so với các công cụ thông thường như GitHub Copilot.  

Cursor AI sở hữu một IDE riêng, không giống như các công cụ khác phải tích hợp vào IDE hiện có. Điều này giúp tối ưu hóa trải nghiệm lập trình, với các tính năng mạnh mẽ như tự động hoàn thiện code nhiều dòng, tối ưu hóa code hiện tại, và khả năng xử lý ngữ cảnh thông minh. Vậy Cursor AI là gì và tại sao nó lại nổi bật so với các công cụ lập trình khác? Hãy cùng mình khám phá trong bài viết này nhé.

1. Cursor AI là gì ?

Cursor AI là một trình chỉnh sửa (editor) code tích hợp AI, được tạo ra để đơn giản hóa quá trình phát triển phần mềm. Xây dựng trên nền tảng Visual Studio Code (VSCode), Cursor giữ nguyên giao diện thân thuộc và hỗ trợ các tiện ích mở rộng, themes, phím tắt quen thuộc của VSCode, giúp người dùng dễ dàng làm quen.

Cursor AI tích hợp các công nghệ AI hiện đại như ChatGPT và Claude từ OpenAI, cho phép nó cung cấp các gợi ý code thông minh, tự động phát hiện lỗi, và tối ưu code một cách linh hoạt.

2. Những tính năng nổi bật của Cursor AI

2.1 Tab

Tính năng Tab trong Cursor AI giúp người dùng dự đoán những gì có khả năng xuất hiện tiếp theo trong đoạn code, điểm đặc biệt là nó có thể đề xuất chỉnh sửa trên nhiều dòng cùng 1 lúc, trong khi Copilot chỉ đề xuất chỉnh sửa trên 1 dòng.

Giả sử bạn đang viết một hàm trong Python để xử lý dữ liệu:

Python
def process_data(data):
    filtered_data = [item for item in data if item['value'] > 10]
    sorted_data = sorted(filtered_data, key=lambda x: x['date'])
    return sorted_data

Khi bạn nhấn Tab trên Cursor AI, nó sẽ dự đoán không chỉ dòng tiếp theo mà còn có thể đề xuất toàn bộ khối code để lọc và sắp xếp dữ liệu, đồng thời tự động chỉnh sửa nhiều dòng liên quan cùng một lúc.

Python
def process_data(data):
    filtered_data = [item for item in data if item['value'] > 10]
    sorted_data = sorted(filtered_data, key=lambda x: x['date'])
    transformed_data = [{'date': x['date'], 'value': x['value']*2} for x in sorted_data]
    return transformed_data

2.2 Chat

Tính năng Chat cho phép người dùng trao đổi với một trí tuệ nhân tạo (AI) có khả năng hiểu toàn bộ mã nguồn. AI này luôn có thể nhìn thấy tệp đang mở và vị trí con trỏ hiện tại, vì vậy chúng ta có thể hỏi những câu như: Có lỗi ở đây không?.

Chúng ta có thể thêm các đoạn code cụ thể vào ngữ cảnh của cuộc trò chuyện bằng tổ hợp phím Ctrl+Shift+L hoặc bằng cách sử dụng ký hiệu @. Để trò chuyện về toàn bộ mã nguồn, hãy sử dụng tổ hợp phím Ctrl+Enter.

2.3 Ctrl + K

Ctrl + K cho phép bạn chỉnh sửa và viết code với sự hỗ trợ của AI. Để chỉnh sửa, hãy thử chọn một đoạn code, nhấp vào Edit (Chỉnh sửa), sau đó mô tả cách bạn muốn thay đổi đoạn code đó. Để tạo code hoàn toàn mới, chỉ cần nhấn Ctrl K mà không cần chọn bất cứ gì thêm.

3. Lợi ích khi sử dụng Cursor AI

  • Tăng năng suất và chất lượng code: Cursor giúp cải thiện hiệu quả công việc và chất lượng code.
  • Tự động hóa tác vụ lặp lại: Cursor giảm bớt công việc lập trình lặp đi lặp lại và phát hiện lỗi sớm.
  • Hỗ trợ cho người mới: Giao diện ngôn ngữ tự nhiên giúp đơn giản hóa các thay đổi mã phức tạp, có lợi cho nhà phát triển ít kinh nghiệm.
  • Giúp hiểu mã nguồn nhanh chóng: Cursor giúp duy trì tính nhất quán trong các dự án lớn và hỗ trợ làm quen nhanh với code mới.

4. Hướng dẫn cài đặt và sử dụng Cursor AI

4.1 Cài đặt Cursor AI

Cursor AI cung cấp tệp cài đặt cho Linux, Windows và MacOS có thể tải xuống miễn phí trên trang web: https://www.cursor.com/

Trang chủ của Cursor AI
Trang chủ của Cursor AI

Để cài đặt trên Windows và MacOS, chỉ cần tải tệp từ trang chủ và làm theo hướng dẫn cài đặt như bạn vẫn làm với các phần mềm thông thường. Trên Linux, phần mềm được cung cấp dưới dạng tệp AppImage. Trước khi chạy, chúng ta cần thực thi nó bằng cách sử dụng lệnh:

Bash
chmod a+x cursor-0.40.3x86_64.AppImage
./cursor-0.40.3x86_64.AppImage

Sau khi cài đặt, bạn sẽ thấy màn hình cấu hình sau:

Màn hình cấu hình sau khi cài đặt Cursor AI thành công
Màn hình cấu hình sau khi cài đặt Cursor AI thành công
  • Keyboard: Tùy chọn này cho phép chúng ta cấu hình các phím tắt. Mặc định nó sẽ sử dụng các phím tắt VSCode.
  • Language for AI: Ở đây, chúng ta có tùy chọn sử dụng ngôn ngữ không phải tiếng Anh để tương tác với AI.
  • Codebase-wide: Bật tùy chọn này cho phép AI hiểu được bối cảnh của toàn bộ code base.
  • Add Terminal Command: Lệnh này cho phép Cursor AI chạy bằng Terminal Command.

4.2 Sử dụng Cursor AI

4.2.1 Tạo Code trực tiếp

Nhấn Cmd + K trên Mac (hoặc Ctrl + K trên Windows) để mở trình tạo code trực tiếp. Thao tác này sẽ hiển thị một cửa sổ nhắc nhỏ, bạn có thể nhập yêu cầu để tạo code ở đây.

Giao diện nhắc nhở tạo mã trực tiếp‌ ‌
Giao diện nhắc nhở tạo mã trực tiếp‌ ‌

Để tạo code, chúng ta nhập lời nhắc rồi nhấp vào nút tạo (Generate).

Tạo mã bằng trình tạo mã trực tiếp
Tạo mã bằng trình tạo mã trực tiếp

Thao tác này sẽ giúp tạo code và bạn có thể chèn code đó vào dự án bằng cách nhấn vào nút Chấp nhận (Accept).

Chấp nhận thay đổi mã
Chấp nhận thay đổi mã

Mình đang sử dụng mô hình claude-3.5-sonnet, bạn có thể chọn một mô hình khác như mô tả ở hình bên dưới.

Lựa chọn mô hình trong trình tạo mã trực tiếp
Lựa chọn mô hình trong trình tạo mã trực tiếp

Các mô hình AI mà các bạn có thể chọn bao gồm: GPT-4o, GPT-4, Claude 3.5 Sonnet, cursor-small.

4.2.2 Tương tác với Code hiện có

Bạn cũng có thể sử dụng tính năng trò chuyện trực tuyến để tương tác với code hiện có bằng cách chọn đoạn code liên quan trước khi nhấn Cmd+K (hoặc Ctrl+K trên Windows).

Phím tắt này cho phép bạn thực hiện thay đổi cho code, chẳng hạn như tái cấu trúc hoặc đặt câu hỏi về code. Sau khi nhập lời nhắc, nhấn nút 'Gửi chỉnh sửa' (Submit Edit) để chấp nhận các thay đổi.

Sử dụng tính năng Submit Edit trong Cursor AI
Sử dụng tính năng Submit Edit trong Cursor AI

Trong Cursor, các thay đổi code được hiển thị dưới dạng so sánh. Dòng màu đỏ cho biết những đoạn code sẽ bị xóa, còn dòng màu xanh lá cây cho thấy các phần mới sẽ được thêm vào. Khi bạn nhấn 'Chấp nhận' (Accept), các dòng màu xanh sẽ thay thế cho các dòng màu đỏ.

Kết quả phản hồi hiển thị sự khác biệt với màu xanh và màu đỏ
Kết quả phản hồi hiển thị sự khác biệt với màu xanh và màu đỏ

4.2.3 Đặt câu hỏi về Code hiện có

Tương tự như vậy, chúng ta có thể đặt câu hỏi về một đoạn code bằng cách chọn đoạn code đó và sử dụng phím tắt Cmd+K. Trong ví dụ này, chúng ta nhấp vào nút quick question.

Sử dụng tính năng quick question của Cursor AI
Sử dụng tính năng quick question của Cursor AI

Sau khi gửi câu hỏi, hệ thống sẽ tạo câu trả lời và hiển thị như sau

Kết quả phản hồi từ Cursor AI
Kết quả phản hồi từ Cursor AI

4.2.4 Code Completion bằng phím Tab

Khi viết code, Cursor sẽ đưa ra các gợi ý hoàn thành code dựa trên AI. Giống như tính năng code completion truyền thống, bạn có thể nhấn phím Tab để chèn các gợi ý này vào code của mình.

Ví dụ, nếu bạn bắt đầu triển khai một hàm có tên là maximum(), Cursor sẽ nhận diện ý định và đề xuất một đoạn code phù hợp. Chỉ cần nhấn Tab để thêm code được đề xuất.

Tạo mã với phím Tab bằng Cursor AI
Tạo mã với phím Tab bằng Cursor AI

Tính năng auto-complete cũng hoạt động với mô tả bằng ngôn ngữ tự nhiên. Ví dụ, nếu bạn muốn tạo một vòng lặp for lồng nhau để lặp qua tất cả các cặp trong danh sách, bạn chỉ cần mô tả điều này bằng văn bản. Sau đó, Cursor AI sẽ cung cấp đề xuất auto-complete tương ứng, và bạn có thể chèn nó vào code bằng cách nhấn phím Tab.

Tự động hoàn thành từ văn bản thuần túy bằng cách sử dụng Cursor AI
Tự động hoàn thành từ văn bản thuần túy bằng cách sử dụng Cursor AI

4.2.5 Tạo Code bằng trò chuyện

Để mở cửa sổ trò chuyện, nhấn phím tắt Cmd+L (hoặc Ctrl+L trên Windows). Cửa sổ trò chuyện linh hoạt hơn so với trình tạo code trực tiếp, vì ngoài việc tạo code, bạn còn có thể đặt câu hỏi. Dưới đây là tổng quan về giao diện trò chuyện.

Cửa sổ trò chuyện của Cursor AI
Cửa sổ trò chuyện của Cursor AI

Giống như trình tạo code trực tiếp, bạn cũng có thể tạo code thông qua tính năng trò chuyện. Code được tạo ra trong cửa sổ trò chuyện có thể được thêm vào dự án bằng cách nhấn nút 'Chấp nhận' (Accept) ở góc trên bên phải của cửa sổ code.

Áp dụng các thay đổi mã từ đầu ra trò chuyện
Áp dụng các thay đổi mã từ đầu ra trò chuyện

4.2.6 Tăng cường ngữ cảnh truy vấn với @

Một trong những tính năng quan trọng nhất của cửa sổ trò chuyện là tùy chọn @. Tính năng này cho phép bạn cung cấp thêm dữ liệu cho AI để tạo phản hồi tốt hơn. Bạn có thể thêm từ tệp, thư mục, tìm kiếm trên web, hoặc thậm chí cho AI quyền truy cập GitHub repo. Ví dụ, bạn có thể sử dụng @Web để cho phép AI tìm kiếm câu trả lời trên web.

Yêu cầu phiên bản python mới nhất
Yêu cầu phiên bản python mới nhất

Hãy lưu ý rằng, trong một số trường hợp, việc chia sẻ toàn bộ source code hoặc GitHub repo với AI có thể gây ra rủi ro. Chúng ta nên cẩn trọng với những gì được chia sẻ và tránh cung cấp dữ liệu nhạy cảm hoặc riêng tư. Dưới đây là bản tóm tắt nhanh về các loại ngữ cảnh trong Cursor AI.

  • @Files: Tham chiếu toàn bộ tệp trong dự án của bạn.
  • @Folders: Tham chiếu toàn bộ thư mục.
  • @Code: Tham chiếu đến các phần mã cụ thể.
  • @Docs: Truy cập tài liệu của bên thứ ba được lập chỉ mục sẵn hoặc thêm tài liệu của riêng bạn.
  • @Git: Thêm lệnh git commit, diffs hoặc yêu cầu kéo vào lời nhắc của bạn (trong Trò chuyện).
  • @Codebase: Cho phép Cursor quét toàn bộ cơ sở mã của bạn để tìm ngữ cảnh.
  • @Web: Yêu cầu Cursor tìm kiếm thông tin có liên quan trên internet.
  • @Chat  và  @Definitions: Trong ⌘ + K (Ctrl + K), bao gồm tin nhắn trò chuyện hoặc định nghĩa mã gần đó làm ngữ cảnh.

4.2.7 Câu hỏi về mã nguồn toàn cục

Một tính năng mà mình thấy rất hữu ích khi làm việc trên các dự án lớn là khả năng nhanh chóng tìm đoạn code bằng cách đặt câu hỏi dựa trên toàn bộ codebase.

Ví dụ, nếu mình muốn tìm một hàm tính toán navigation directions trong ứng dụng, với Cursor, mình chỉ cần mô tả chức năng của hàm và nó sẽ dễ dàng xác định được vị trí của hàm này.

Câu hỏi về cơ sở mã toàn cục của Cursor AI
Câu hỏi về cơ sở mã toàn cục của Cursor AI
Kết quả phản hồi cho câu hỏi về cơ sở mã toàn cục bằng Cursor AI
Kết quả phản hồi cho câu hỏi về cơ sở mã toàn cục bằng Cursor AI

4.2.8 Hỗ trợ hình ảnh

Cursor chat còn hỗ trợ việc nhập hình ảnh. Ví dụ, bạn có thể phác thảo thiết kế giao diện người dùng cho một trang web và yêu cầu Cursor tạo code HTML và CSS cho trang đó. Để thêm hình ảnh, bạn chỉ cần kéo và thả hình ảnh vào cửa sổ trò chuyện.

Cursor AI cho phép tải hình ảnh lên
Cursor AI cho phép tải hình ảnh lên

4.3 Một số phím tắt thông dụng trong Cursor

Cursor cung cấp nhiều phím tắt và lệnh điều hướng để giúp lập trình viên làm việc nhanh và thuận tiện hơn. Dưới đây là một số phím tắt (dành cho Windows) và lệnh điều hướng thông dụng trong Cursor:

  • Ctrl + K: Mở khung chat để tương tác với Cursor.
  • Ctrl + L: Chọn một đoạn mã và yêu cầu Cursor giải thích nghĩa của mã.
  • Ctrl + Enter: Thực thi đoạn mã đã chọn trong khung soạn thảo hiện tại.
  • Ctrl + Delete: Xóa lịch sử chat trong khung chat của Cursor.
  • Ctrl + Shift + K: Sao chép đoạn mã đã chọn trong khung soạn thảo hiện tại.
  • Ctrl + Shift + L: Dán đoạn mã đã sao chép vào khung soạn thảo hiện tại.

5. Kết luận

Các công cụ như ChatGPT đã giúp việc lập trình trở nên dễ dàng hơn bằng cách cho phép người dùng viết code thông qua việc mô tả mục tiêu của mình bằng ngôn ngữ tự nhiên. Cursor AI còn tiến xa hơn khi tích hợp trực tiếp vào trình soạn thảo code, giúp bạn không cần phải chuyển qua lại giữa trình soạn thảo và giao diện trò chuyện.

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

Bài viết liên quan

Lập trình backend expressjs

xây dựng hệ thống microservices
  • Kiến trúc Hexagonal và ứng dụngal font-
  • TypeScript: OOP và nguyên lý SOLIDal font-
  • Event-Driven Architecture, Queue & PubSubal font-
  • Basic scalable System Designal font-

Đăng ký nhận thông báo

Đừng bỏ lỡ những bài viết thú vị từ 200Lab