opactorai/Claudable

Claudable은 Claude Code(Cursor CLI도 지원!)의 고급 AI 에이전트 (AI agent) 기능과 Lovable의 단순하고 직관적인 앱 구축 경험을 결합한 강력한 Next.js 기반 웹 앱 빌더입니다. "다크 모드가 있는 작업 관리 앱을 만들고 싶어"와 같이 앱 아이디어를 설명하기만 하면, Claudable이 즉시 코드를 생성하고 작동하는 앱의 라이브 프리뷰 (live preview)를 보여주는 것을 확인할 수 있습니다. 앱을 Vercel에 배포할 수 있으며, Supabase를 통해 데이터베이스 (database)를 무료로 통합할 수 있습니다.

이 오픈 소스 (open-source) 프로젝트는 전문적인 웹 애플리케이션을 무료로 쉽게 구축하고 배포할 수 있는 권한을 부여합니다.

시작하는 방법은 무엇인가요? 간단히 Claude Code (또는 Cursor CLI)에 로그인하고, Claudable을 시작한 뒤, 만들고 싶은 것을 설명하기만 하면 됩니다. 그게 전부입니다. 앱 빌더를 위한 추가 구독 비용은 없습니다.

강력한 에이전트 성능: Claude Code와 Cursor CLI 에이전트 (Agent) 기능의 모든 힘을 활용하세요
자연어를 코드로 (Natural Language to Code): 만들고 싶은 것을 설명하기만 하면, Claudable이 프로덕션 준비가 된 (production-ready) Next.js 코드를 생성합니다
즉각적인 프리뷰: AI가 앱을 빌드하는 동안 핫 리로드 (hot-reload)를 통해 변경 사항을 즉시 확인하세요
설정 제로, 즉시 실행: 복잡한 샌드박스 (sandboxes), API 키, 데이터베이스 고민 없이 즉시 구축을 시작하세요
아름다운 UI: Tailwind CSS와 shadcn/ui를 사용하여 아름다운 UI를 생성하세요
Vercel로 배포: 설정 없이 클릭 한 번으로 앱을 라이브로 푸시하세요
GitHub 통합: 자동 버전 관리 (version control) 및 지속적 배포 (continuous deployment) 설정
Supabase 데이터베이스: 인증 (authentication) 준비가 된 프로덕션 PostgreSQL을 연결하세요
데스크톱 앱: Mac, Windows, Linux를 위한 Electron 데스크톱 애플리케이션으로 사용 가능합니다

Claudable은 여러 AI 코딩 에이전트를 지원하여 필요에 따라 최적의 도구를 선택할 수 있는 유연성을 제공합니다:

Claude Code - Anthropic의 고급 AI 코딩 에이전트
Codex CLI - OpenAI의 강력한 코딩 에이전트
Cursor CLI - 강력한 멀티 모델 (multi-model) AI 에이전트
Qwen Code - Alibaba의 오픈 소스 코딩 CLI
Z.AI GLM-4.6 - Zhipu AI의 코딩 에이전트

Claude Code - Claude Opus 4.6을 탑재한 Anthropic의 고급 AI 코딩 에이전트 (AI coding agent)

주요 기능 (Features): 심층적인 코드베이스 인식 (Deep codebase awareness), 유닉스 철학 (Unix philosophy), 직접적인 터미널 통합 (Direct terminal integration)
컨텍스트 (Context): 네이티브 200k 토큰 (Native 200k tokens)
가격 (Pricing): Claude Pro/Max/Team/Enterprise 플랜에 포함되어 있거나, Anthropic API 키 사용 가능
설치 (Installation): npm install -g @anthropic-ai/claude-code claude # 그 다음 > /login

Codex CLI - GPT-5를 지원하는 OpenAI의 강력한 코딩 에이전트 (Coding agent)

