이걸 읽으면 적어도 커서의 80% 이해합니다.

1. 채팅 인터페이스 - Ctrl/⌘ + L

채팅 인터페이스는 코드에 대한 질문이나 문제 해결을 빠르게 도와주는 도구입니다. 실시간으로 AI와 대화하며 코드의 버그를 수정하거나 새로운 아이디어를 얻을 수 있어요.

컴포저(Composer)는 코드를 실제로 작성하고 실행하는 공간으로, AI와의 상호작용이 이뤄지는 핵심입니다.

저도 이 두 가지 기능을 활용해 앱과 웹을 개발했고, 개발 과정이 훨씬 수월해졌습니다.

이 두 가지 인터페이스만으로도 생산성을 크게 높일 수 있을 거예요!

Cursor의 채팅 인터페이스는 코드와 관련된 질문이나 설명 요청을 빠르고 쉽게 처리할 수 있는 기능이에요.

특히 저는 주로 디버깅에 활용합니다. AI와 실시간으로 대화하며 문제를 신속히 해결할 수 있죠.

왜 이 기능을 디버깅에 쓰냐면, AI는 대화가 길어질수록 오류 가능성이 높아질 수 있고, 커서의 또 다른 인터페이스인 컴포저에서 디버깅과 개발을 동시에 진행하면 코드가 꼬일 수 있기 때문이에요.

그래서 이 인터페이스를 분리해서 사용하면 훨씬 효율적이에요!

프롬프트 예시

@login.tsx 이 로그인 페이지에서 google 로그인 폼이 정상적으로 작동하지 않는데 
<https://firebase.google.com/docs/auth?hl=ko> 의 문서를 참고해서 수정해줘

 

 

@ 기호 활용

AI 입력 상자에서 @를 입력하면, 파일, 폴더, 웹 검색 등 다양한 리소스에 빠르게 접근할 수 있어요. 이를 활용해 특정 파일이나 소스들을 입력해서 AI가 어떤 작업을 수행해야할지 명확하게 설명해줄수있어요

@Codebase

@Codebase는 커서의 채팅 기능에서 프로젝트의 코드를 빠르게 찾을 수 있게 도와주는 도구입니다.

코드 파일을 자동으로 분석한 후, 질문에 맞는 부분을 찾아 정리해 줍니다.

쉽게 말해, 프로젝트에서 필요한 코드를 빠르게 찾아주고, 검색 기능도 제공해요.

이를 통해 복잡한 코드베이스에서도 효율적으로 작업할 수 있죠.

다양한 AI 모델 지원

GPT-4, o1, Claude, Gemini, Cursor-small 등 여러 AI 모델을 선택하여 최상의 결과를 얻을 수 있어요.

개인적으로 발급 받은 API KEY를 추가하여 사용 할 수있지만 Cursor의 주요기능을 사용하지 못할수도있어요.

긴 컨텍스트 채팅(베타)

Cursor Settings에서 Beta 탭으로 이동해 Long Context Chat 기능을 활성화할 수 있어요. 이 기능을 켜면 Ctrl/⌘ + . 을 눌러 다양한 채팅 모드로 쉽게 전환할 수 있어요.

긴 컨텍스트 채팅은 지원하는 AI 모델이 더 큰 맥락을 처리할 수 있어서 전체 폴더를 컨텍스트로 포함해 더 정확한 작업을 수행해줘요.

2. 컴포저 - Ctrl/⌘ + I

여러 파일에 걸쳐 코드를 생성하고 편집할 수 있는 커서에서 강력한 도구예요

특징:

• 여러 파일에 걸친 변경사항을 한 번에 적용할 수 있어요.
• 프로젝트 전체 구조를 이해하고 작업해요.
• 전체 애플리케이션 구조 생성 가능하고, 더 빠르고 효율적인 작업을 제공해요.

채팅 인터페이스와 컴포저의 주요 차이점

• 범위: Chat은 주로 질문과 대화에 중점을 두고, Composer는 코드 생성과 편집에 특화되어 있어요.
• 적용 방식: Chat에서는 제안된 코드를 수동으로 적용해야 하지만, Composer에서는 한 번에 여러 파일에 변경사항을 적용할 수 있어요. ( 여러 파일이 변경 되기 때문에 항상 신중하게 작업해야해요)
• 인터페이스: Composer는 진행 상황을 보여주는 패널, 중앙 파일 섹션, 채팅 패널이 있어서 더 복잡한 인터페이스를 제공해요.
• 프로젝트 이해도: Composer는 전체 프로젝트 구조를 이해하고 작업하는 데 더 적합해요.
• 사용 목적: Chat은 빠른 질문이나 설명 및 디버깅에 유용하고, Composer는 대규모 코드 생성이나 리팩토링에 더 적합해요.

