/Bubble Development Agency

Bubble.io와 Firebase 통합: 단계별 가이드 2024

앱에서 실시간 데이터 처리를 위해 Bubble.io를 Firebase와 어떻게 통합하는지 배워보세요. 초기 설정부터 기능 테스트까지 간단한 단계별 가이드.

Firebase란 무엇인가요?

Firebase는 Google이 웹, 안드로이드, iOS 애플리케이션을 개발하기 위해 개발한 플랫폼입니다. 이는 분석 추적, 앱 충돌 보고 및 수정, 마케팅 및 제품 실험을 수행하기 위한 도구를 제공합니다. Firebase의 주요 기능은 개발자가 다른 클라이언트 간에 데이터를 저장하고 동기화하도록 허용하는 API를 제공하는 실시간 데이터베이스입니다. 게다가, 이는 사용자 인증, 클라우드 스토리지, 호스팅, 기계 학습 등의 서비스를 포함합니다.

Matt Graham, CEO of Rapid Developers

Book a call with an Expert

Starting a new venture? Need to upgrade your web or mobile app? RapidDev builds Bubble apps with your growth in mind.

Book a free No-Code consultation

Bubble.io와 Firebase을 통합하는 방법은 무엇인가요?

Bubble.io와 Firebase를 통합하면 애플리케이션에서 실시간 데이터 처리를 빠르고 효과적으로 용이하게 할 수 있습니다. 다음은 이를 달성하기 위한 단계별 가이드입니다:

단계 1: Firebase 프로젝트 생성

  • Firebase 계정에 로그인하거나, 계정이 없는 경우 새로 만듭니다.
  • 프로젝트 만들기를 클릭합니다.
  • 프로젝트 이름과 같은 프로젝트에 필요한 세부 정보를 입력하고, 이용 약관에 동의한 다음 프로젝트 만들기를 클릭합니다. 설정이 완료되는 데 약간의 시간이 걸릴 수 있습니다.

단계 2: Firebase에서 실시간 데이터베이스 설정

  • Firebase 프로젝트가 생성된 후, 왼쪽 메뉴에서 개발 섹션으로 이동합니다.
  • 데이터베이스를 선택한 다음, 서버가 없는 NoSQL 데이터베이스에 대한 실시간 데이터베이스를 선택합니다.
  • 실시간 데이터베이스 섹션에서 데이터베이스 생성을 클릭합니다.
  • 다음에 표시되는 대화 상자에서 Cloud Firestore 위치를 선택합니다. 이 위치는 Firebase 프로젝트의 모든 Firestore 데이터베이스에 사용됩니다.

단계 3: Firebase 데이터베이스 규칙 구성

  • 데이터베이스 섹션에서 규칙을 찾을 수 있습니다. 프로젝트 요구에 따라 필요한 규칙을 설정하십시오.
  • 예를 들어, .read.write를 모두 true로 설정하여 규칙을 공개로 설정할 수 있습니다. 이렇게 하면 읽기 및 쓰기 작업이 모두 공개됩니다. 제품 수준의 애플리케이션에는 적절한 보안 규칙이 있어야 합니다.

단계 4: Firebase에서 구성 얻기

  • 실시간 데이터베이스 설정을 마친 후, 프로젝트의 설정으로 이동합니다. 이를 위해, 프로젝트 개요 옆의 작은 톱니바퀴 아이콘을 클릭합니다.
  • 프로젝트 설정을 클릭한 다음 서비스 계정을 선택합니다.
  • 여기서 새 개인 키 생성을 선택하고 프롬프트를 확인합니다.

JSON 파일이 다운로드되고, 이in는 project_id, private_key_id, private_key, client_email, client_id, auth_uri, token_uri, auth_provider_x509_cert_url, client_x509_cert_url과 같은 정보를 포함합니다.

이 파일에는 민감한 정보가 포함되어 있으므로 안전하게 보관하십시오.

단계 5: Bubble.io에서 새 앱 생성

  • 이제 Bubble로 이동합니다. 계정에 로그인하거나, 가입하지 않은 경우 가입합니다.
  • 대시보드에서 새 앱을 클릭합니다.
  • 앱에 이름을 지정하고, 필요한 상자를 체크한 다음 새 앱 생성을 클릭합니다.

단계 6: Zeroqode Firebase 플러그인 설치

  • Bubble 대시보드에서 새로 생성한 앱을 열고, 왼쪽 사이드바에서 플러그인을 클릭합니다.
  • 플러그인 페이지에서 플러그인 추가를 클릭합니다.
  • 플러그인 마켓에서 검색하여 Zeroqode의 Firebase 플러그인을 설치합니다.

단계 7: Zeroqode Firebase 플러그인 구성

  • 플러그인을 추가한 후, Firebase 플러그인 설정에서 Api Key를 JSON 파일에서 얻은 private_key로 업데이트합니다.
  • Firebase Urlhttps://[PROJECT_ID].firebaseio.com으로 설정합니다. 여기서 PROJECT_ID는 다운로드한 JSON 파일에서 가져옵니다.
  • Firebase User Email을 JSON 파일에서 얻은 client_email로 설정합니다.

변경 사항을 저장하는 것을 잊지 마세요.

