콘텐츠로 이동

Stripe, Twilio 등 외부 서비스 연결하기

핵심 요약커넥터는 외부 서비스를 앱에 연결합니다. 결제는 Stripe, 문자 메시지는 Twilio, 내 이메일 도메인은 Resend 등으로 연결할 수 있습니다. 대화창에서 기능을 요청하면 MonstarX가 키를 입력할 카드를 띄웁니다. 백엔드 → 클라우드 → 커넥터에서 연결을 클릭해도 됩니다. 아직 키가 없다면 나중에를 클릭하세요. MonstarX가 그래도 모든 것을 만듭니다.

앱에는 이미 데이터베이스, 계정, 이메일, 파일 저장소, AI가 들어 있습니다. 그 밖의 모든 것은 커넥터로 더합니다. Stripe로 결제를 받고, Twilio로 문자 메시지를 보내고, Firecrawl로 어떤 웹사이트에서든 데이터를 가져오는 식입니다. 커넥터 하나는 외부 서비스 하나를 앱 하나에 연결하며, 그 서비스에 있는 내 계정의 키를 씁니다. 키는 서비스가 API용으로 발급하는 비밀번호 같은 값입니다.

직접 찾아다닐 일은 거의 없습니다. 서비스가 필요한 기능을 요청하면(“회원이 수업 이용권을 살 수 있게 해 주세요”) MonstarX가 코드를 작성하고 대화창에서 바로 키를 요청합니다.

앱에 어떤 서비스를 연결할 수 있나요?

섹션 제목: “앱에 어떤 서비스를 연결할 수 있나요?”

아래 커넥터는 앱이 사용자를 위해 하는 일에 쓰입니다. 모두 백엔드클라우드의 커넥터 목록에 있습니다.

커넥터앱에서 할 수 있는 일붙여 넣을 값
Stripe결제, 구독, 체크아웃. 샌드박스(테스트) 키 또는 프로덕션(라이브) 키를 씁니다.비밀 키, 공개 키, 웹훅 서명 시크릿(선택 사항)
TwilioSMS와 WhatsApp 메시지 발송, 음성 통화계정 SID, 인증 토큰, 발신 번호
ResendMonstarX Email 대신 내 도메인으로 이메일 발송API 키, 발신 주소
OpenAIMonstarX AI 대신 내 OpenAI 키 사용API 키
OpenRouterMonstarX AI 대신 내 OpenRouter 키 사용(모든 모델)API 키
Google Maps장소 검색과 자동 완성, 업체 상세 정보, 운전 경로API 키
Mapbox지오코딩(주소를 지도 위치로 바꾸기), 경로 안내, 위성 지도를 포함한 Mapbox 지도 스타일공개 액세스 토큰
Firecrawl어떤 웹사이트든 깔끔한 텍스트나 정해진 형식의 데이터로 변환(스크래핑, 크롤링, 검색)API 키
Zernio앱 사용자의 소셜 계정(X, Instagram, Facebook, LinkedIn, TikTok, YouTube 등)을 연결해 게시물 올리기나 예약API 키
ElevenLabs텍스트 음성 변환과 음성 생성API 키
Google AnalyticsGA4로 페이지 조회수와 이벤트 집계측정 ID

더 큰 역할을 하는 커넥터는 별도 페이지에서 설명합니다.

  • Supabase와 Railway는 앱 데이터를 내 Postgres 데이터베이스에 보관할 수 있습니다. Supabase와 Railway를 참고하세요.
  • Firebase는 내 Firestore, 로그인, 파일 저장소, 푸시 알림을 앱에 제공합니다. Firebase를 참고하세요.
  • Cloudflare는 앱 전체를 내 Cloudflare 계정에서 실행합니다. 내 Cloudflare 계정을 참고하세요.
  • Azure, AWS, Vercel, Google Cloud는 앱을 게시할 수 있는 곳입니다. 다른 호스팅에 게시하기를 참고하세요.

대화창에서 서비스를 어떻게 연결하나요?

섹션 제목: “대화창에서 서비스를 어떻게 연결하나요?”

