/Bubble Development Agency

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

간단한 단계로 Bubble.io를 Square와 통합하는 방법을 배우십시오: 두 플랫폼에서 계정을 설정하고, Square 앱 ID와 시크릿을 받고, Bubble에서 Square 플러그인을 설정하고, 결제 게이트웨이를 설정하십시오.

Square란 무엇인가요?

사각형은 목수 공예, 건설 및 기타 트레이드에서 일반적으로 사용되는 다용도 도구입니다. 이는 장인들이 직각(90도)에서 직선을 그리는 데 도움을 줌으로써 그들의 작업에서 정확성을 보장하기 위해 설계되었습니다. 조합 사각, 프레임 사각, 스피드 사각 등 가장 일반적인 디자인으로 제공됩니다. 예를 들어, 조합 사각형은 각도를 측정하고, 평탄성을 판단하며, 깊이를 측정할 수 있습니다. 사각형을 만드는 데 사용되는 재료는 다양하지만, 대부분은 내구성을 위해 금속으로 만들어집니다.

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와 Square을 통합하는 방법은 무엇인가요?

Bubble.io를 Square에 통합하는 것은 Square 계정을 설정하고, Bubble 애플리케이션을 구성하고, 두 플랫폼 간의 API 연결을 설정하는 여러 주요 단계를 포함합니다.

단계 1: Square 계정 생성

첫 번째 요구 사항은 Square에 활성화된 계정이어야 합니다. 계정이 없다면 Square 가입 페이지로 이동하여 프롬프트에 따라 하나를 생성합니다. 계정 생성이 성공적으로 완료되면 로그인합니다.

단계 2: Square App ID 및 Secret 획득

API 통합은 앱 ID와 앱 비밀번호가 필요하며, 이 둘은 Square에 의해 발급되어 귀하의 요청을 인증하는 고유 식별자입니다.

  • Square에 로그인한 후 "Applications" 대시보드로 이동합니다.
  • "New Application" 버튼을 클릭합니다.
  • 애플리케이션에 이름을 부여하고 "Create Application"을 클릭합니다.
  • 새로운 애플리케이션에 대한 세부 정보가 포함된 페이지로 리디렉션됩니다.
  • "Application ID"와 "Application Secret"을 주의깊게 기록합니다.

단계 3: Bubble 애플리케이션 설정

더 나아가기 전에, Bubble에서 실행 중인 애플리케이션이 있는지 확인하세요.

  • Bubble 계정에 로그인합니다.
  • Square와 통합하려는 애플리케이션을 선택합니다.
  • 왼쪽 패널의 "Plugins" 탭으로 이동합니다.
  • "Add Plugins"를 클릭합니다.
  • "Square"를 검색하고 플러그인을 설치합니다.

단계 4: Square 플러그인 구성

Bubble의 Square 플러그인은 Square에서 생성한 앱 ID와 비밀번호를 필요로 합니다.

  • Square 플러그인을 설치한 후, 클릭하여 "Settings" 탭을 엽니다.
  • Application ID 필드에 Square에서 기록한 Application ID를 입력합니다.
  • Application Secret 필드에 Square에서 기록한 Application Secret를 입력합니다.
  • "Save"를 클릭합니다.

단계 5: Bubble에서 Square 결제 게이트웨이 설정

Bubble 애플리케이션에서는 Square를 통해 결제를 처리할 수 있는 방법이 있어야 합니다. Bubble에서는 이를 위해 Square Payment Element 플러그인을 사용할 수 있습니다.

  • Bubble에서 "Design" 탭으로 이동합니다.
  • 결제 요소가 표시될 새 페이지를 추가하거나 기존 페이지를 사용합니다.
  • 요소를 추가하기 위해 "+" 아이콘을 클릭합니다.
  • "Square Payment Element"를 찾아 페이지에 끌어다 놓습니다.
  • 결제 요소의 크기를 조정하거나 원하는 위치에 놓습니다.

단계 6: Square 결제 게이트웨이와 연결된 동작 구성

