iT邦幫忙

2024 iThome 鐵人賽

DAY 3
0
Modern Web

與 AI 一起開發 Side Project 吧!系列 第 3

Day3 — AI 程式碼編輯器 Cursor IDE 簡介

  • 分享至 

  • xImage
  •  

上次介紹了 Cursor IDE 的一些使用技巧,但好像還沒跟大家說 Cursor IDE 是個什麼樣的工具? 這次回頭來跟大家好好介紹一番!

Cursor.sh 的最大特點在於其深度整合的 AI 功能,特別是名為 Copilot++ 的 AI 助手。

為什麼能被稱作是 Copilot 加加?(有比 C 加加還厲害嗎?)

尤其這款 IDE 能夠根據我們開發者的指令,「自動」生成程式碼、提供程式碼建議,甚至協助調試從而簡化邊寫程式碼的過程喔。

我們可以像使用 ChatGPT 那樣,使用「白話文」向 Cursor.sh 提問,系統會根據整個專案的程式碼庫「上下文」提供準確的答案,這一點在其他 IDE 中還蠻罕見,且令人驚豔地很方便好用!

為何推薦?

自動 Apply 修改程式碼

讀取「上下文」並根據整個專案的程式碼來「生成新的程式碼」這一點,現在市面上其他 IDE 可說是無出其右,因此就挑了這款來跟大家介紹。

因為可以讀取上下文,所以輸入像是這樣的指令:「幫我根據 OOO 這個抽象類,產出其相應的實作方法」。Cursor IDE 就會咻咻咻地迅速自動產出實作,而且其能夠「掃描整個專案」來生成相關的程式碼,把改動一併生成。

接著只要按下 Apply ,就可以直接貼到程式碼裡面,根本不用複製貼上,按一按就直接幫你把程式改好了!

真正的殺手鐧 — RAG

RAG:檢索增強生成(Retrieval Augmented Generation),結合傳統資訊檢索系統(例如資料庫) 的優勢,以及生成式大型語言模型(LLM) 的功能。

剛剛提到的讀取整個專案的上下文,這有什麼厲害?

還蠻厲害的,說真的。

特別是當今天接手的這個專案不熟悉,或是專案比較「龐大」的時候,要找 code 都是件難事,以往都要一個個檔案去翻,找到程式碼之後,還要試圖理解其中的流程,找到相關性之後,接著看一下測試案例或是實際專案的執行,才知道是不是如自己所想的那樣,真是…累人!

有了 Cursor 幫忙讀取上下文,而這時候就可以靠著「詢問 AI」的方式,用直覺的白話文來問 Cursor,像是問說「跟登入有關的程式碼在哪?」,Cursor 就可以直接列出相關的程式碼檔案,並解釋給你聽。

像是以下這樣,試著問專案中與「登入流程」有關的程式碼:

以下是與「登入流程」有關的程式碼檔案:

1. AuthPage.tsx
- 管理登入頁面及其相關功能,包括登入、註冊、重設密碼等,並根據使用者狀態進行相應的導航。

2. AuthProvider.tsx
- 提供身份驗證上下文,管理使用者的登入狀態。

//...

哇…,相當地「人工智慧有感」,有點像是 ChatGPT 的文章摘要,把這個功能應用在程式碼的專案庫。

正是 RAG 中的「傳統資訊檢索功能」搭配 LLM(ChatGPT, Claude AI…等)的強大之處,讓 AI 生成更為「無縫接軌」進整個程式碼專案,寫出更貼近我們需求,「更像我們寫」的程式碼。

總結

與 AI Pair Programming

Cursor.sh 作為一款創新的IDE,藉著深度整合的 AI 功能,特別是 Copilot 加加 助手,為我們開發者帶來了「更沈浸式的 AI 開發」體驗。

可以用自然語言(也就是我們平常在說的話)直接說想寫的 Code,眨眼之間就能根據指令產出程式碼,簡直就像是旁邊有位資深的程式設計師,跟他一起 Pair Programming 呢!

接下來的文章,就會介紹怎麼藉由 Cursor 的幫助,利用 Cursor IDE 的內建指令,幫我們的專案快速生成程式碼,大幅提升開發效率囉!


REF


上一篇
Day2 — Cursor IDE 常用提示詞,教你怎麼下指令!
下一篇
Day4 — 教你「 AI 程式編輯器 Cursor IDE」如何一秒快速上手!
系列文
與 AI 一起開發 Side Project 吧!17
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言