주요 기능 (Features): 높은 추론 능력 (High reasoning capabilities), 로컬 실행 (Local execution), 다양한 운영 모드 (대화형 (interactive), 자동 편집 (auto-edit), 완전 자동 (full-auto))
컨텍스트 (Context): 모델에 따라 다름
가격 (Pricing): ChatGPT Plus/Pro/Business/Edu/Enterprise 플랜에 포함 (월 $20부터)
설치 (Installation): npm install -g @openai/codex codex # ChatGPT 계정으로 로그인

Cursor CLI - 최첨단 모델에 접근할 수 있는 강력한 AI 에이전트 (AI agent)

주요 기능 (Features): 멀티 모델 지원 (Multi-model support) (Anthropic, OpenAI), AGENTS.md 지원
컨텍스트 (Context): 모델에 따라 다름
가격 (Pricing): 무료 티어 사용 가능, Pro 플랜은 월 $20부터 (크레딧 기반 시스템)
설치 (Installation): curl https://cursor.com/install -fsS | bash cursor-agent login

Qwen Code - Qwen3-Coder 모델을 위한 Alibaba의 오픈 소스 CLI

주요 기능 (Features): 256K-1M 토큰 컨텍스트, 다양한 모델 크기 (0.5B에서 480B까지), Apache 2.0 라이선스
컨텍스트 (Context): 네이티브 256K, 외삽 (extrapolation) 시 1M
가격 (Pricing): 완전 무료 및 오픈 소스
설치 (Installation): npm install -g @qwen-code/qwen-code@latest qwen --version

Z.AI GLM-4.6 - GLM-4.6 기반의 Zhipu AI 코딩 에이전트 (Coding agent)

주요 기능 (Features): 강력한 추론 능력 및 비용 효율성, 코드 생성 및 이해
컨텍스트 (Context): 200K 토큰
가격 (Pricing): 월 $3(GLM Coding Lite)부터 월 $30(GLM Coding Max)까지, 첫 달 50% 할인
설치 (Installation): 빠른 시작 가이드 (Quick Start Guide) 참조

데이터베이스 및 배포 (Database & Deployment):

Supabase: 프로덕션 준비가 된 PostgreSQL 데이터베이스를 프로젝트에 직접 연결합니다.
Vercel: 원클릭 배포 (one-click deployment)로 작업물을 즉시 게시합니다.

추가 구독 비용은 없으며, 오직 당신만을 위해 구축되었습니다.

시작하기 전에 다음 항목들이 설치되어 있는지 확인하십시오:

• Node.js 18 이상
• Claude Code 또는 Cursor CLI (이미 로그인된 상태)
• Git

몇 분 안에 로컬 머신에서 Claudable을 실행하십시오:

# 저장소 복제 (Clone the repository)
git clone https://github.com/opactorai/Claudable.git
cd Claudable
...

애플리케이션은 http://localhost:3000 에서 사용할 수 있습니다.

참고: 포트 (Ports)는 자동으로 감지됩니다. 기본 포트가 사용 중인 경우, 사용 가능한 다음 포트가 할당됩니다.

데이터베이스 마이그레이션 충돌 (Database migration conflicts): 이전 Claudable 버전에서 업그레이드한 후 데이터베이스 오류가 발생하면, 최신 스키마 (Schema)와 일치하도록 Prisma 데이터베이스를 초기화하십시오. 이 명령은 로컬 데이터베이스를 삭제하고 다시 생성하므로, 실행하기 전에 필요한 데이터를 백업하십시오.

npm run prisma:reset

npm install 명령은 전체 설정을 자동으로 처리합니다:

포트 구성 (Port Configuration): 사용 가능한 포트를 감지하고 .env 파일을 생성합니다.
의존성 (Dependencies): 필요한 모든 Node.js 패키지를 설치합니다.
데이터베이스 설정 (Database Setup): 첫 실행 시 data/cc.db에 SQLite 데이터베이스를 자동 생성합니다.

Claudable을 데스크톱 애플리케이션으로 빌드하고 실행하십시오:

