Claude Code에서 앱을 배포하는 방법

Claude Code에서 한 세션에 앱을 배포하세요. MCP나 플러그인으로 Fine Structure를 연결해 호스팅, 데이터베이스, 인증, 도메인까지 갖추세요.

이 가이드가 필요한 사람

Claude Code에서 작업하며 방금 만든 프로젝트를 호스팅과 데이터와 인증까지 정리된 상태로 라이브에 올리고 싶은 빌더.

이 가이드에서 얻을 수 있는 것

- Claude Code에서 라이브 URL까지 한 세션에 이어지는 실제로 작동하는 배포 경로

- 플랫폼이 대신 호스팅해 주는 것에 대한 명확한 그림: 페이지, 데이터베이스, 인증, 도메인

- 정적 호스트가 더 나은 선택인 때를 가려내는 정직한 기준

Claude Code에서 배포한다는 것은 실제로 무슨 뜻일까요?

Claude Code에서 앱을 배포하려면 앱을 호스팅할 수 있는 runtime에 Claude를 연결해야 합니다. Fine Structure에는 두 가지 입구가 있습니다. claude.ai 설정에서 https://finestructure.ai/api/mcp를 커스텀 커넥터로 추가하고 OAuth 화면을 승인하거나, 오픈소스 플러그인을 /plugin marketplace add finestructure-ai/claude-plugin 다음 /plugin install finestructure@finestructure로 설치하면 됩니다. 그다음 Claude는 create_app으로 완성된 앱을 생성하거나, 기존 프로젝트를 파일 단위로 플랫폼 runtime에 이식합니다. 결과물은 호스팅되는 React 페이지로 실행되며 관리형 데이터베이스, 인증, 커스텀 도메인, 저장 버전 롤백이 함께 제공됩니다. 무료 등급은 카드가 필요 없습니다. 생성은 크레딧을 쓰지만 편집과 게시와 도메인은 무료입니다.

Claude Code는 애플리케이션을 만들어 내는 데는 아주 뛰어나고, 그것을 실행하는 데는 완전히 무력합니다. 세션이 끝나면 디스크에 폴더 하나가 남습니다. React 컴포넌트, 대화하는 동안 모양을 잡은 데이터 모델, 그리고 어딘가에 서버가 있다고 조용히 가정하는 인증 흐름입니다. 배포는 그 폴더가 URL을 얻고, 뒤에 데이터베이스가 붙고, 다른 사람도 통과할 수 있는 로그인을 갖추는 순간입니다.

이 단계의 흔한 대답은 배관 작업입니다. 저장소에 올리고, CI를 연결하고, 다른 곳에 데이터베이스를 띄우고, 인증 서비스를 붙이고, DNS를 가리키고, 인증서를 기다립니다. 하나하나는 합리적이지만 합치면 오후 한나절이 사라집니다. 다른 대답은 그 조각들을 이미 갖춘 runtime에 Claude Code가 직접 접근하게 하는 것입니다. 그러면 배포는 같은 대화 안의 도구 호출 한 번이 됩니다.

솔직한 설명: 저희 플랫폼은 기존 스택 위에 볼트로 조여 붙인 배포 버튼이 아닙니다. 이것은 runtime이고, 앱은 그 안으로 이사합니다. 이건 진짜 거래입니다. 호스팅과 데이터베이스와 인증과 도메인을 직접 조립하지 않고 얻는 대신, 서버 계층에 대한 통제권을 내려놓습니다.

Claude를 Fine Structure에 어떻게 연결하나요?

경로는 둘, 목적지는 하나입니다. 같은 계정, 같은 앱들이죠. 작업 대부분이 claude.ai에서 이뤄진다면 커넥터를 고르세요. 터미널에서 살고 배포 명령이 코드 옆에 있기를 원한다면 플러그인을 고르세요.

경로 1: MCP 커넥터: claude.ai에서 설정을 열고 Add custom connector를 선택한 뒤 URL 자리에 https://finestructure.ai/api/mcp를 붙여 넣고 OAuth 화면을 승인합니다. 클릭 한 번이면 끝이고, API key도 없고 설정 파일에 영원히 남는 환경 변수도 없습니다. 그때부터 Claude는 약 70개의 도구를 봅니다. 앱 생성, 파일 쓰기, entities, 게시, 도메인, 분석입니다.

