강력한 AI 코드 어시스턴트 - Cursor 기능 소개

요즘 정말 잘 쓰고 있는 AI 코드 어시스턴트 프로그램 Cursor의 기능과 활용 사례들에 대해 공유드립니다 😀

---

TLDR

Cursor는 세 가지 주요 AI 기반 코드 상호작용 기능을 제공합니다:

1. Tab 기능:å
   • 코드 생성: 최근 편집 내용을 기반으로 코드를 예측하고 자동 완성합니다.
   • 여러 줄 편집: 여러 유사한 코드 줄을 동시에 수정합니다.
   • 스마트 재작성: 코드 블록을 선택하고 재구성하여 구조나 성능을 향상시킵니다.
2. 채팅 기능 (Ctrl + Shift + L):
   • 코드 인식 AI 상호작용: 코드베이스에 대한 질문을 하고 상세한 답변을 얻을 수 있습니다.
   • @로 코드 참조: 대화 중 특정 코드 라인이나 파일을 참조할 수 있습니다.
   • 웹 검색 및 이미지 통합: 리소스를 검색하거나 이미지를 채팅에 직접 추가할 수 있습니다.
   • 제안 즉시 적용: AI의 제안을 받아들여 코드에 바로 적용할 수 있습니다.
3. Ctrl + K 기능:
   • 빠른 수정: 에디터나 터미널에서 AI 채팅 버블을 통해 즉각적인 코드 수정을 할 수 있습니다.
   • 빠른 질문: 코드 관련 질문을 하고 즉각적인 답변을 받을 수 있습니다.
   • 터미널 명령어 실행: 자연어 명령을 사용하여 터미널 명령어를 실행합니다.

추가 활용 사례:

• 테스트 코드 파일 생성: 원본 코드와 대상 디렉토리를 제공하여 테스트 코드를 생성합니다.
• 터미널 오류 수정: 터미널에서 바로 “AI로 디버그”를 사용하여 오류를 해결합니다.

---

Cursor 기능 활용

Cursor에서는 3가지 방법으로 코드 기반의 AI 상호작용 기능을 활용할 수 있습니다.

• Tab: Code Editor에서 Tab키를 이용하는 방식
• Chat: 사이드바의 Chat 메뉴에서 코드 전체 혹은 부분을 적용하여 AI와 대화하는 방식
• Ctrl + K: Code Editor 혹은 Terminal에서 말풍선을 이용해 빠른 AI 작업을 실행하는 방식

참고: https://www.cursor.com/features

1. Tab 기능

코드 에디터에서 Tab키를 이용해서 다음 수정 사항을 예측하여 자동 완성 기능을 제공합니다.

코드 생성

• 최근 변경 내용을 기반으로 다음 변경 내용을 예측하여 생성해줍니다. (개발자의 의도 예측)
• 함수명 아래에 커서를 두고 기다리면 아래의 코드 추천이 생성된다.
• 
• Tab을 눌러 완성하면 아래의 추가 코드가 더 생성된다.
• 

여러 줄 수정

• 여러 줄을 한번에 수정해줍니다.
• 위 내용에서 font-weight-bold를 추가해주고, 아래 부분으로 커서를 이동하면 비슷한 영역에 위에서 진행한 수정이 자동으로 추천됩니다.
• 

Smart Rewrites

• 코드 블록을 선택하고 재작성해 구조나 성능을 개선합니다.
• CSS에서 문법에 맞지 않게 작성 시, 알아서 구조에 맞게 개선한 코드로 생성해줍니다.
• 

2. Chat 기능

Ctrl + Shift + L 키를 통해 AI와 사용자의 코드베이스를 기반으로 대화합니다. 현재 파일, 혹은 파일의 일부분, 추가 파일을 선택하여 AI와 대화합니다.

코드베이스를 이해하는 AI와 상호작용하며 질문을 하고, @로 코드 참조, 이미지 통합, 웹 검색, 제안 즉시 적용이 가능합니다.

코드 인식 AI와의 대화

• 코드베이스를 이해하는 AI에게 질문할 수 있습니다.
• Client(app.py)-server(srs.py) 관계인 두 코드에 대해 server의 시그니쳐 변경 시, client에서 호출되는 부분을 수정해달라 요청
• 
• 스키마 변경(srs_name -> srs_id)을 적용해주고, 이에 따른 코드 수정부분을 제안해주었다.
• 

코드 참조 (@ 사용)

• 특정 코드 라인이나 파일을 @를 사용해 참조할 수 있습니다.
• 기존 Flask로 작성된 api코드를 FastAPI로 생성요청
• 
• Accept 하여 코드에 바로 적용 가능
• 

웹 검색 및 이미지 통합

• 필요한 자료를 검색하거나 이미지를 대화에 추가할 수 있습니다.

3. Ctrl + K 기능

코드 에디터 혹은 터미널에서 Ctrl + K 를 통해 AI 대화 말풍선을 통해 빠른 편집과 적용이 가능합니다.

빠른 수정

• React 코드에서 버튼 위치 가운데로 이동 요청
• 
• 코드 내 수정 내용 바로 적용하여 제안해준다
• 

빠른 질문 기능

• 코드 관련 질문을 하여 AI의 답변을 받을 수 있습니다.
• 코드 내 질문 (Generate 버튼 옆 quick question 클릭)
• 
• 

터미널 명령어 실행

• 평범한 자연어 명령을 통해 터미널 명령어를 실행할 수 있습니다.
• 
• 그 외에도 가상환경 실행해줘, 삭제해줘, 라이브러리 설치해줘 등등의 자연어를 통해 CLI 명령어를 생성해줍니다.

그 외 usecases

테스트 코드 파일 생성

• 채팅창을 열어 테스트 코드를 생성할 원본 코드 및 생성 폴더, 참고 테스트 코드 등을 첨부하여 아래와 같이 요청한다.
• 
• 생성된 코드를 확인한 후 Apply 버튼을 클릭한다.
• 
• 지정한 디렉토리 경로 하위에 파일이 생성되어 적용 여부를 확인한다.
• 
• 정상적으로 잘 작동하는 테스트 코드를 작성해주었음을 확인할 수 있다.
• 

터미널에서 바로 오류 수정

• 터미널에서 오류 발생 시, Debug with AI 를 통해 바로 픽스 가능 > Chat 으로 넘어감
  • 채팅창에서 Run버튼을 통해 바로 터미널에 접근해 실행할 수 있음
• 
•