3. 커맨드K - Ctrl/⌘ + K

Command + K 기능은 다른 기능들과 달리 코드를 직접 선택해서 사용해요. 수정이 필요한 부분만 수정할 수 있어서 섬세한 작업이 가능하죠. 이 기능은 여러분이 커서에 더 익숙해지고 코드에 대한 이해도가 조금 생겼을 때 사용하시는 걸 추천해요.

어떤 코드들은 서로 연결성을 가지고 공존하고 있을 수도 있는데, 그런 걸 모른 채로 수정하면 오류가 생길 가능성도 있어요.

여러분이 판단했을 때 이 코드가 독립적인 코드인지, 변경했을 때 큰 문제는 없을지 충분히 판단할 수 있어야 활용할 수 있는 기능이에요.처음에는 제가 영상에 보여드린 것처럼 단순히 주석을 달거나 가독성 있게 배치를 바꾸는 방법들로 사용하시는 걸 추천해요.

4. Tab (자동완성)

Tab 키는 구글 검색의 자동완성 기능과 비슷해요. 코드를 작성하거나 무언가 추가할 게 있다면 자동으로 완성된 결과를 보여주고, Tab을 누르면 이를 수락할 수 있어요.

보통 저는 더미 텍스트를 만들어 테스트할 때 활용하거나 여러 가지 키 값을 옮길 때 사용합니다.

코딩에 대한 지식이 있는 분들은 이 기능이 정말 유용할 거예요. 하지만 저처럼 코드를 잘 모르시는 분들은 활용도가 조금 떨어질 수밖에 없어요. 그래서 저도 조금씩 코딩에 관해 자연스럽게 배우고 있어요!

약간 이런 느낌이에요. 미국에 살면 생존을 위해 영어를 자연스럽게 배우게 되듯이, 여러분이 정말 절실하고 필요하다면 코딩에 대한 관심이 생기는 거죠.

5. 터미널에서의 활용

여러분이 작업을 진행하다 보면 터미널에 알 수 없는 오류들이 나타날 때가 있을 거예요. 코딩 지식이 부족한 우리로서는 이런 오류들이 무슨 뜻인지 모르고, 어떻게 해결해야 할지 막막할 수 있죠.

 

이럴 때 터미널에서 Add to Chat 또는 Add to Composer 기능을 활용하면 터미널 오류를 쉽게 확인하고 수정할 수 있어요. 이 기능을 사용하면 번거롭게 복사 붙여넣기할 필요 없이 버튼 하나로 오류를 수정할 수 있어 정말 편리해요.

 

앞서 말씀드렸듯이 저는 주로 오류 관련 요청에 채팅 패널을 이용하는데요. 물론 상황에 따라 컴포저를 사용해야 할 때도 있어요.

 

제가 사용하는 팁을 알려드릴게요:

광범위한 오류는 채팅 패널을, 비교적 좁은 범위에서 발생한 오류는 컴포저를 사용하는 편이에요. 다만, 오류 수정에 컴포저를 사용하는 비중은 20번 중 1번 정도로 그리 높지 않아요.

 

또한 오류를 수정할 때마다 프롬프트에 **'단계적으로 수정해줘'**라는 문구를 추가합니다.

 

아래에서 설명할 'Rules for AI'에 이미 단계적 오류 수정 요청이 포함되어 있지만,

습관이 되어서인지 저는 계속 이 요청을 넣게 되네요. 여러분도 번거롭더라도 꼭 단계적으로 수정해 달라는 요청을 해주시면 좋겠어요!

우리의 프로젝트는 소중하니까요!

6. Rules For AI

말 그대로 AI에게 규칙(법칙)을 정의해주는 거예요. 이건 큰 팁은 아니지만, 의외로 많은 분들이 이 설정을 하지 않고 사용하시더라고요.

제가 사용하는 프롬프트를 기반으로 여러분만의 입맛에 맞게 조정해서 사용하시면 좋을 것 같습니다.

설정 방법

1. 커서 오른쪽 상단 ⚙️ 버튼 클릭
2. General 메뉴 선택
3. 하단으로 스크롤
4. Rules for AI 섹션에서 프롬프트 수정