경로 2: 오픈소스 Claude Code 플러그인: /plugin marketplace add finestructure-ai/claude-plugin을 실행하고, 이어서 /plugin install finestructure@finestructure를 실행합니다. 그러면 세션에 /deploy와 /fs-status와 /fs-domain이 추가됩니다. 소스가 공개되어 있으므로 설명을 믿는 대신 설치 전에 무엇을 보내는지 직접 읽어 볼 수 있습니다.

디렉터리 등록에 관해: 디렉터리 등록 신청은 아직 심사 중입니다. 심사가 끝나기 전까지 커넥터나 플러그인을 공식, 검증됨, 등록됨이라고 부르지 않겠습니다. 설치할 이유는 주소가 공개되어 있고 소스를 읽을 수 있다는 점이지, 이름 옆의 배지가 아닙니다.

새 앱을 생성할까요, 이미 있는 프로젝트를 옮길까요?

배포 방식은 두 가지입니다. 하나는 한 문장에서 시작합니다. create_app은 짧은 설명을 받아 페이지, entities 스키마, 인증 연결, 동작하는 URL을 갖춘 완성된 애플리케이션을 만들어 냅니다. 아이디어가 아직 물렁하고 가장 빨리 이해하는 방법이 직접 보는 것일 때 쓰는 빠른 길입니다. 생성은 크레딧을 소모하며, 이 흐름에서 유일하게 과금되는 부분입니다.

두 번째 방식은 이미 가지고 있는 프로젝트를 이식합니다. Claude가 파일을 읽고 하나씩 플랫폼 runtime에 맞게 다시 씁니다. 페이지는 플랫폼 페이지가 되고, 데이터 모델은 entities가 되고, 인증 호출은 플랫폼 인증으로 바뀝니다. 이것은 이식이지 맹목적인 업로드가 아닙니다. 내가 통제하는 서버를 전제했던 파일은 모두 runtime에 맞춰 다시 쓰이며, 바로 그 지점에서 Claude Code가 제 값을 합니다.

현실적인 첫 세션의 모습: 먼저 Claude에게 앱을 만들어 달라고 하고, 미리보기를 열고, 페이지가 의도한 모습이 될 때까지 같은 대화 안에서 파일을 계속 고칩니다. 파일 편집과 게시는 크레딧을 쓰지 않으므로 생성 이후의 다듬기 루프는 무료입니다. 괜찮아 보이면 게시하고, 도메인을 붙이고, TLS는 알아서 해결되게 두면 됩니다.

정적 호스팅에 배포하는 것과 비교하면 어떤가요?

정적 호스트는 자기 영역에서 아주 훌륭합니다. 결과물이 프런트엔드 번들뿐이라면 저희보다 더 빠르고 더 싸게, 더 큰 생태계와 함께 서빙해 줄 것입니다. 비교가 흥미로워지는 시점은 앱에 상태와 사용자와 되돌아갈 길이 필요해질 때입니다.

앱에 필요한 것 | Fine Structure | 정적 배포 대상

호스팅 | 플랫폼 runtime에서 제공되는 호스팅형 React 페이지 | 프런트엔드 순수 속도는 최고, 생태계도 가장 넓음

데이터베이스 | 관리형 entities, 첫 배포 전에 이미 준비됨 | 직접 준비해서 별도로 구축하고 연결

인증 | 기본 내장, 세션과 앱별 사용자 포함 | 자체 인증 서비스나 외부 제공자를 준비

도메인 | 자동 TLS가 적용된 커스텀 도메인 | 자동 TLS가 적용된 커스텀 도메인, 성숙한 절차

롤백 | 앱의 저장된 버전을 복원 | 이전 build를 다시 배포하거나 commit을 되돌림

에이전트 | 일정에 따라 계속 일하는 AI 에이전트 | 포함되지 않음, 다른 곳에서 실행해야 함

저희가 잘못된 선택인 경우: 다른 도구가 더 나은 세 가지 경우가 있고, 저희는 그걸 그대로 말합니다. 반드시 직접 소유해야 하는 서버 runtime, 예를 들어 Go 바이너리나 특정 시스템 라이브러리를 요구하는 Python worker. 다시 쓰지 않을 자체 백엔드를 가진 monorepo. 그리고 대규모 순수 정적 호스팅, 즉 데이터베이스 없는 CDN이 이기는 영역입니다.

