ApyHub API Integration Guide for Bubble Developers

This guide helps Bubble developers integrate ApyHub APIs for file conversion and data transformation. It covers setting up the API Connector, configuring endpoints, and building workflows to handle conversions like Word to PDF, HTML to Word, and JSON to CSV. The tutorial includes step-by-step instructions, API details, and UI setup to display results in a Bubble app.

Sohail Pathan

Last updated on March 04, 2025

Introduction

This guide will help Bubble developers integrate ApyHub APIs into their applications. ApyHub provides a suite of APIs for file conversion, data transformation, and more. In this guide, you’ll learn how to set up and use the following APIs in Bubble:

Prerequisites

Before you begin, ensure you have the following:

A Bubble account to create and edit apps.
An ApyHub account to obtain your API token.
Basic familiarity with Bubble’s interface, workflows, and API connector.

Setting Up the API Connector

Step 1: Add the API Connector Plugin

Go to the Plugins tab in your Bubble app.
Search for and add the API Connector plugin.

Step 2: Configure the APIs

For each API, create a new API call in the API connector. Below are the details for each API.

API 1: Convert Word to PDF

Endpoint: https://api.apyhub.com/convert/word-file/pdf-url
Method: POST
Headers:
- Content-Type: application/json
- apy-token: Your_ApyHub_Token

API 2: Convert HTML to Word

Endpoint: https://api.apyhub.com/convert/html-file/doc-url
Method: POST
Headers:
- Content-Type: application/json
- apy-token: Your_ApyHub_Token

API 3: Convert HTML to PDF

Endpoint: https://api.apyhub.com/convert/html-file/pdf-url
Method: POST
Headers:
- Content-Type: application/json
- apy-token: Your_ApyHub_Token

API 4: Convert JSON to CSV

Endpoint: https://api.apyhub.com/convert/json-raw/csv-url
Method: POST
Headers:
- Content-Type: application/json
- apy-token: Your_ApyHub_Token

Building the Workflow

Step 1: Create the UI

Add the following elements to your Bubble app:

File upload input.
Dropdowns for input and output formats.
Buttons to trigger conversions.
Input for JSON input.
Display areas for results (e.g., download links).

Step 2: Set Up Workflows

For each API, create a workflow that triggers when the user clicks the "Convert" button. Here’s how:

Get File:

Use the file upload element to get the file.

Call the API:

Use the API connector to call the appropriate API.
Pass the file URL or JSON data as the request body.

For JSON to CSV

Save and Display the Result:

Save the API response (e.g., converted file URL) in a Bubble data type.
Display the result (e.g., a download link) to the user.

Conclusion

Congratulations! You’ve successfully integrated ApyHub APIs into your Bubble app. This guide covered the setup for four APIs, including file conversion and JSON to CSV transformation. You can now expand the app’s functionality by exploring other ApyHub APIs.

Link to our demo app: https://apyhub-integration.bubbleapps.io/version-test