Cursor AI : Mode와 Context 활용으로 개발 생산성 2배로 높이기
목차
Cursor의 두 가지 모드
1. Agent 모드
Agent 모드는 마치 실제 프로그래머와 페어 프로그래밍을 하는 것처럼 동작합니다.
특징:
- 코드를 직접 수정하고 작성할 수 있음
- 프로젝트의 전체 맥락을 이해하고 작업
- 파일 생성, 수정, 삭제 가능
- 더 긴 대화가 가능하며 이전 맥락을 기억
이럴 때 사용하세요:
- 새로운 프로젝트 시작할 때
- 버그 수정이 필요할 때
- 코드 리팩토링할 때
- 여러 파일을 동시에 수정해야 할 때
2. Ask 모드
Ask 모드는 빠른 질문과 답변이 필요할 때 사용하는 모드입니다.
특징:
- 빠른 응답 속도
- 간단한 질문-답변 형식
- 코드 수정 기능 없음
- 이전 대화 맥락을 기억하지 않음
이럴 때 사용하세요:
- 문법이나 함수 사용법을 물어볼 때
- 에러 메시지 해석이 필요할 때
- 간단한 코드 설명이 필요할 때
- 빠른 참조가 필요할 때
Context 활용하기
Context란?
Context는 Cursor AI가 여러분의 프로젝트를 더 잘 이해하고 도와줄 수 있도록 하는 '배경 지식'입니다.
마치 새로운 팀원에게 프로젝트 문서를 전달하는 것처럼, AI에게 필요한 정보를 제공하는 거죠!
Context 등록 방법
- Cursor 에디터 열기
- Open Chat' (Windows: Ctrl+i, Mac: Cmd+i)
- 채팅창에서
/docs또는/rules명령어 입력 - 채팅창에서
/context명령어 입력하면 현재 프로젝트에 등록된 Context 내용을 보여준다.(Docs Context, Rules Context)
1. Docs Context
특징:
- 프로젝트의 기술 문서나 가이드라인 등록
- 사용 중인 라이브러리나 프레임워크 정보 제공
- 프로젝트 구조와 아키텍처 설명
등록 예시:
/docs
프로젝트명: React Shopping Mall
기술스택:
- Frontend: React 18, TypeScript
- 상태관리: Redux Toolkit
- UI 라이브러리: Material-UI v5
- 스타일링: Styled-components
주요 디렉토리 구조:
src/
├── components/ # 재사용 가능한 UI 컴포넌트
├── pages/ # 페이지 컴포넌트
├── hooks/ # 커스텀 훅
├── store/ # Redux 관련 파일
└── styles/ # 전역 스타일 및 테마
API 엔드포인트: https://api.shop.example.com/v1
디자인 시스템: Figma - https://figma.com/file/example2. Rules Context
특징:
- 코딩 컨벤션 정의
- 프로젝트 규칙 설정
- 커스텀 요구사항 지정
등록 예시:
/rules
코드 스타일:
- React 컴포넌트는 함수형으로 작성
- Props 타입은 interface로 정의
- 스타일 컴포넌트 네이밍: Styled[컴포넌트명]
- CSS-in-JS 사용시 styled-components 사용
네이밍 규칙:
- 컴포넌트: PascalCase (예: ProductCard)
- 함수/변수: camelCase (예: getUserData)
- 상수: UPPER_SNAKE_CASE
- 타입/인터페이스: PascalCase, 접두사 'I' 사용
코드 품질:
- 컴포넌트당 최대 300줄
- 함수당 최대 50줄
- 중첩 삼항연산자 사용 금지
- useEffect 의존성 배열 필수
에러 처리:
- API 호출은 try-catch로 감싸기
- 사용자 피드백 필수 (토스트/모달)
- 에러 로깅 구현Context 활용 시나리오
- 새로운 기능 개발 시
User: "장바구니 기능을 추가하고 싶어요."
Cursor: "네, Rules Context에 정의된 대로 함수형 컴포넌트와
TypeScript interface를 사용해서 구현하겠습니다."- 코드 리뷰 시
User: "이 코드 리뷰 좀 해주세요."
Cursor: "Docs Context의 디렉토리 구조에 따라,
이 컴포넌트는 components/ 폴더로 이동하는 것이 좋겠습니다."- 버그 수정 시
User: "API 호출 에러가 발생해요."
Cursor: "Rules Context에 정의된 대로 try-catch와
사용자 피드백을 추가하겠습니다."Context 활용 팁
- 정기적인 업데이트
- 새로운 라이브러리 추가 시 Docs 업데이트
- 팀 규칙 변경 시 Rules 업데이트
- 프로젝트 구조 변경 시 즉시 반영
- 상세한 정보 제공
- 버전 정보 명시
- 링크는 구체적인 URL 사용
- 예시 코드 포함
- 팀 협업 시
- 팀원들과 Context 내용 공유
- Git을 통해 Context 파일 관리
- 주기적인 Context 리뷰
실전 활용 팁
1. 모드 전환 시기
- 복잡한 작업 시작 → Agent 모드
- 빠른 검색이나 질문 → Ask 모드
2. Context 추가 시기
Docs Context 추가가 필요한 경우:
- 새로운 프로젝트 시작 시
예시: 새로운 React 프로젝트 시작 시
/docs
프로젝트명: 쇼핑몰 프로젝트
기술스택: React 18, TypeScript
디렉토리 구조: src/, components/, pages/...
- 외부 API나 라이브러리 사용 시
예시: 결제 모듈 추가 시
/docs
결제 API: Stripe v3
엔드포인트: https://api.stripe.com/v1
인증방식: Bearer Token
- 프로젝트 구조 변경 시
예시: 마이크로서비스 구조 도입 시
/docs
서비스 구조:
- auth-service: 인증/인가 처리
- product-service: 상품 관리
- order-service: 주문 처리
Rules Context 추가가 필요한 경우:
- 코딩 컨벤션 설정 시
예시: 팀 코딩 스타일 통일
/rules
- 들여쓰기: 2칸
- 세미콜론 필수
- 함수는 화살표 함수 사용
- 프로젝트 규칙 정의 시
예시: 성능 최적화 규칙
/rules
- 이미지는 WebP 형식 사용
- 번들 크기 500KB 이하 유지
- 중첩 컴포넌트 최대 3depth
- 개인 취향이나 선호도 설정 시
예시: 개인 개발 스타일
/rules
- 주석은 한글로 작성
- 변수명은 설명적으로
- console.log 사용 금지
3. Context 관리 전략
단기 프로젝트:
- 최소한의 필수 정보만 Docs에 등록
- 핵심 규칙만 Rules에 정의
장기 프로젝트:
- Docs는 단계별로 확장하며 업데이트
- Rules는 팀 피드백 반영하여 진화
팀 프로젝트:
- Docs: README.md와 동기화
- Rules: ESLint 규칙과 일치시키기
4. Context 활용 모범 사례
효율적인 Docs 관리:
- 버전 정보 항상 최신화
- 링크는 구체적인 URL 사용
- 예시 코드 포함
효과적인 Rules 설정:
- 규칙은 구체적으로 작성
- 예외 상황도 명시
- 이유(why)도 함께 설명
5. 주의사항
- Context는 프로젝트별로 독립적 관리
- 민감한 정보(API 키 등)는 제외
- 정기적으로 유효성 검토
- 팀원들과 공유 시 별도 문서화
참고:
Rules 넣을 내용 참고할 만한 사이트 :
https://cursor.directory/
스타일 참고를 위해 Docs에 넣을 만한 사이트 :
'AI' 카테고리의 다른 글
| SuperClaude : 프롬프트 엔지니어링 (2) | 2025.08.17 |
|---|---|
| DeepSeek로 인해 엔비디아(NVIDIA) 주가가 떨어지는 이유 (1) | 2025.01.31 |
| 딥시크(DeepSeek)와 ChatGPT 비교 (0) | 2025.01.31 |
| GPU Farm (3) | 2025.01.19 |
| DC vs AI DC (0) | 2025.01.19 |
