3 min read
[코딩 에이전트 2] Cursor Background Agent로 크롬 익스텐션 만들어본 경험 공유

개요

비동기 코딩 에이전트가 개발 트렌드를 완전히 바꿀것이라는 생각이 들었다. 동기식 대비 사용법이 간단하고 개발 환경도 가리지 않으니 (심지어 핸드폰에서도 개발 가능하고) 10x 생산성이 가능할 것이라는 기대가 생겼다.

간단한 프로젝트를 만들어보며 검증한 결과를 여기에 작성한다.

TL;DR

  1. 크롬 익스텐션 개발해본적 없지만 에이전트만 이용해서 원하는 기능 모두 구현 완료
  2. claude-4-sonnet MAX만 사용
    • 총 66 커밋 생성
    • 커밋 하나 생성에 1-3번의 대화
    • cursor 비용 $15 발생
    • 테스트 코드 70개 이상
    • 총 개발 시간 10시간 내외

프로젝트 소개

  • 동기: 영어로된 오픈소스 프로젝트에 기여하기 위해 언어장벽 낮추기 (자동번역 기능 개발)
  • 종류: 크롬 익스텐션
  • 기능
    1. github pull request, issue 페이지에서 영문 → 한글 자동 번역
    2. 코멘트 작성시 한글 → 영문 번역

사전 정보

  1. 작성자는 크롬 익스텐션을 만들어본 경험이 없음
  2. 코딩 에이전트 사용 경험은 많음
  3. 이번엔 비동기 코딩 에이전트만 사용하기로 함

구현 과정

1. memory-bank 패턴으로 시작

  • memory-bank 디렉토리에 architecture.md, implementation-plan.md, progress.md를 작성 후 구현 시작
  • architecture와 implementation은 Chat GPT를 이용해 최대한 자세히 작성
    • LLM은 컨텍스트 유지가 매우 중요하므로 memory-bank 패턴을 사용했을 때 효율성 증가
    • progress.md에 작업 내용을 추가하므로 llm 세션이 닫히거나 채팅창이 길어져도 컨텍스트 유지하는 것에 대해 부담이 적음

2. TDD로 대부분의 작업을 처리

  • agent는 pass/fail 메세지를 받았을 때, 스스로 문제를 수정할 수 있음
  • TDD로 테스트부터 작성시킨 후 리뷰하고 비즈니스 로직을 작성하게 시킴

3. 비동기 에이전트 (background agent)만 사용

  • 비동기 에이전트들은 가상 환경을 만들어 코드 작성, 테스트를 스스로 실행
  • 내 PC에서 테스트가 실행되는게 아니므로 보안 위험이 현저히 낮고 개발환경 세팅 필요 없음
    • bash 명령 실행에도 부담이 없음
  • 실행 결과를 나중에 다양한 경로로 전달 받으므로 이동중에도 코딩 가능

후기

  1. 같은 기능을 다시 개발한다면 30커밋 이내에도 가능할것 같음 (더 능숙해지면 더 줄일수도 있지 않을까?)
  2. memory-bank 패턴 매우 유용함
    • memory-bank 패턴에 대해 학습이 더 필요
    • 에이전트를 이용한 개발에 핵심
  3. TDD 매우 유용함
    • LLM 스스로 피드백 루프를 실행
  4. claude-sonnet-4는 대부분의 영역에서 초급-중급 개발자의 느낌을 주고 가끔은 훨씬 잘하는 느낌을 받기도 함
  5. 코딩 에이전트는 다루기 어렵지만 좀 더 자신감 생김

Cursor를 선택한 이유

  • 지난번 작성했던 비동기 코딩 에이전트 체험에서 3개의 비동기 코딩 에이전트를 소개. 이중 cursor는 혼자 local에 설치 가능한 IDE를 제공함. local 개발 ↔ 비동기 개발을 손쉽게 전환하며 코딩이 가능함 (이미 락인도 많이 됐고…)
  • cursor는 Pro 사용자라면 $20의 유료 바우처도 제공되므로 비용 부담도 적었음
  • jules는 베타라 그런지? 좀 잘 안되는 느낌이 많았음
  • devin은 ($50 충전은 해뒀지만..) 나중에 사용해볼 예정

관련 자료