No-Code AI Assistant

Introduction

No-code and low-code solutions like Bubble.io are becoming very popular platforms to build applications with. They are advertised as tools that non-developers can use to build things that previously required developers to do. In summary, while these tools definitely make building apps more accessible for non-developers, they do require a learning curve and are less flexible than writing the code yourself.

Building the AI Assistant

My goal was to build an AI assistant that enables users to upload a file and ask questions about it. This process follows a straightforward retrieval-augmented generation (RAG) approach. I used Open AI’s assistant API to make this happen. Here is the general workflow:

1. User uploads a file
2. User types in a question about the document
3. User presses submit
4. LLM responds back with a message we can render.

Using the APIs

After playing around with the UI a bit, I decided the first task was to figure out how to use OpenAI’s APIs. In Bubble.io , the way you connect your app to external services is through plugins. Naturally, I looked for an OpenAI plugin. Turns out, there are a bunch!

I tried using one of them and quickly encountered issues. One lacked the necessary functions, another gave me an authentication error when I entered the OpenAI key, and a third appeared to work but I struggled to create the correct payload in the editor (more on that later). Was I doing something wrong? I immediately turned to Google to see how others were managing it. Based on some search results, including a helpful YouTube video, it seems people were using the API connector. This plugin requires more configuration than the OpenAI plugins but offers more flexibility to achieve exactly what I need. Here’s an example of what it looks like:

If you have ever used Postman , it feels a lot like that. Is this friendly to non-developers? You don’t write code but you have to have an understanding of how APIs work. I have a hard time believing this is accessible to non-developers as you have to specify each part of the payload and headers to make it work.

Hookup up the APIs

Once I had all the APIs set up for the assistant and completions (see documents ), it took me about an hour to figure out the workflow aspect of the project. However, once I understood it, it didn’t seem so bad. Here’s a screenshot of the most complicated part, which occurs when a user uploads the file we want to analyze and ask questions about:

The key steps here are:

• Uploading the file to Open AI
• Taking the uploaded file and let Open AI generate embeddings that are stored in a vectore store
• Creating a new thread that uses the file as an attachment
• Take the thread ID and store it in state

Once that is done, the user can type in their question and press submit which will call the existing assistant to generate a run. Once the assistant has finished running, there is a button that checks the result. Here is what it looks like when I uploaded my resume:

Which is exactly what’s in my resume! I tried it on some larger documents as well and it works great.

Dealing with Responses

Perhaps the most frustrating part of Bubble is getting responses out of API calls. To get the content of the last message from OpenAI’s get messages API, I had to write this set state call in my workflow:

What this is doing is:

• Take the last item of the response data (most recent message)
• Take its content value
• Take the last item in that array
• Take the text and trim it

First, it’s quite annoying to have to write the selector code in English sentences instead of using array indexes and dictionary properties. Secondly, the Value input can’t be expanded, making it difficult to edit after writing it. At this stage, writing the code in Python or JavaScript would have been MUCH easier.

Summary

Bubble is a powerful no-code platform, but it comes with inherent limitations common to all no-code tools: a lack of configurability. Manipulating values in Bubble is more challenging compared to using traditional coding languages, highlighting that while no-code solutions make app building more accessible, they do require a learning curve and offer less flexibility than writing code directly. I’m excited to share more of my projects with you and I would love to discuss some of your ideas and how I might be able to bring them to life quickly and cost effectively!