OpenAI & Bubble Formating Tips & Tricks
In this Bubble tutorial we demonstrate some tips and tricks that will help you understand and format your prompts and responses when using the OpenAI ChatGPT API (gpt-3.5-turbo). This video draws on demonstrations in our Split by video and highlights several different approachs to extracting text from your OpenAI response including extracting multiple items.
Master OpenAI formatting: Unlock the power of structured data with our OpenAI formatting tips for Bubble!
Elevate your Bubble skills: Learn to extract and manipulate data effortlessly using split by and custom prompts.
Boost your app's performance: Discover how to optimize OpenAI responses for seamless integration with Bubble workflows.
Demonstrating Tips and Tricks for OpenAI Text Generation in Bubble
I want to demonstrate a few tips and tricks for working with OpenAI text generation ChatGPT etc with your Bubble app and I'm going to be focusing on different ways that you can format and structure data as it's a recurring theme in some coaching sessions I've done over the last couple of weeks where other Bubble app creators are trying to get responses back in a particular format how do you extract them that sort of thing.
Setting Up the OpenAI API Connector in Bubble
I'm going to start off with something very simple although we are diving into the deep end with the OpenAI text generation API. Do check out our previous videos on the topic to get to this point but I'm in Bubble I've got the API connector set up ready to make a call to the new chat endpoint. I've got this all correctly formatted for the GPT 3.5 turbo and what I mean by simple is the system command is you are or message the system messages you are an SEO expert and copywriter I just say copywriter write 3h1 so that's your headlines for a page for a SaaS app.
Initializing the API Call and Examining the Response
If I click initialize call you see I get my response and to have a look at the actual data I'm going to scroll down look at the raw data and so this is what OpenAI reply with and I'm going to copy everything in between the first set of speech marks and I've got a handy app here which escapes the JSON. When we look at what OpenAI has actually given me you see that there's lots of these backslashes and that's a way of in JSON communicating that the speech mark here is not to be treated as part of the code.
Understanding JSON Formatting in OpenAI Responses
You'll notice that JSON's kind of call and response all uses speech marks to identify fields and inputs or parameters and inputs and so so that we don't get the JSON syntax confused or mixed up it's escaped when it's returned and so this app basically is showing me what Bubble would actually save to the database in fact I failed to copy the last speech marks I've made that in there there we go there's two speech marks there this is what Bubble would actually save to the database if I save message content to the database.
Using Split By to Extract Data from OpenAI Responses
How would I go about splitting this up because perhaps I want to just store three different entries into my database for each of the responses here? One way I could do that is to use split by. We've got another video on this but simply put split by means that I can say what would I like to split my elements my text up by and I would use split by a line break here.
Formatting OpenAI Prompts for Structured Responses
What if I want to be more prescriptive about how Bubble returns the data? For example instead of saying write three h1 tags for a SaaS app I'm going to say write using the following format and now I'm going to use this escape n backslash n because I'm putting in a line break in fact I'll put in two line breaks and I'm then going to say h1 colon and then I will put in the line break and I'll say score colon so I'm going to say write and for a write h1 for a SaaS app and score and give each response and SEO score I'm just going to make it even plainer clearer for OpenAI.
Extracting Structured Data from OpenAI Responses
By giving the input message a more prescriptive way that I want to return the data by the way how I want the data to return I can get OpenAI to return the data in that format and that can be really helpful because you might find that you need to be more commanding of OpenAI to get a reliable format back and so if I wanted to store each of these responses as a separate database item I now know that each one is separated by two line spaces I can use split by to target that.
Using the 'n' Parameter for Multiple Variations
There's another way that you can do it and I just say it's really worth experimenting with the different formats. I can change n and this is a parameter that comes over from GPT 3 and it's saying how many different variations do I want to get back and so I can say I want three variations back and initialize the call and wait for OpenAI to get back to me.
Conclusion and Tips for Experimenting with OpenAI Prompts
Tune your prompts experiment play with changing n play with being really prescriptive in this command here the initial user content that you send see if it makes any difference putting that prescriptive this is how I want the response into system I've seen a few tweets of people saying you can get really different responses depending if you use system or you use user so I would say that in my experience you can get a reliably structured format back to Bubble from OpenAI and then using split by or using n and separating it out from the different messages different what we're looking at before what's the choices different choices and you can find a way to extract exactly the data that you want whether that's splitting by using like a label at the start of the line or and the line space at the end you can find a way if you've got any particular scenarios that don't quite work leave a comment on this video book a Bubble coaching session and I'd really love to work on it with you and find the solution but I'm saying it is possible if you have the right prompt you can get the data back in the right structure and using split by you can extract that data with Bubble.
Get the Complete Bundle for Just $99
Access 3 courses, 390+ tutorials, and a vibrant community to support every step of your app-building journey.
Start building with total confidence
No more delays. With 30+ hours of expert content, you’ll have the insights needed to build effectively.
Find every solution in one place
No more searching across platforms for tutorials. Our bundle has everything you need, with 390+ videos covering every feature and technique.
Dive deep into every detail
Get beyond the basics with comprehensive, in-depth courses & no code tutorials that empower you to create a feature-rich, professional app.
Valued at $49
Valued at $89
Valued at $29
Valued at $99
Valued at $49
Can't find what you're looking for?
Search our 300+ Bubble tutorial videos. Start learning no code today!
Have questions?
We have answers!
Find answers to common questions about our membership plans, programs, and more.
We're here to help you launch your no code SaaS. Reach out to the team and we'll double check our vast library for useful content. We'll advise you on how we'd tackle the same problem and there's a good chance we'll record the video to help the wider community.
As a Planet No Code member, you'll receive a discount on our Bubble coaching sessions. Monthly members receive a 10% discount, while Annual members receive a 17.5% discount. To redeem your discount, simply log into your account and book a coaching session through our platform.
Our 8-week intensive mentorship program is designed to provide personalized guidance and support to help you accelerate your startup journey. You'll be matched with a startup expert who will work with you one-on-one to set goals, overcome challenges, and make rapid progress.
To apply for the Mastery Program, simply click the "Request Invitation" button on our pricing page and fill out the application form. Our team will review your application and schedule a call with you to discuss your goals and determine if the program is a good fit for your needs.
We accept all major credit cards, including Visa, Mastercard, American Express, and Discover.
While we don't offer a free trial, we do provide a 14-day money-back guarantee. If you're not completely satisfied with your membership within the first 14 days, simply contact our support team, and we'll issue a full refund.