“Stripe로 수업 이용권을 결제할 수 있게 해 주세요”처럼 원하는 기능을 쉬운 말로 요청하세요. MonstarX가 기능을 만들고, 서비스가 필요한 이유와 함께 연결을 요청하는 카드를 띄웁니다.

  1. 카드를 읽어 보세요. 키를 찾을 수 있는 곳을 클릭하면 키가 어디에 있는지 설명하는 해당 서비스의 페이지가 열립니다.

  2. Stripe라면 환경을 고르세요. 기능을 시험하는 동안에는 샌드박스(테스트 키), 실제 고객이 결제할 때는 프로덕션(라이브 키)를 고릅니다.

  3. 입력란에 키를 붙여 넣고 Stripe 연결을 클릭하세요. 버튼에는 항상 서비스 이름이 들어갑니다.

  4. 카드가 초록색으로 바뀌고 Stripe 연결 완료가 표시됩니다. 미리보기가 키를 반영해 다시 시작되므로 바로 기능을 써 볼 수 있습니다.

서비스는 프로젝트 소유자만 연결할 수 있습니다. 다른 사람이 프로젝트를 보면 카드에 “프로젝트 소유자만 연결할 수 있습니다.”라고 표시됩니다.

나중에를 클릭하세요. 카드가 “Stripe · 나중에 연결”이라는 한 줄로 접히고, MonstarX는 그래도 모든 것을 만듭니다. 앱에서 서비스가 필요한 곳에는 앱이 깨지는 대신 “Stripe가 아직 연결되지 않았습니다” 같은 분명한 안내가 표시됩니다. 키가 준비되면 언제든 지금 연결을 클릭하세요.

이 선택은 프로젝트에 저장되므로, 연결할 때까지 어느 기기에서 보든 카드가 접힌 채로 있습니다.

그 서비스 없이는 MonstarX가 진행할 수 없다면요?

섹션 제목: “그 서비스 없이는 MonstarX가 진행할 수 없다면요?”

“내 Stripe 상품을 가져와 주세요”처럼 요청 전체가 내 계정의 내용에 달려 있을 때가 있습니다. 이때는 카드가 주황색으로 표시되고, MonstarX가 작업을 계속하려면 Stripe 연결이 필요합니다라는 문구가 나오며, 나중에 버튼이 없습니다. MonstarX는 서비스가 필요 없는 부분을 먼저 만들고 기다립니다. 연결하는 즉시 알아서 작업을 이어 갑니다.

백엔드 탭에서 서비스를 어떻게 연결하나요?

섹션 제목: “백엔드 탭에서 서비스를 어떻게 연결하나요?”
  1. 프로젝트를 열고 상단 바에서 백엔드를 클릭한 다음 클라우드를 클릭하세요.

  2. 커넥터까지 스크롤해서 서비스 옆의 연결을 클릭하세요.

  3. 입력란을 채우세요. 선택 입력란에는 “(선택 사항)”이 붙어 있고, 많은 입력란 아래에 도움말이 한 줄씩 있습니다.

  4. 서비스 이름이 붙은 연결 버튼(예: Stripe 연결)을 클릭하세요.

연결된 서비스에는 초록색 연결됨 표시가 붙습니다(Stripe는 연결됨 · 샌드박스 또는 연결됨 · 프로덕션). 버튼도 두 개 생깁니다.

  • 키 업데이트: 키를 하나 이상 바꿉니다. 현재 값을 유지하려면 입력란을 비워 두세요.
  • 연결 해제: 이 앱에서 서비스와 키를 삭제합니다.

각 커넥터 옆의 작은 화살표 아이콘을 클릭하면 해당 서비스의 공식 문서가 열립니다.

앱이 아직 기다리는 서비스는 어떻게 알 수 있나요?

섹션 제목: “앱이 아직 기다리는 서비스는 어떻게 알 수 있나요?”

앱 코드가 아직 연결되지 않은 서비스를 쓰면 MonstarX가 알아차리고 세 곳에서 알려 줍니다.

  • 백엔드 → 클라우드에서 그 커넥터가 맨 위에 나오며 앱에서 사용 중 · 나중에 연결, 앱에서 사용 중 · 연결되지 않음, 계속하려면 필요함 중 하나로 표시됩니다.
  • 게시에 주황색 점이 붙고, 안에 “Stripe 및 Twilio 서비스가 아직 연결되지 않았습니다” 같은 안내와 서비스별 연결 버튼이 나옵니다. 게시는 할 수 있지만, 키를 넣기 전까지 그 부분은 누구에게도 작동하지 않습니다.
  • QA 테스트는 서비스가 필요한 단계까지 흐름을 확인하고, 그 단계를 실패로 처리하는 대신 키가 필요하다고 표시합니다. QA 테스트를 참고하세요.

서비스를 쓰던 기능을 없애면 안내도 저절로 사라집니다.