Square Payment Element의 시각적 측면을 설정한 후, 결제를 진행할 때 어떤 동작이 발생해야 하는지 구성해야 합니다.

  • 페이지에서 Square Payment Element를 선택합니다.
  • "Property Editor"로 이동하여 "When a Square Payment Form Payment is Successful" 옆에 있는 "Start/Edit Workflow" 버튼을 클릭합니다.
  • 이 작업으로 Workflow Editor가 시작되어 결제가 성공한 후 어떤 일이 발생하는지 결정할 수 있습니다(예: 인보이스 생성).
  • 위의 단계를 "When a Square Payment Form Payment is Failed"에 대해 반복하여, 성공하지 못한 거래에 대한 관련 조치를 설정합니다.

단계 7: 통합 테스트

과정의 마지막 단계는 설정을 테스트하는 것입니다.

  • Square와 Bubble 애플리케이션 모두 테스트 모드에 있는지 확인합니다.
  • Bubble에서 애플리케이션의 "Preview" 모드로 이동합니다.
  • Square Payment Element를 사용하여 결제를 시도해 봅니다.
  • 모든 설정이 올바르게 구성되어 있다면, 워크플로우에서 정의한 동작이 결제 후 실행됩니다.

이 단계들을 정확하게 따르면, Bubble.io를 Square 계정과 성공적으로 통합할 수 있습니다. 테스트가 성공적으로 완료된 후에는 사용자에게 애플리케이션을 출시하기 전에 두 애플리케이션을 모두 테스트 모드에서 실제 모드로 전환하도록 합니다.

Bubble.io와 Square 통합 사용 사례

시나리오: 온라인 가구 상점이 Bubble.io를 사용하여 고객이 제품을 보고 구매할 수 있는 상호 작용형 전자 상거래 플랫폼을 구축합니다. 상점은 원활한 온라인 결제를 위해 Square를 활용하고자 하며, 효율적인 재무 관리를 위해 거래 추적을 자동화하고자 합니다.

솔루션: Bubble.io를 Square와 통합

전자 상거래 플랫폼 구축: 상점은 Bubble.io를 사용하여 제품 목록, 장바구니 기능, 결제 시스템이 있는 직관적인 전자 상거래 플랫폼을 구축합니다.

통합 설정: 상점은 Bubble.io에 Square 플러그인을 설치하고 Square API 자격 증명을 사용하여 연결합니다. 그들은 고객이 구매를 할 때 활성화되는 Bubble.io에 워크플로우를 설정합니다.

거래 워크플로우: 고객이 구매를 완료하면 워크플로우가 시작됩니다. Square와 연관된 플러그인 액션은 제품, 수량, 가격, 구매자 정보와 같은 거래 세부 사항을 캡처하고 이 데이터를 Square로 보내 결제를 처리합니다. 결제가 성공하면 영수증이 고객에게 보내지며, 거래 세부 사항이 Square의 시스템에 기록되어 기록 보관됩니다.

Square에서의 재무 관리: Square의 대시보드에서, 상점의 재무팀은 실시간으로 모든 거래를 추적하고, 환불을 관리하고, 조정을 수행 할 수 있습니다. 또한 팀이 판매, 수입, 고객 소비습관에 대한 통찰력있는 보고서로 재무를 분석하게 합니다.

분석 및 성능: Bubble.io와 Square 통합을 통해, 상점은 사용자 행동과 구매 기록을 추적할 수 있습니다. 이 데이터는 제품 성능을 검토하고, 마케팅 캠페인을 전략적으로 구상하고, 플랫폼에서의 사용자 경험을 향상시키는 데 도움이 됩니다.

장점:

  • 효율성: 자동화된 결제 과정으로 수동 처리 오류를 줄여 고객에게 원활한 쇼핑 경험을 제공합니다.
  • 집중적인 거래: Square는 모든 금융 거래의 단일 지점으로서 작용하여 재무 모니터링과 감사를 더욱 쉽게 만듭니다.
  • 향상된 고객 만족: 빠르고 안전한 결제는 고객의 신뢰를 높이고 쇼핑 경험을 향상시킵니다.
  • 데이터 통찰력: 금융 거래와 고객 행동을 모니터링하면 비즈니스 성장을 위한 데이터 기반 결정을 내리는 데 도움이 됩니다.

Bubble.io와 Square를 통합함으로써 온라인 가구 상점은 온라인 거래를 간소화하는 것뿐만 아니라 재무 기록을 효율적으로 관리하여 전반적인 비즈니스 성능을 향상시킬 수 있습니다.

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

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