단계 8: Bubble.io에서 Firebase 사용

이제 Firebase 플러그인이 구성되어 Bubble 앱에서 사용할 준비가 되었습니다. 워크플로우에서의 작업이나 데이터 가져오기에 사용할 수 있습니다.

플러그인을 사용할 때, Firebase 데이터베이스 URL을 참조하십시오, /[your_reference_here].

Firebase 실시간 데이터베이스에서 설정한 규칙에 따라 요청에 올바른 권한을 사용하는 것을 잊지 마십시오.

이제 Bubble.io와 Firebase를 성공적으로 통합하였습니다. 통합이 예상대로 작동하는지 확인하기 위해 모든 기능을 테스트하십시오.

Bubble.io와 Firebase 통합 사용 사례

시나리오: 스타트업이 Bubble.io를 사용하여 모바일 앱을 개발하여 사용자가 지역 커뮤니티 이벤트에 대한 정보를 공유할 수 있게 했습니다. 사용자는 프로필을 생성하고, 다가오는 이벤트에 대해 게시하고, 다른 사용자의 게시물과 상호작용할 수 있습니다. 스타트업은 이 사용자 데이터를 안전하게 저장하고자 하며, Firebase를 사용한 사용자 인증을 통해 특정 기능에 대한 접근 권한을 보유한 사용자만 접근할 수 있도록 하고자 합니다.

솔루션: Bubble.io와 Firebase 통합

모바일 앱 생성: 스타트업은 Bubble.io를 사용하여 직관적인 사용자 인터페이스를 가진 모바일 앱을 생성합니다. 이 앱에는 프로필 생성, 사용자 게시물, 댓글 섹션이 포함됩니다.

통합 설정: 스타트업은 Bubble.io에 Firebase 플러그인을 설치하고 Firebase API 키로 구성합니다. 그런 다음 Bubble.io에서 사용자 앱 활동에 기반한 특정 Firebase 액션을 트리거하는 워크플로우를 설정합니다.

사용자 인증 워크플로우: 사용자가 프로필을 생성하거나 로그인할 때 Bubble.io는 Firebase 인증 워크플로우를 트리거합니다. Firebase는 사용자 인증 정보를 검증하고 사용자를 로그인 시키거나, 잘못된 인증 정보에 대한 오류 응답을 보냅니다. 이를 통해 등록된 사용자만 앱의 특정 기능에 액세스할 수 있습니다.

Firebase에서의 데이터 저장: 프로필 정보와 사용자 게시물과 같은 사용자 데이터는 Bubble.io 앱을 통해 사용자가 제출하면 Firebase에 자동으로 저장됩니다.

데이터 동기화: Firebase에 저장된 데이터는 Bubble.io 앱과 계속 동기화됩니다. 이를 통해 사용자가 프로필을 업데이트하거나 새 게시물을 생성할 때, 변경 사항이 앱의 모든 사용자에게 실시간으로 업데이트됩니다.

사용자 참여 추적: Firebase 이벤트 추적 기능을 사용하면 스타트업이 앱에서 특정 사용자 액션을 추적할 수 있습니다. 이는 앱 사용 및 사용자 참여 추세를 분석하는 데 도움이 될 수 있습니다.

장점:

강화된 보안: Firebase의 강력한 인증 시스템은 앱의 사용자 기반을 안전하게 유지하여 사용자 데이터를 보호하는 데 도움이 됩니다.

실시간 데이터 동기화: Firebase의 실시간 데이터베이스 기능을 활용하면 모든 사용자에게 빠르고 원활한 데이터 동기화가 가능해지어, 사용자 경험을 개선할 수 있습니다.

데이터 인사이트: Firebase의 내장 분석 기능을 통해 스타트업은 사용자의 행동을 이해하고 그에 맞게 앱을 조정할 수 있습니다.

Bubble.io를 Firebase와 통합함으로써 스타트업은 사용자 데이터를 안전하게 보호하고 무단 접근을 방지하는 것뿐만 아니라, 실시간 동기화를 통해 모든 기기에서 원활한 사용자 경험을 제공하게 됩니다.

더 유용한 노코드 리소스 살펴보기

No-Code Tools Reviews

Delve into comprehensive reviews of top no-code tools to find the perfect platform for your development needs. Explore expert insights, user feedback, and detailed comparisons to make informed decisions and accelerate your no-code project development.

Explore

WeWeb Tutorials

Discover our comprehensive WeWeb tutorial directory tailored for all skill levels. Unlock the potential of no-code development with our detailed guides, walkthroughs, and practical tips designed to elevate your WeWeb projects.

Explore

No-Code Tools Comparison

Discover the best no-code tools for your projects with our detailed comparisons and side-by-side reviews. Evaluate features, usability, and performance across leading platforms to choose the tool that fits your development needs and enhances your productivity.

Explore
Want to Enhance Your Business with Bubble?

Then all you have to do is schedule your free consultation. During our first discussion, we’ll sketch out a high-level plan, provide you with a timeline, and give you an estimate.

Book a free consultation

By clicking “Accept”, you agree to the storing of cookies on your device to enhance site navigation, analyze site usage, and assist in our marketing efforts. View our Privacy Policy for more information.

Cookie preferences