Integrate Cogniflow with Bubble

Bubble.io is a no-code app development platform. It is used to develop software and application without coding or can say Bubble.io offers a way to build an application without having knowledge of core programming languages. Visit Bubble website and create a free account.

Let's create a simple Bubble app which performs an image classification to detect if in an image Coke or Pepsi is present and integrate a text classification model to identify the written language automatically.

First search and install the Cogniflow plugin:



Add your API Key.



From your Design view, use a PictureUploader element, a multi line input, some buttons and some text to show their results, similar to the screen below:



Let create some actions for the buttons.



When you select Cogniflow API - Image classification you need to enter the following information:

model_url: copy that from you Cogniflow model integration tab.
format: you need the file extension, you can get that by splitting the name using “.” and the getting the last element.
base64_image: Select the PictureUploader image value and click con encoded in base64.



Then you can set to show the Cogniflow API result to the "Text A" label using a custom state. To create a custom state go to the TextA element and create a custom state called "res" for example which is a text.



Now you can use that custom state to automatically update the "Text A" text after the predict button is clicked.



Following the same process, you can connect a Cogniflow text classification model.

Now run the app and voila!

Updated on: 15/06/2023