• 프롬프트
  you are an expert AI programming assistant in VSCode that primarily focuses on producing clear, readable code. You carefully provide accurate, factual, and thoughtful answers, and you are a genius at reasoning.You are thoughtful, give nuanced answers, and are brilliant at reasoning.
  1. Follow the user’s requirements carefully and precisely.
  2. First, think step-by-step – describe your plan for what to build in pseudocode, written out in great detail.
  3. Confirm, then write the code!
  4. Always write correct, up-to-date, bug-free, fully functional and working, secure, performant, and efficient code.
  5. Focus on readability over performance.
  6. Fully implement all requested functionality.
  7. Leave NO to-dos, placeholders, or missing pieces.
  8. Ensure the code is complete! Thoroughly verify the final version.
  9. Include all required imports, and ensure proper naming of key components.
  10. Be concise. Minimize any unnecessary explanations.
  11. If you think there might not be a correct answer, say so. If you do not know the answer, admit it instead of guessing.
  12. Always provide concise answers.
  13. Please answer in Korean 

이 규칙들을 Cursor AI에서 쓰면 어떤 좋은 점들이 있을까요? 한번 살펴볼까요?

1. 코드 품질이 쑥쑥 올라가요!
   • 항상 최신 버전의 버그 없는 코드를 만들어주니까 안정성이 높아져요. 그리고 성능보다는 읽기 쉬운 코드에 중점을 두니까 다른 개발자 친구들도 쉽게 이해하고 관리할 수 있어요.
2. 일 처리가 빨라져요!
   • 단계별로 계획을 세우고 코드를 작성하니까 개발 과정이 체계적이고 오류도 줄어들어요. 또 명확하고 간결한 코드를 쓰는 습관이 생겨서 개발 속도도 빨라진답니다.
3. 오류 잡기가 훨씬 쉬워져요!
   • 잘못된 추측이나 부정확한 코드가 없어지고, 코드를 꼼꼼히 검사하니까 예상 못한 오류가 줄어들어요. 문제가 생겨도 빨리 찾아내고 고칠 수 있어요.
4. 보안이 더 튼튼해져요!
   • 코드를 쓸 때 보안 관련 사항을 자동으로 고려해주니까 안전하고 믿을 수 있는 코드를 만들 수 있어요.
5. 팀워크가 좋아져요!
   • 읽기 쉬운 코드와 일관된 이름 짓기 규칙 덕분에 여러 개발자들이 함께 일할 때 더 잘 진행할 수 있어요. 팀원들끼리 코드를 잘 이해할 수 있어서 프로젝트가 순조롭게 진행돼요.
6. 완벽한 기능을 제공해요!
   • 미완성된 코드나 해결 안 된 작업 없이 모든 기능이 완벽하게 구현되어 있어서 제품을 출시할 때 더 믿음직스러워요.

결론적으로, 이 규칙들을 사용하면 코드의 품질도 높이면서 일도 빨리 처리하고 보안도 강화할 수 있어요. 정말 좋지 않나요?

7. Notepad

노트패드 기능은 requirements.md랑 비슷하게 쓸 수 있는 꿀 도구예요. 이걸로 이런 거 할 수 있어요:

• 참고할 거 적어두기
• 아이디어 메모하기
• 프로젝트 관련 정보 저장하기

솔직히 말하면 저는 노트패드 잘 안 써요. 왜 그러냐면:

• 프로젝트마다 필요한 게 다 달라서요
• 지금은 requirements.md 파일이 더 보기 좋고 관리하기 편해요

근데 Cursor가 점점 좋아지면서 노트패드도 더 중요해질 것 같아요. 그러니까 이 기능 어떻게 쓰는지 알아두면 나중에 엄청 유용할 거예요!

8. Docs

이는 제가 가장 애용하고 Cursor에서 가장 훌륭하다고 생각하는 기능 중 하나예요.

개발 문화 중 '오픈 소스' 문화 덕분에 개발자들은 문서를 꼼꼼히 정리하는 습관이 있죠. 정말 감사한 일이에요!

Cursor에서는 이런 docs를 저장하고 활용할 수 있어서 진짜 편리해요.

예시를 들어보겠습니다.

여러분이 OpenAI의 ChatGPT 모델을 사용하고 싶어 OpenAI 사이트에 접속했다고 가정해봅시다. 하지만 안타깝게도 여러분은 개발 지식이 없고, 코드를 읽을 줄도 모르며, API의 원리도 이해하지 못합니다.

그런데 이게 웬일입니까! OpenAI의 개발자들이 친절하게 모든 방법을 docs로 정리해 두었습니다. (럭키비키) 여러분이 원하는 기능의 페이지 주소를 복사해서 Cursor에 가져다 주면, Cursor가 그 문서를 읽고 코드를 작성해 줍니다.

이렇게 docs를 활용하면 더 정확한 정보를 바탕으로 코드를 작성할 수 있습니다. LLM은 기본적으로 정해진 시점의 데이터만 학습되어 있어 최신 내용을 반영하지 못하는 경우가 있죠.

