Cate: 에이전트 중심 코딩 워크플로우를 위한 오픈 캔버스 IDE

무한 캔버스 기반의 오픈소스 데스크톱 IDE인 Cate를 만들고 있어.

이걸 시작한 이유는 간단해. 내 바이브 코딩(vibe-coding) 환경이 갈수록 윈도우 관리 지옥으로 변해가더라고.

평소 작업 환경은 대충 이랬어:

• 에이전트용 터미널 하나
• 개발 서버용 터미널 하나
• 로그나 스크립트용 터미널 또 하나
• 에디터
• 브라우저 미리보기
• 문서
• 깃 상태
• 가끔은 여러 개의 워크트리(worktrees)까지

각 도구는 괜찮은데, 이걸 다 같이 쓰려니까 워크플로우가 금방 개판이 되더라. 맨날 알트탭 누르고, 터미널 탭 왔다 갔다 하고, 어떤 에이전트가 뭘 하고 있는지 까먹고, 프로젝트 컨텍스트를 매번 다시 잡느라 시간 다 버렸지.

Cate는 이걸 하나의 지속적인 프로젝트 워크스페이스에 때려 넣으려고 만든 거야. 터미널, Monaco 에디터, 브라우저 패널, 문서, 깃/소스 제어 패널, 에이전트 패널들이 무한 줌이 가능한 캔버스 위에서 움직이는 객체로 존재해. 프로젝트를 다시 열어도 레이아웃은 그대로 유지되고.

Repo:
https://github.com/0-AI-UG/cate

Website:
https://cate.cero-ai.com

만든 데 쓴 것들

• 데스크톱 앱: Electron + React
• 에디터 패널: Monaco
• 터미널: xterm.js + node-pty
• 병렬 작업: simple-git / git worktrees
• 미리보기/문서: 내장 브라우저 패널
• 앱 내 에이전트 패널: Pi agent 연동
• 워크스페이스 상태 저장: 레포 내 <code>.cate/</code> 폴더

생각보다 빡셌던 부분들

1. 터미널은 그냥 "컴포넌트 하나"가 아님

macOS, Windows, Linux에서 터미널이 제대로 돌아가게 만드는 게 생각보다 훨씬 힘들었어. 붙여넣기 동작, Ctrl+C랑 복사 키 충돌, macOS 라인 편집 단축키, 클릭 가능한 링크, 쉘 시작, 노드 스폰까지 예외 케이스가 한두 개가 아니더라고.