/No-Code Development Agency

FlutterFlow와 HubSpot를 어떻게 통합하나요?

몇 단계만으로 FlutterFlow와 HubSpot을 쉽게 통합하는 방법을 배워보세요. 저희의 단계별 가이드는 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

FlutterFlow와 HubSpot를 어떻게 통합하나요?

답변: 1단계: HubSpot API 키 생성

FlutterFlow를 HubSpot과 연동하기 전에 HubSpot에서 API 키를 가져와야 합니다. 이를 위해 HubSpot 계정에 로그인하고 다음 단계를 따르세요:

  • 오른쪽 상단 모서리의 톱니바퀴 아이콘을 클릭하여 설정으로 이동합니다.
  • 왼쪽 메뉴에서 통합을 클릭한 다음 API 키를 선택합니다.
  • 아직 API 키가 없는 경우 키 생성 버튼을 클릭합니다. 이미 API 키가 있는 경우 기존 키를 사용할 수 있습니다.
  • API 키를 안전한 곳에 복사해 저장하십시오. 이후에 필요합니다.

2단계: FlutterFlow에 HubSpot 설치

HubSpot에서 API 키를 얻은 후에는 FlutterFlow 프로젝트에 HubSpot을 설치해야 합니다:

  • FlutterFlow 프로젝트를 열고 화면 왼쪽에 있는 통합으로 이동합니다.
  • 통합 목록에서 HubSpot을 찾아 설치를 클릭합니다.
  • HubSpot에서 얻은 API 키를 API 키 필드에 붙여 넣은 후 제출을 클릭합니다.

3단계: FlutterFlow에서 HubSpot 동작 설정

FlutterFlow 프로젝트에 HubSpot이 설치 완료되면 이를 사용하려는 동작을 설정할 수 있습니다.

  • 먼저, FlutterFlow 프로젝트에서 HubSpot 액션을 설정하려는 페이지로 이동합니다.
  • HubSpot 액션에 대한 트리거 엘리먼트(예: 버튼)를 선택하거나 만듭니다.
  • 오른쪽 설정 패널에서 동작을 클릭한 다음 동작 추가를 클릭합니다.
  • 옵션 목록에서 HubSpot을 선택합니다.

4단계: HubSpot 동작 구성

HubSpot 동작이 올바르게 작동하려면 일부 구성이 필요합니다.

  • 새 HubSpot 동작 창에서 트리거 엘리먼트가 작동할 때 HubSpot이 수행해야 하는 동작 유형을 선택합니다. 이는 연락처 생성 또는 연락처 업데이트와 같은 동작일 수 있습니다.
  • 선택한 액션에 따라 필수 필드를 모두 작성합니다. 이는 연락처의 이메일 주소, 이름 또는 기타 필수 정보일 수 있습니다.
  • 완료되면 저장 버튼을 클릭합니다.

5단계: 통합 테스트

새로운 HubSpot 통합이 제대로 작동하는지 테스트하는 것이 중요합니다.

  • FlutterFlow 프로젝트의 오른쪽 상단에 있는 미리 보기 버튼을 눌러 HubSpot 액션을 테스트합니다.
  • 애플리케이션을 사용하고 HubSpot 통합을 트리거해야하는 액션을 수행합니다. 이는 버튼 클릭 또는 양식 작성일 수 있습니다.
  • 동작을 트리거한 후 HubSpot 계정을 확인하여 동작이 제대로 수행되었는지 확인합니다.

이것으로 튜토리얼이 끝납니다. 이제 FlutterFlow 프로젝트에 기능적인 HubSpot 통합이 있어야 하며 FlutterFlow 애플리케이션에서 직접 연락처를 생성하거나 업데이트할 수 있습니다. 다양한 동작과 트리거로 계속 실험하여 통합에서 최대한 활용하세요.

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

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

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