개요
Supabase는 데이터 영구 저장과 백엔드 기능을 제공하는 오픈 소스 백엔드 플랫폼입니다. MGX와 Supabase를 연결하면 브라우저 메모리에만 저장되어 새로 고침이나 종료 시 손실될 수 있는 데이터 문제를 해결할 수 있습니다. 이 통합을 통해 MGX에서 만든 웹사이트를 영구 저장과 고급 기능을 갖춘 완전한 애플리케이션으로 전환할 수 있습니다.
주요 장점 (개발 경험 불필요 외 3가지)
빠른 설정: 몇 분 만에 백엔드를 시작해 개발 속도를 가속화.
높은 확장성: 사용자 증가에 맞춰 프로젝트를 무제한 확장 가능.
비용 효율성: 소규모 프로젝트와 스타트업에 적합한 무료 플랜 제공.
MGX와 Supabase 연결 방법
통합 시작
MGX 프로젝트의 채팅 화면을 엽니다.
오른쪽 상단의 Supabase 탭에서 Connect Supabase 버튼 클릭.
안내에 따라 연결을 시작합니다.
인증 및 프로젝트 설정
팝업이 나타나면 Supabase 계정으로 로그인합니다.
드롭다운에서 조직을 선택합니다.
Authorize MGX를 클릭해 계정을 인증합니다. (수초 내 완료, 수동 설정 불필요)
기존 프로젝트를 선택하거나 +Add New One으로 새 프로젝트를 즉시 생성할 수 있습니다.
자동 구성
MGX가 데이터베이스 구조, 테이블, 보안 설정을 자동으로 가져옵니다.
“Supabase Connected” 알림이 표시되면 연결이 완료됩니다.
사용자 인증
Supabase Auth를 사용하면 앱에 인증 기능을 쉽게 추가할 수 있습니다. MGX는 다음 두 가지 방식을 지원합니다.
이메일 + 비밀번호
Google 소셜 로그인
이메일 + 비밀번호
유효한 Supabase 계정을 인증합니다.
채팅에 “인증 추가”와 같이 입력하면 Supabase Auth에 연결된 로그인/등록 페이지가 자동 생성됩니다.
MGX 화면 또는 Supabase 대시보드(Authentication → Users)에서 테스트 유저를 생성해 세션 지속 여부를 확인합니다.
Google 로그인
Supabase 대시보드 → Authentication → Sign In/Up에서 Google 옵션을 활성화합니다.
Google Cloud Console에서 새 프로젝트를 만들고 OAuth 자격 증명을 발급받습니다.
채팅에 “Google 인증 추가”라고 입력하면 로그인 페이지에 Google로 계속하기 버튼이 추가됩니다.
로그인 페이지에서 Google 계정으로 로그인 후 리디렉션이 정상 작동하는지 확인합니다.
데이터 저장 및 동기화
저장할 데이터를 채팅에 지시 (예: “새 여행 기록을 데이터베이스에 저장해 주세요”).
MGX가 필요한 데이터베이스 구조를 자동으로 설정합니다.
앱에서 데이터를 추가 및 새로 고침 후 Supabase에서 동기화 상태를 확인합니다.
Supabase Table Editor에서 수정한 데이터도 MGX 앱에 실시간으로 반영됩니다.
Edge Functions
Supabase Edge Functions는 사용자와 가까운 서버 노드에서 실행되는 서버리스 백엔드 프로그램입니다.
일반적 사용 예:
회원 가입 후 자동 환영 이메일 발송
폼 제출 시 AI API 호출 후 내용 분석
결제 시 Stripe 같은 외부 결제 게이트웨이 연동
일정 알림(메일/푸시) 자동 발송
MGX는 API 키를 안전하게 관리합니다. Add API Key 버튼을 눌러 키를 입력하면 Supabase에 암호화 저장되며, 실행 시 안전하게 주입됩니다.
백엔드 함수 추가 및 배포
채팅에 요청 입력 (예: “음식 사진을 업로드하면 칼로리를 추정하는 Gemini API를 호출하는 웹페이지를 만들어 주세요”).
생성된 코드 후 Add API Key 버튼으로 키 입력.
View in Edge Function을 클릭해 Supabase Edge Function 페이지에서 배포합니다.
자주 묻는 질문 (FAQ)
MGX 앱에 Supabase 기능을 추가하려면?
채팅 우측 상단의 인증 버튼으로 Supabase를 승인 → 프로젝트 선택 → 채팅에서 요구 사항을 공유하면 에이전트가 기능을 개발합니다.
Supabase는 소셜 로그인을 지원하나요?
예. 이메일+비밀번호, 일회용 비밀번호(OTP)·매직 링크, Google/Twitter/GitHub, 전화 인증, SAML SSO, 익명 로그인 등을 지원합니다.
앱마다 별도 Supabase 프로젝트가 필요한가요?
필요에 따라 기존 프로젝트를 선택하거나 새 프로젝트를 생성할 수 있습니다. 한 채팅은 한 프로젝트만 연결됩니다.
Remix 후에도 연결이 유지되나요?
아니요. Remix 후에는 연결이 끊어지며 재인증이 필요합니다. 다른 사용자가 App World에서 공유한 Supabase 연결 앱은 Remix 불가입니다.
하나의 Supabase 데이터베이스를 여러 MGX 프로젝트에서 사용할 수 있나요?
가능합니다. 단, 연결 및 설정을 신중히 관리해야 합니다.
조직 목록에 프로젝트가 보이지 않는 이유는?
무료 플랜에서는 7일간 활동이 없으면 프로젝트가 자동으로 일시 중지됩니다. MGX Organizations 목록에서 Inactive 필터로 확인하세요.
“The organization has been bound by another user” 오류가 표시될 때
Supabase는 각 조직과 MGX 계정 간 1:1 OAuth 바인딩을 요구합니다. Supabase 대시보드 → Settings → API → OAuth Apps에서 기존 MGX OAuth 권한을 삭제 후, MGX에서 자신의 계정으로 다시 연결하세요.