이런 문제를 보완하기 위해 RAG(Retrieval-Augmented Generation)라는 기술을 사용합니다. RAG는 웹이나 기타 자료에서 최신 정보를 찾아 활용하는데, docs를 이용하면 이와 유사한 방식으로 작동합니다. 퍼플렉시티가 여러분에게 정보를 제공하는 방식과 비슷하다고 생각하시면 됩니다.

새로운 문서를 Cursor에 추가하고 싶다면 다음 단계를 따라주세요:

1. 채팅 패널이나 컴포저에서 "@docs" 입력
2. Docs 메뉴 클릭
3. "Add new docs" 선택
4. 링크 삽입
5. Docs 이름 설정

이 과정을 통해 간편하게 새로운 문서를 Cursor에 추가할 수 있습니다.

추가적으로 채팅 패널에서도 앞서 말씀드린 RAG 기능과 유사하게 웹 정보를 기반으로 답변하도록 설정할 수 있어요. 이 기능은 정말 멋진데, 저는 잘 사용해보지 않았어요. 하지만 여러분이 활용해 보고 싶으시다면, 설정 방법을 자세히 알려드릴게요:

1. 커서 오른쪽 상단 ⚙️ 버튼 클릭
2. Features 메뉴 선택
3. 하단으로 스크롤
4. Chat 섹션에서 "Always search the web" 활성화

지금까지 우리는 Cursor를 효과적으로 활용하기 위한 8가지 핵심 기능을 자세히 살펴봤어요. 이 기능들은 단순히 코드 작성을 돕는 것을 넘어서 개발 과정 전반을 개선하고 생산성을 크게 높여줍니다.

각 기능의 특징과 활용법을 이해하고 적절히 사용한다면, 여러분의 개발 경험이 한층 더 풍성해질 거예요. Cursor의 이런 다양한 기능들은 계속 발전하고 있어서 앞으로 더 많은 새로운 기능들이 추가될 것 같아요.

이런 기본적인 기능들을 잘 익히고 활용한다면, 앞으로 더욱 강력해질 Cursor를 최대한 활용할 수 있는 기반을 다질 수 있을 거예요.

---

앞으로 커서 관련 꿀팁과 커서를 활용해 실제 프로젝트를 제작하는 방법을 꾸준히 업로드할 예정이에요.

제 콘텐츠를 통해, 여러분은 커서를 활용해 더 효율적으로 코드를 작성하고, 직접 프로젝트를 완성해 서비스까지 만들어볼 수 있을 거예요

 

만약 여러분이 커서를 제대로 활용해서 자신만의 서비스를 만들어보고 싶다면, 구독 부탁드려요!

이 과정을 통해 실질적인 개발 스킬을 익히고, 빠르게 아이디어를 실현하는 방법을 배울 수 있습니다.

아이디어를 서비스로! FreAiner 커뮤니티에서 같이 성장해요!

https://linktr.ee/freAiner

FreAiner Harris | Linktree

 

[FreAiner MVP 런치클럽 1기 모집 안내]
안녕하세요, 여러분! 🚀

FreAiner 슬랙 커뮤니티에서 런치클럽 1기 참여자를 모집 중입니다!

MVP 런치클럽은 4주간 진행되는 실전형 MVP(최소 기능 제품) 개발 프로그램으로, 함께 성장하고 싶은 분들에게 최적의 기회입니다. 기획부터 개발까지의 전 과정을 다루며, 여러분의 아이디어를 실현할 수 있는 토대를 제공합니다.

런치클럽에서 다룰 내용

• 1주차: 프로덕트 기획 및 전략 수립
• 2~3주차: 개발 및 프로젝트 진행 (도구 활용, 실습, 온오프라인 서포트 진행)
• 4주차: 배포 및 피드백, 최종 발표 준비

이런 분들에게 추천합니다!

• MVP 개발에 도전해보고 싶은 분
• 제품 출시 및 수익화에 관심 있는 분
• 함께 성장할 커뮤니티를 찾고 있는 분

여러 도전을 통해 성장하고 싶은 분들의 많은 참여 부탁드립니다. 😊

 

💡FreAiner 슬랙 커뮤니티에 참여하세요!

FreAiner 슬랙 커뮤니티에서 다른 FreAiner들과 아이디어를 나누고, 앱 및 웹 개발에 대한 다양한 정보를 교환해보세요. 

👉 [슬랙 커뮤니티 참여하기]

---

💬 Threads에서도 FreAiner와 함께해요!

Threads에서 실시간으로 이야기를 나누며, FreAiner의 개발 팁과 인사이트를 만나보세요. 더 많은 사람들과 소통하며 네트워크를 확장해보세요!

👉 [Threads에서 FreAiner 팔로우하기]