# 개발 모드 (Development mode)
npm run dev:desktop
# 데스크톱 앱 빌드 (Build desktop app)
...

npm run db:backup # SQLite 데이터베이스 백업 생성
# 사용 시점: 주요 변경 사항 적용 또는 배포 전
# 생성 파일: data/backups/cc_backup_[timestamp].db
...

Claude Code 연결: Claude Code CLI를 연결하여 AI 지원을 활성화합니다.
프로젝트 설명: 자연어를 사용하여 구축하고자 하는 내용을 설명합니다.
AI 생성: AI가 프로젝트 구조와 코드를 생성하는 과정을 지켜봅니다.
라이브 프리뷰 (Live Preview): 핫 리로드 (Hot reload) 기능을 통해 변경 사항을 즉시 확인합니다.
배포 (Deploy): Vercel 연동을 통해 프로덕션 (Production) 환경으로 푸시합니다.

Claudable은 로컬 개발을 위해 SQLite를 사용합니다. 데이터베이스는 첫 실행 시 자동으로 초기화됩니다.

애플리케이션은 사용 가능한 포트를 자동으로 찾습니다. 어떤 포트가 할당되었는지 확인하려면 .env 파일을 확인하십시오.

# 모든 의존성을 삭제하고 재시도
npm run clean
npm install

만약 다음과 같은 오류가 발생한다면: Error output dangerously skip permissions cannot be used which is root sudo privileges for security reasons

해결 방법:

• sudo를 사용하거나 root 사용자로 Claude Code를 실행하지 마십시오.

• WSL에서 적절한 파일 소유권을 확인하십시오:

# 현재 사용자 확인
whoami

# 프로젝트 디렉토리의 소유권을 현재 사용자로 변경
sudo chown -R $(whoami):$(whoami) ~/Claudable

• WSL을 사용하는 경우, root가 아닌 사용자 계정으로 Claude Code를 실행하고 있는지 확인하십시오.
• Claude Code 설치 권한을 확인하십시오:
  # sudo 없이 Claude Code 재설치 npm install -g @anthropic-ai/claude-code --unsafe-perm=false

토큰 가져오기 (Get Token): GitHub Personal Access Tokens → Generate new token (classic) → repo 스코프 (scope) 선택

연결하기 (Connect): Settings → Service Integrations → GitHub → 토큰 입력 → 리포지토리(repository) 생성 또는 연결

토큰 가져오기 (Get Token): Vercel 계정 설정 (Account Settings) → 토큰 생성 (Create Token)

연결하기 (Connect): Settings → Service Integrations → Vercel → 토큰 입력 → 배포를 위한 새 프로젝트 생성

자격 증명 가져오기 (Get Credentials): Supabase 대시보드 (Dashboard) → 프로젝트 (Your Project) → 설정 (Settings) → API

• 프로젝트 URL (Project URL):
  https://xxxxx.supabase.co

• Anon Key: 클라이언트 측 (client-side)을 위한 공개 키 (Public key)

• Service Role Key: 서버 측 (server-side)을 위한 비밀 키 (Secret key)

MIT License.

이 기능들은 현재 개발 중이며 곧 공개될 예정입니다.

네이티브 MCP 지원 (Native MCP Support)

• 에이전트 (agent) 역량 강화를 위한 Model Context Protocol 통합

채팅 체크포인트 (Checkpoints for Chat)

• 대화 및 코드베이스 (codebase) 상태 저장 및 복구

강화된 에이전트 시스템 (Enhanced Agent System)

• 서브 에이전트 (Subagents), AGENTS.md 통합

웹사이트 클로닝 (Website Cloning)

• 참조 URL로부터 프로젝트 시작 가능

• 다양한 버그 수정 및 커뮤니티 PR (Pull Request) 병합

여러분이 요청하신 기능들을 제공하기 위해 열심히 노력하고 있습니다. 계속 지켜봐 주세요!