키는 STRIPE_SECRET_KEY처럼 정해진 이름으로 앱과 함께 암호화되어 저장됩니다. 백엔드시크릿에서 직접 추가한 키와 함께 이름을 볼 수 있습니다(값은 볼 수 없습니다). 시크릿을 참고하세요.

  • 비밀 키는 앱 서버에서만 쓰입니다. 앱 방문자는 볼 수 없습니다.
  • Stripe 공개 키, Google Maps 키, Google Analytics 측정 ID 같은 공개 키는 원래 브라우저에서 쓰도록 만들어진 키입니다. 이런 키는 브라우저에서 써도 안전하며, 서비스가 키를 두 종류로 나눠 주는 이유도 이 때문입니다.
  • 키는 앱 하나에만 속합니다. 내 다른 앱은 이 키를 볼 수 없습니다.

기본 서비스 대신 내 서비스를 쓸 수 있나요?

섹션 제목: “기본 서비스 대신 내 서비스를 쓸 수 있나요?”

네. 일부 커넥터는 MonstarX Cloud 서비스를 대신하도록 만들어졌으며, 목록에 MonstarX … 대체라고 표시됩니다.

기본 서비스대신 쓸 서비스
이메일(MonstarX 메일 도메인으로 발송)Resend: 내 도메인으로 발송
AI(예비 모델이 있는 관리형 모델)OpenAI 또는 OpenRouter: 요금은 내 계정에 청구
데이터베이스Supabase. Railway Postgres에는 표시가 없지만 데이터를 보관할 수 있습니다. Supabase와 Railway를 참고하세요.

대신 쓸 서비스를 연결한 뒤 “앱 이메일을 Resend로 보내 주세요”처럼 MonstarX에 그 서비스를 쓰라고 요청하세요. 앱에서 기본 서비스를 쓰는 부분이 더 이상 없으면 백엔드클라우드에서 이메일, AI, 웹 검색, 파일 저장소를 끌 수 있습니다. MonstarX Cloud 개요의 서비스 끄기 안내를 참고하세요.

  • 빌드는 키를 기다리지 않습니다. MonstarX는 서비스 문서를 보고 코드를 작성하므로, 키가 없어도 그 기능 하나만 작동하지 않을 뿐입니다.
  • 먼저 테스트하세요. Stripe 샌드박스 키를 쓰면 실제 돈 없이 테스트 카드로 결제를 해 볼 수 있습니다.
  • 요금은 내 계정에 청구됩니다. 연결한 서비스는 그 서비스의 요금 정책에 따라 내 계정에 요금을 청구합니다. MonstarX가 덧붙이는 요금은 없습니다.
  • MonstarX 자체를 위한 커넥터는 다릅니다. 업무 도구를 연결하면 MonstarX가 내 Google Sheets, HubSpot, Jira를 읽을 수 있고, MCP 커넥터는 MonstarX에 다른 도구를 줍니다.
Stripe를 연결하려면 코딩을 알아야 하나요?

아니요. 대화창에서 기능을 요청하고, MonstarX가 띄운 카드에 Stripe 키 두 개를 붙여 넣은 뒤 Stripe 연결을 클릭하세요. 코드는 MonstarX가 모두 작성합니다.

키가 없어도 앱을 만들 수 있나요?

네. 카드에서 나중에를 클릭하세요. MonstarX가 모든 것을 만들고, 서비스가 필요한 곳에는 아직 연결되지 않았다는 친절한 안내를 띄우며, 앱을 공개하기 전에 게시에서 다시 알려 줍니다.

키를 바꾸거나 지우려면 어디로 가야 하나요?

백엔드 → 클라우드 → 커넥터에서 서비스 옆의 키 업데이트나 연결 해제를 클릭하세요. 키 이름은 백엔드 → 시크릿에도 표시됩니다.

앱 사용자가 내 키를 볼 수 있나요?

비밀 키는 볼 수 없습니다. 비밀 키는 앱 서버에만 있습니다. Stripe 공개 키처럼 브라우저용으로 만들어진 공개 키만 페이지에 전달됩니다.

키는 미리보기와 게시된 앱에서 모두 작동하나요?

네. 연결하면 미리보기가 새 키로 다시 시작되고, 다음에 게시할 때 게시된 앱에도 키가 반영됩니다.

목록에 없는 서비스도 쓸 수 있나요?

네. MonstarX에 그 서비스를 연동해 달라고 요청한 뒤, 백엔드 → 시크릿에 직접 키를 넣으세요. 앱은 같은 방식으로 키를 읽습니다.