첫 배포 이후에는 무엇을 얻나요?

배포는 일의 끝이 아닙니다. 앱이 의견 대신 사실을 만들어 내기 시작하는 지점입니다. 그곳에서 네 가지가 열리고, 그중 어느 것도 대화 밖으로 나갈 필요가 없습니다.

사람들이 놀라는 부분은 에이전트입니다. 여기서 에이전트는 페이지에 붙여 놓은 채팅 위젯이 아닙니다. 앱에 연결된 작업자이며, 노트북을 닫은 뒤에도 일정에 따라 계속 돌고, 앱 자신의 데이터를 읽고, 검증된 소유자에게 WhatsApp이나 이메일로 연락할 수 있습니다. 내가 확인하러 갈 때까지 기다리는 대신, 앱이 먼저 무슨 일이 있었는지 알려 줍니다.

생성 이후의 모든 일은 같은 Claude 세션 안에 남습니다. 파일을 고치고, 게시하고, 도메인을 확인하고, 분석을 읽고, 에이전트를 조정합니다. 무료 등급은 카드를 요구하지 않으므로, 이것을 정직하게 평가하는 방법은 작지만 진짜인 앱 하나를 Claude에게 맡기고 어디까지 가는지 보는 것입니다.

자주 묻는 질문

Claude Code가 혼자서 앱을 배포할 수 있나요?

혼자서는 못 합니다. Claude Code는 파일을 쓰고 고칠 뿐이고, 그것을 호스팅할 대상이 필요합니다. 저희 MCP 커넥터를 추가하거나 플러그인을 설치하면 배포가 도구 호출이 됩니다. 앱 생성, 파일 쓰기, 게시, 도메인 연결입니다.

Fine Structure의 MCP 서버 주소는 무엇인가요?

https://finestructure.ai/api/mcp입니다. claude.ai에서 설정을 열고 Add custom connector를 선택한 뒤 이 주소를 붙여 넣고 OAuth 화면을 승인하세요. 복사할 API key가 없고, 그때부터 Claude는 약 70개의 도구를 봅니다.

Claude Code 배포 플러그인은 어떻게 설치하나요?

/plugin marketplace add finestructure-ai/claude-plugin을 실행하고 이어서 /plugin install finestructure@finestructure를 실행하세요. /deploy와 /fs-status와 /fs-domain을 얻습니다. 플러그인은 오픈소스이고 디렉터리 등록 신청은 심사 중이라 공식이라고 주장하지 않습니다.

무료 등급이 있나요? 신용카드가 필요한가요?

무료 등급이 있고 카드를 요구하지 않습니다. 앱을 생성할 때는 크레딧이 듭니다. 파일 편집과 게시와 커스텀 도메인은 들지 않습니다.

새로 만드는 대신 기존 React 프로젝트를 배포할 수 있나요?

네. Claude가 파일 단위로 플랫폼 runtime에 이식합니다. 페이지는 플랫폼 페이지가 되고, 데이터 모델은 entities가 되고, 인증 호출은 다시 쓰입니다. 업로드가 아니라 이식이므로 파일의 형태가 바뀐다고 예상하시면 됩니다.

플랫폼이 HTTPS와 커스텀 도메인을 처리하나요?

네. 커스텀 도메인을 추가하면 TLS가 자동으로 발급됩니다. 터미널에서 /fs-domain을 쓰거나, MCP 커넥터를 통해 Claude에게 요청하세요.

배포가 앱을 망가뜨리면 어떻게 하나요?

저장된 버전을 복원하세요. 롤백은 앱을 이전 저장 상태로 되돌리며, 대개 운영 환경에서 변경을 진단하는 것보다 빠르고 비교할 수 있는 동작 기준을 줍니다.

이 도구가 맞지 않는 경우는 언제인가요?

반드시 직접 소유해야 하는 서버 runtime이 필요할 때입니다. 예를 들어 Go 바이너리나 특정 시스템 라이브러리를 요구하는 Python worker입니다. monorepo가 자체 백엔드를 유지할 때도 그렇습니다. 또는 대규모 순수 정적 호스팅을 원할 때, 데이터베이스 없는 CDN이 이기는 경우입니다.