Welcome to this week’s newsletter, where I take you along for the ride building profitable SaaS businesses without code using AI!

This week I wanted to talk a bit about what the best tools are for building software using AI, for those of us who aren’t hardcode coders.

Obviously there are web based platforms like Lovable, Replit, Bubble etc which are a great way to get started (indeed that’s how I got into learning how to make things in the first place!)

But increasingly, I’m finding myself spending nearly all the time I spend on my computer in a development environment like Claude Code or Codex.

I’m going to cover the strengths and weaknesses of each of the big desktop AI building apps, and which ones I use every day to help me build things.

Whilst all these tools work in similar ways, there are differences between them. Some are easier to use than others, some are more flexible and customisable.

It’s worth noting I’m going to be covering everything today from the perspective of being a Mac user, though many of these tools have Windows equivalents.

Subscribe now

What’s a AI harness?

I thought it would be worth quickly covering this term as it’s likely something you’ve come across but it’s a bit jargon-y.

Essentially Claude Code, Codex, Cursor are all harnesses around an underlying AI model.

Think of a harness like the body around the AI brain. The raw AI model (like Claude or ChatGPT) is great at understanding language and generating code - but on its own, it’s just a chatbot in a box.

All it’s trying to do is predict the next word.

It can’t see your files, edit them, run commands, remember what it did yesterday, or safely interact with your computer.

The harness is everything else: the tools, rules, context manager, permission system, and workflow layer that turns a great AI model into a useful coding partner.

It’s the scaffolding that lets the AI actually do things in the real world (your project folder) without going rogue or forgetting what it’s supposed to be building.

Claude Code

First up, Claude Code!

Quick clarification before we dive in. I’m talking here about the Claude Code desktop app, not the CLI version. I’ll cover the CLI a bit later when we get to Cursor, because that’s where I spend most of my time actually using it.

The desktop app is a fantastic way for people to build their first proper bit of software. No installing CLIs, no faffing with terminals. You open the app, go to the Code tab, start a new session, and you’re off.

If you’re anything like me I used to find doing anything in the terminal intimidating (and sometimes scary!) so using the nice and polished Claude desktop app can be a great access point for getting started with building things.

How it actually works

At the highest level a Claude Code session is linked to a specific folder on your computer. That folder contains all the files for a given project: code, assets, configs etc.

Claude can read those files, edit them, create new ones, and run commands. When you want to work on a different project, you point it at a different folder. That’s basically the whole mental model.

The modes you need to know about

Claude Code has a few different “permission modes” which control how much it checks in with you before doing things. Shift+Tab lets you quickly switch between them, or there’s the menu shown above.

Worth understanding these because they change the whole feel of working with it:

Default mode. Claude asks for permission before editing files or running commands. Safe, but you’ll be clicking “allow” a lot!

Accept edits. Claude makes file changes automatically, but still asks before running commands.

Plan mode. Claude writes out a plan before touching anything. Useful when you’re kicking off something bigger and want to sanity-check the approach first.

Bypass permissions. The YOLO option. Claude does whatever it wants, no prompts. This is what I run on most of the time, if I’m honest. Fastest way to actually get work done once you trust it.

I love that I can set a complex task off and come back an hour later to have it completed without me having to have constantly granted permissions.

Auto mode. The newest addition, and the best one. Instead of asking you about everything or blindly doing everything, it uses classifiers to evaluate each action. Safe stuff gets auto-approved, risky stuff (like deleting files or hitting production) still gets flagged.

It’s basically bypass mode with guardrails, and I’ve been using it more and more recently.

Worktrees, keep it simple

One thing worth mentioning quickly… worktrees.

Don’t worry too much about the technical details. Just know that a worktree is basically a way to run multiple Claude sessions on the same project at the same time, without them stepping on each other. In the desktop app you can enable this with a checkbox when you start a session.

Sometimes it’s fine to have multiple instances of Claude running on the same folder without worktrees, but it’s usually safer to try and keep things isolated if you can!

MCPs and CLIs, where things get interesting

This is where the desktop app really starts to give you wow moments.

MCPs and CLIs (both fairly similar in practice, they essentially let Claude execute commands on other services) let Claude connect to external tools like databases, hosting providers, APIs, etc.

Think of them as giving Claude superpowers beyond just editing files on your computer.

The one I use most is the Supabase MCP. Once it’s connected, Claude can do basically anything in your Supabase project: read data, run migrations, create tables, inspect schemas.

Instead of me copy-pasting SQL back and forth or describing what I want, Claude just does it.

The desktop app makes adding MCPs genuinely easy.

There’s a proper UI for it, and Anthropic’s built-in connector marketplace means most of the popular ones are a couple of clicks to install.

My verdict

Honestly, the desktop app is just a nice, easy wrapper for getting into this stuff. If you’ve never touched Claude Code before, I’d start here rather than the CLI. The skills, the MCPs, the routines, it’s all right there in a proper UI, no config files to wrestle with.

Codex

I’ve been using the Codex desktop app more and more recently, and the main reason is honestly just how nicely put together the app is.

It feels like a beautifully designed piece of software, and everything you need is in one place.

The app experience

The Codex desktop app is where I’d suggest most people start (same as with Claude Code).

There’s also a CLI version, and an IDE extension, but it does feel like OpenAI are putting most of their development effort into the desktop app right now. The UI is miles ahead of anything else in this space in my opinion!

A few things that stand out:

The built-in browser.

You get a proper live preview of whatever you’re building, right inside the app. No alt-tabbing to Chrome to see what’s changed.

But the really clever bit is the annotating mode. While you’re looking at a live preview, you can write notes directly on the page, circle a button, draw an arrow, whatever, and those annotations get sent back to the model as context for the next change.

It honestly makes it feel like you’re talking to a human developer. “Make this button bigger, move this over here, change the colour of this.” I haven’t seen this in any other tool and it’s a proper differentiator.

Browser use. Codex can also control and navigate the built in browser using the ‘Browser Use’ plugin - this is amazing for things like doing automated tests.

Built-in GitHub. Nice friendly UI for committing, pushing, creating branches, all the stuff you’d normally drop into the terminal for. If you’re newer to git, this is a really gentle on-ramp.

Quick toggles for file tree, terminal, and a side panel showing every file that’s been changed in the current session. Super easy to see exactly what Codex has been up to, which matters when you’re running it in anything other than manual approval mode.

Permission modes

Same idea as Claude Code. You’ve got default permissions (it asks about everything), full access (it does whatever it wants), and the newer auto mode (officially called auto-review).

Auto mode is the interesting one… it uses a second “guardian” agent to review actions before they run, which means you get most of the speed of full access without the anxiety.

I’ve been running it on auto mode for most tasks recently and it handles the vast majority of stuff with no confirmation prompts.

Plan mode

Works similarly to Claude Code’s plan mode. You describe what you want, Codex writes out a proper implementation plan, and once you’ve signed it off, it goes and executes.

Worth using for anything non-trivial because it forces a sanity check before anything gets written.

The models, and the intelligence selector

Codex just got the brand new GPT-5.5 model (as of this week), which has been performing really well. It’s also really token efficient, which matters because token efficiency translates directly into how long your usage lasts on a given plan, as well as how fast it is!

One thing worth explaining: the intelligence level selector. You can pick between low, medium and high (and sometimes extra high, depending on your plan).

The temptation is to always run on the highest setting possible, but OpenAI are actually recommending medium as the default for most tasks now. It’s faster, uses fewer tokens, and for the vast majority of stuff it’s genuinely good enough. Save high for the planning or big complex problems.

GPT-5.5 also has a 400K context window in Codex, so you can have pretty long sessions before it starts struggling.

There’s also a speed setting where you can pick between standard or fast modes (fast uses credits more quickly!)

Auto-compacting

Speaking of long sessions. One of Codex’s nicer features is auto-compacting. When your context window starts filling up, instead of either crashing or silently forgetting things, Codex automatically writes a summary of the conversation so far and replaces the full history with that summary. You keep going, Codex remembers the important stuff, and you don’t have to start a new session every time things get long. Small thing, but it makes a real difference on bigger projects.

Pricing

This is the bit people miss: if you’re already paying for ChatGPT Plus, Pro, or Business, Codex is included. You don’t need a separate subscription. Given most people building in AI already have a ChatGPT account, this is effectively free Codex for many.

My verdict

Codex is the one I reach for when I want things to feel good. The UI is lovely, the annotating browser is genuinely unique, and the new GPT-5.5 model is performing well.

Combined with the fact that it’s bundled with a ChatGPT subscription, it’s getting harder and harder to ignore. Many people say that the OpenAI models are also becoming better at coding than Claude, though there are lots of voices on both sides!

Want to go further and use multiple models?

The two apps above are where I’d suggest most people start, but they’re not the only game in town. Even though I do occasionally use the Claude and Codex desktop apps, I do most of my work inside Cursor using their CLIs.

It’s a full IDE (based on VS Code) rather than a standalone app, I really like that you can run Claude Code and Codex directly inside Cursor’s terminal, so you can instantly switch between them and even play them off one another if you get stuck.

Cursor also has a really nice built in browser and file change view to show everything you’ve worked on.

That’s it for this week!

I hope you found this comparison useful, it’s definatly worth giving all these options a spin to see which works best for you, often I will switch between them depending on what I’m working on! or when I run out of credits on one 👀

It’s amazing that all the big AI labs are turning their attention to building these increasingly powerful desktop apps that make it easier to do complex things with AI.

I’d love to hear about what you’re working on with them, drop me a reply!

Happy building!

James

P.S. The Create With Conference is coming up in June - Advance tickets are still available for only £49. It would be great to see you there!

When does it make sense to cancel a SaaS subscription and build your own version of it using AI?

I’m always reading posts on X saying it’s a terrible idea. You’re going to waste weeks building it! What about the maintenance?

But then I decided to replace a few of the expensive SaaS tools I was using and I’m converted!

Watch how I built my own Intercom style support system

There are some real reasons you should consider ‘rolling your own’ software to replace pricy subscriptions.

1. It’s a great way to learn how to build things. You’re already a user of the tool you’re looking to replace (probably a power user!) so you know exactly how you want your new app to work. You know what features it should have. You don’t have to spend weeks searching for the perfect app idea, you’re just copying (and hopefully improving) a tool that already exists. I speak to so many people who get stuck at the step

2. Learn a new app development stack. I started my first replacement build as a weekend project simply because I wanted to learn how to build an app using Convex as the DB and hosting it on Cloudflare Workers using NextJS. If there’s a new technology you’ve been wanting to try - rebuilding a tool you already use can be a great way to give things a test drive.

3. Better fit your use case. One huge bonus of building your own tools is that you can customize them for your exact use case and make them totally personal to you. For my support system I was able to give it a deeper integration into my app’s backend to perform admin tasks and fetch data when needed, all things I used to have to do manually. Building the tool myself meant I could integrate it deeply.

4. Reduce your costs. It goes without saying you can radically reduce your operating costs by replacing expensive SaaS subscriptions with your own vibe coded version. In fact, my support system built on Convex and Cloudflare is effectively free to operate!

There have been some fairly high profile cases of companies replacing expensive SaaS, such as Klarna who replaced expensive Salesforce & Workday subscriptions with custom built software.

Klarna went all-in on this approach back in 2024. They shut down Salesforce and Workday (plus a bunch of other tools) and rebuilt their internal systems with a simpler AI-powered stack.

This was in 2024… before Claude Code and Codex was even released, so the barriers have been lowered even further since then… is there any such thing as a sticky SaaS anymore?

But it’s not just billion-dollar companies doing this. I did the same thing on a much smaller (and more realistic) scale with two tools I was actually paying for every month.

My Crisp/Intercom replacement for customer support.

Old cost: ~£100/month

New stack: NextJS + Convex + Cloudflare Workers (effectively free at my scale)

Live chat widget on the site, full help desk, product updates feed and my favourite feature: new tickets ping me in Slack and I reply straight from there, it syncs back instantly. It handles incoming and outgoing emails using Postmark for email support.

What started as “just learn Convex” turned into a system that fits my exact workflow better than anything off-the-shelf.

Both projects taught me new a stack, gave me deeper integrations I could never buy, and paid for themselves in months.

Most importantly, because I was already a power user, prompting the AI was easy, I knew every feature, every frustration, and every edge case I wanted to fix.

So what should you actually build this on?

If you’re going to try one of these projects, the stack you pick is important. Get it wrong and you’ll spend your weekend fighting deployment issues instead of building. Here’s what I’d use if I was starting from scratch today.

For the app itself, NextJS. Not because it’s trendy, but because every AI coding tool has seen a million NextJS projects and gets it right first time.

Claude Code works incredibly well with it. As you can see in my video tutorial you get a really nice dev environment with claude code below a live preview of your app.

For the database and backend, Convex. This is the one I’ve really fallen in love with. It’s a database, backend functions, file storage, real-time sync, all in one thing, and it’s fully typed, which means the AI writes correct code instead of guessing at your schema.

Real-time sync basically for free is what made the Slack integration on my support tool a 10-minute job instead of a weekend. The free tier is generous enough that most side projects will never pay a penny.

If Convex feels too opinionated for you, Supabase is the sensible alternative which I’ve covered in previous editions. Proper Postgres, good auth, works with anything. Bit more wiring to do yourself, but it has a brilliant MCP server.

For hosting, Cloudflare Workers or Vercel.

Both have free tiers that’ll comfortably cover a personal project, both deploy from a git push, both will stay up without you thinking about them. I’ve been using Cloudflare recently because I wanted to learn how to host full apps on it, but honestly you can’t go wrong either way.

For auth I used the built in Convex Auth with email one time passwords.

And then Claude Code to actually build the thing!

The trick I’ve landed on is to tell it the exact stack upfront… “NextJS, Convex, deploying to Cloudflare Workers” otherwise it’ll waste time picking technologies for you.

Then just work through the features one at a time, the same way you’d use the tool you’re replacing.

That’s it. That’s the whole stack. Nothing exotic, nothing you’ll have to rip out in six months.

So when does it actually make sense?

Here’s the quick decision framework I now run every time a renewal email lands in my inbox:

Cost threshold: Under ~$50/month? The bar is high… it better teach me something big or save me serious time. Over $80–100? Way easier to justify the experiment (the savings can easily pay for a pro Codex or Claude Code sub!)

How well do I know the tool? If I’m a daily power user, I can describe the perfect version in detail. That context makes AI builds shockingly fast.

Learning upside? Every build lets me try a new stack (Convex this time, Cloudflare Workers last time) that I can now use on client work or future products.

Maintenance check: Will this need weekly babysitting? If it’s built on rock-solid platforms like Cloudflare, Vercel, or Convex… usually no. If issues do arise, Claude Code is usually able to pull in the logs directly via the Cloudflare MCP and address the issue without much input from me.

Being able to build so quickly using AI has flipped the economics completely.

A few years ago this would have been weeks of pain and totally unviable. Now it’s a weekend project that levels up your skills and cuts costs.

I still read those X threads saying “don’t do it — maintenance will kill you.” They’re not wrong for every case.

But when the tool is something you use every day, the savings are real, and you’re treating it as a learning investment… why not give it a go?

What SaaS tool are you thinking about replacing?

Hit reply and tell me! I’d love to hear what stack you’re thinking of using.

Happy building! James

PS: If you’re interested in this kind of thing I’d love for you to join us at the Create With Conference in Brighton this June! Ticket are only £49 for a day of learning about how to build with AI.

Subscribe now

I had a great response to my last issue on how I built an automated ad machine using Claude Code, it seems a lot of people share my frustrations with creating and setting up ad campaigns manually.

I’ve been using this ad system for a few weeks now, for both creating and managing the campaigns.

I’m basically never logging into the Meta Ads manager anymore, just chatting in Claude Code on how the campaign is performing, and allowing it to adjust budgets / make optimisations as it goes. It’s been a really fun experience so far.

Here’s an example of what one of my my ad account reports looks like - it would have taken me a long time to get all of this from looking through hundreds of ads in our Meta dashboard!

As I mentioned in my last issue, I built this whole system to be run locally on my machine only. To do anything or make changes I need to fire up Cursor + Claude Code and get chatting.

But I found myself wanting to automate some of these review tasks. I just wanted them to run every day and send me an update with recommended improvements I could accept or reject. Basically to act like a human ad manager.

Initially I decided to try out the new Claude Code /loop feature, which runs your prompts on a schedule.

This sounds great in theory - it could run a simple prompt every day to run the campaign monitor health check and make any updates. However it didn’t really work in practice for me.

The main issue I had with it is that in order for the schedule to run, Claude Code must be open and active in a terminal on your computer.

I’m often travelling around and my machine isn’t constantly on, with the terminal running ready to complete tasks.

Which got me thinking back to OpenClaw.

I tried OpenClaw (or Clawdbot or Molty as it was then known!) when it first came out.

It took ages to set up, and I felt like I was constantly debugging it trying to get it to do the most basic of tasks reliably.

But after reading about how many updates have been shipped to it, and seeing people doing interesting things using it recently I decided to give it another go.

My objective was to take the local Claude Code project I’d built locally and have it run autonomously on OpenClaw on a schedule, and for it to message me in a Slack channel whenever I needed to take action on something.

So with this in mind, I headed over to Hetzner and set up their cheapest server at $4 a month where I’d run my OpenClaw.

Then I headed back into Claude Code and explained what I was trying to do.

I gave Claude the details of the server I’d just created, it’s IP address etc and the official docs for installing OpenClaw.

As I was installing this on a totally clean VPS I decided to run Claude in ‘yolo’ or claude --dangerously-skip-permissions mode where it can bascially go off and do whatever it needs to do without asking for your permission for everything.

About 5 minutes later OpenClaw was up and running on the new box, and I proceeded to the next part of the mission… move the ads monitor from Claude Code into OpenClaw, and have it run on a schedule.

To do this, I explained everything about what I was hoping to achieve, and that I liked the local setup I had with Claude Code and wanted to replicate that on OpenClaw.

Claude then put together a complete plan to move the code from my local machine to running on OpenClaw.

As part of setting this up, the main new thing I had to create was a private Slack app which would be able to post to my #marketing channel, and listen for my replies.

I also wanted to be able to approve and disapprove actions using emojis, like in the example above.

Here I have a report with a bunch of recommendations, with a request to creat 3 new ad variations if I add a checkmark emoji to the post.

It’s been working amazingly well for me so far! I get a daily report delivered into my Slack marketing channel of how each ad is performing and where to make adjustments, I can even chat back with the bot if needed so I’m finding I never even look at the OpenClaw UI.

I have since decided to take this even further, creating multiple agents on the OpenClaw to help me out with various marketing tasks I don’t enjoy doing

Writing Blog Posts

I set up a skill which writes and publishes new blog posts, even generating custom on brand illustrations and images using Gemini. I set up a monthly job where I create a content plan, then every day OpenClaw writes and publishes the post to my blog automatically.

Web Analytics

I’ve also given OpenClaw the ability to pull data from the Google Analytics API to see how all the marketing is performing and make adjustments as it goes.

I’m hoping that having access to this data helps with both improving our ad performance in optimising messaging, and our SEO through better blog posts targetting weak spots.

Social Media

I built a social media agent which runs daily and suggests posts for LinkedIn and X based on all our other content like the blog, product updates, reviews etc.

It then writes the posts, generates images for them using Gemini and posts them into Slack for my approval, I can either add a ✅ emoji and the post will be published or request changes.

I think it will take a bit of time to refine the writing style of this but it seems to be working fairly reliably in the week or so I’ve had this up and running.

These are just a few of the agents I’ve worked on over the last week - please do let me know if you’d like me to make tutorials or guides on how to make your own versions of these by dropping me a reply to this post.

I’m also considering releasing all of the code behind this as a starter kit as many people have been asking me about it, more on that soon.

Hopefully this gave you some ideas of new marketing agents to try out to help you day to day. This technology is moving incredibly quickly and it can be hard to keep up but I am doing my best!

Are there any other topics you’d like me to cover? Drop me a reply, I love to hear from you!

That’s it for this week, happy building!

A few weeks ago I talked about the rise of the solo founder and how AI is making it possible for one person to build and run an entire software business.

But building is only half the battle. The other half is increasingly tricky - getting people to actually notice what you’ve built.

Marketing has always been the hardest part for us solo founders. You can build an amazing product but if nobody knows about it, none of that matters. And traditionally, running a proper paid ad campaign meant hiring designers, copywriters, and a media buyer. Or spending weeks learning it all yourself.

As we know, building software using AI is almost trivial now. We’re seeing thousands of new apps launch every week, the pace is quite astonishing.

But this means that more than ever, a focus on marketing is going to be super important if you’re going to get anyone to pay attention to what you’ve built.

This week I want to show you something that has completely changed our marketing strategy. I used Claude Code to build an entire Meta ads pipeline that generates hundreds of targeted ads, creates images with AI, and uploads everything directly to Meta.

I made a quick video to demo the system below to give you an idea of what it does…

Watch the demo video

For the Create With Conference we’re currently running around 250 different ads, way more than we’ve ever been able to make before.

The interesting thing is that some of the ads that are now performing the best are ones I would never have come up with myself. Personas and angles I wouldn’t have considered.

That’s the real power of this approach. Being able to create so many different creatives gives Meta’s algorithms the chance to really experiment and discover which messages are actually getting customers interested. When previously we were only running a handful of fairly generic ads we wern’t learning much about what our audience actually wanted.

This is the first in a series of posts I’m planning on go-to-market (GTM) with AI.

We’ll be covering social media, Google Ads, X, TikTok, all orchestrated through Claude Code.

I’ve also been using Claude Code increasingly to handle other operational stuff. Like automatically generating and updating documentation for my apps.

I posted a tweet showing an example of this recently. It’s a small thing but it just shows how much of the day-to-day running of a business you can hand off to AI, manually updating documentation used to take me hours. Now Claude spins up a browser, uses the app, annotates the screenshots and updates my helpdesk for me! I’ll cover this in a future edition.

I’m going to be doing a live build of this ad machine on a Create With on Monday 16th March, you can register here, it’s free!

So lets get into building our automated Ads AI machine using Claude Code!

Before You Start

This is going to be a bit different to my usual tutorials. We’re going to be building a proper project with Claude Code. If this is your first time doing something like this, don’t worry.

The whole point is that Claude does the heavy lifting. You just need to describe what you want clearly (this is such an important skill now)

There are a few things you’ll need to set up first that will make following the tutorial much easier.

A Claude Pro subscription. You’ll need the $20/month plan or above to use Claude Code. I have 3 free guest passes to give away, so if you don’t currently have a subscription and would like a free week of Claude Code drop me a reply to this email and I’ll send over the link, first come first served!

A Meta developer account and API access. This is the bit that takes the most time to set up but it’s not difficult. You need to:

1. Go to developers.facebook.com and create an app. Choose “Other” as the use case and “Business” as the type.

2. Add the Marketing API product to your app.

3. Find your Ad Account ID. Go to your Meta Ads Manager, look in the URL bar, and you’ll see a number after act=. That’s your Ad Account ID.

4. Find your Business ID. Go to Meta Business Settings and grab it from the URL or the business info section, I just pasted in this entire URL to Claude and it picked out the info it needed.

5. Generate an access token. In your app dashboard, go to Marketing API > Tools, select all the ads_management and ads_read permissions, and generate a token. Important: these tokens expire after about 60 days so you’ll need to regenerate them occasionally.

A Google Gemini API key. We’re using Gemini to generate the ad images. Head to aistudio.google.com, sign in with your Google account, and generate an API key.

I’m going to recommend using the gemini-3.1-flash-image-preview model to generate the ads which you will need a bit of credit to use.

Node.js installed on your computer. You’ll need version 18 or newer. If you don’t have it, just search for “install Node.js” and follow the instructions for your operating system or ask Claude to do it for you, it should be able to handle everything.

Once you’ve got all of that sorted, you’re good to go!

How It Works

The system has three layers and it’s really quite a simple approach.

Layer 1: Your brand file. This is a single file that contains everything about your brand. Your colours, fonts, product name, screenshots, key messages, target audience. Everything. It’s the single source of truth that the whole system references.

Every ad it generates will be on-brand because it all pulls from this one file. You can chat back and forth with Claude to set this up, to start with I just told Claude my brand colours, logos and fonts and that was enough to get started.

You could also suggest Claude scrapes your marketing site and it could probably pick most of this up itself.

Layer 2: The creative matrix. This is where we work out what your ad angles and personas. If you already know what messaging you want to use you directly tell Claude what you’d like (the key messages or features you want to promote), your personas (the different types of people you want to reach), and your styles (the visual approaches for the ads).

If you’re not sure about how to build up the personas, just ask Claude what it recommends based on your brand.

Claude Code then generates every combination. So if you have 7 topics, 5 personas, and 4 styles, that’s 140 unique ads. Each one targeted to a specific person with a specific message in a specific visual style.

Layer 3: The upload pipeline. This handles talking to the Meta API. It takes your generated images, uploads them to Meta, creates the ad creatives with the right copy, and organises everything into campaigns and ad sets. The whole thing is automated.

Building It Step by Step

First of all don’t panic if you’re not technical! You don’t need to understand any of the code. You’re going to describe what you want to Claude Code and let it build everything for you, and then you’re just going to run it locally on your own machine.

I’ll give you the prompts I used at each stage.

I’m going to assume you’re starting in an empty project with no files, a blank slate.

Step 1: Set Up Your Project

Open Claude Code and start with this prompt:

“Create a new Node.js TypeScript project for generating Meta ads. Set up the project structure with folders for source code, generated images, and configuration. Install the dependencies we’ll need: the Google Generative AI SDK for image generation, dotenv for environment variables, and tsx for running TypeScript directly.”

Claude will create the project, set up the folder structure, and install everything you need.

It’ll also create a .env file where you’ll paste in your API keys, remember to keep these safe!

Go ahead and add your Gemini API key, Meta access token, Ad Account ID, and Business ID to that file.

You can then ask Claude to do a quick check to see if all the keys are working properly before proceeding.

Step 2: Create Your Brand File

This is the foundation of the whole system. Prompt Claude:

“Create a brand constants file that defines everything about my brand. I need sections for colours (primary, secondary, accent, background), fonts, my product/company name, tagline, key selling points, and target audience descriptions. Also define the ad formats we’ll be generating, like square for Instagram feed and portrait for Stories.”

Then customise it with your actual brand details, put your logo files etc into this folder. Tell Claude your colours, your product name, who your audience is. The more detail you put in here the better your ads will come out.

As I mentioned before, you could let Claude just crawl your marketing site if you like to populate this.

Step 3: Build the Creative Matrix

This is where you define what ads to generate. Prompt Claude:

“Create a creative matrix system. I want to define topics (key messages I want to promote), personas (different audience types I’m targeting), and visual styles for the ads. Then build a function that generates every combination of topic × persona × style. Each combination should include a description of the image to generate and the ad copy to use.”

For Create With, our topics included things like “AI is transforming how we build software” and “learn to build without code.”

My personas were indie hackers, product managers, career changers, startup founders, and agency owners.

And our styles ranged from bold typography to lifestyle photography to abstract tech visuals.

You can start small. Even 3 topics, 3 personas, and 2 styles gives you 18 unique ads. That’s already way more than most people run.

Step 4: Generate Your Ad Images

Now the fun bit. Prompt Claude:

“Build an image generation script that takes entries from the creative matrix, converts them into detailed prompts using our brand constants, and sends them to the Gemini API to generate images. Save each image as a PNG with a descriptive filename. Include a progress display so I can see what’s being generated.”

Claude will build a script that loops through your matrix, crafts a detailed prompt for each ad (including your brand colours, fonts, style requirements), sends it to Gemini, and saves the results.

You’ll end up with a folder full of AI-generated ad images, all on-brand.

One tip here. Gemini is really good at generating ads but you want to be specific in your brand spec about things like “no text in the image” or “always include the brand colours prominently.” The more specific you are, the better the results.

Step 5: Review Your Ads

You’re going to have loads of images now and not all of them will be great. Prompt Claude:

“Build a simple local gallery web page that shows all the generated images in a grid. Include a delete button on each one so I can quickly remove any ads I don’t want to use. Group them by topic and persona so I can see the full range.”

Claude will spin up a little local web server with a gallery page.

You open it in your browser, scroll through all your ads, and delete the ones that aren’t up to scratch. I usually keep about 70 to 80% of what Gemini generates. The quality is genuinely impressive with this latest model.

Step 6: Upload to Meta

This is the bit that saves you the most time. Prompt Claude:

“Build a Meta Ads upload pipeline using the Graph API v21.0. It should upload each image to my ad account, create ad creatives with rotating copy from our brand file, then organise everything into a campaign with ad sets grouped by persona. Use Campaign Budget Optimization so Meta can automatically shift budget to the best performing ads. Enable Advantage+ creative optimizations.”

Claude will build the entire upload pipeline. It creates the campaign, sets up ad sets for each persona group, uploads all your images, attaches the copy, and sets the targeting. You’ll also need to say what kind of campaign you’d like, eg send traffic to our landing page https://createwith.com/conference.

You tell it your daily budget and it handles the rest.

And there’s rate limiting so Claude will need to add small delays between API calls. But honestly, Claude Code handles all of this really well, it can take a bit of time if you have hundreds of ads as it will need to space out it’s requests to the Meta API.

Step 7: Monitor Performance

Once your ads are running, you want to know what’s working. Prompt Claude:

“Build a performance monitoring script that pulls daily stats from the Meta API for my campaign. Show me impressions, clicks, click-through rate, cost per click, and spend for each ad. Sort by best performing so I can see what’s working.”

This gives you a nice daily report you can run from the command line, this really impressed me.

As I mentioned earlier, the ads that are performing best for Create With are ones I would never have created manually. Different angles, different personas, different visual approaches.

The matrix approach means you’re testing so many more variations than a human (well a solo founder anyway!) would ever bother to create. And Meta’s algorithm is really good at figuring out which ones resonate.

The Results

We’re currently running about 200 ads for Create With Conference through this system. The whole thing was built in a weekend.

Previously this kind of campaign would have required a designer, a copywriter, and someone managing the Meta Ads account. Now it’s just me and Claude Code.

The most surprising result has been discovering which ads actually convert. I had assumptions about what messaging would work and which personas would respond. I was wrong about a lot of it.

The matrix approach surfaces winning combinations you’d never think to try.

What’s Coming Next

This is just the beginning of a series on go-to-market with AI.

In the next few editions I’m going to cover using the same matrix approach for social media content generation, expanding to Google Ads, X, and TikTok using the same pipeline, and building a unified marketing dashboard that monitors everything in one place.

The vision is a solo founder running a full-scale marketing operation across every major channel, all orchestrated through Claude Code.

A marketing team of AI agents!

Create With Conference 2026

If any of this stuff excites you, Create With Conference on June 25th in Brighton this year is for you. Live coding with AI, building and marketing as a solo founder, and the future of no-code and AI. It’s going to be brilliant and I’d love to see you there.

That’s it for this week! If you try building your own ad pipeline I’d love to hear how it goes. Just hit reply and let me know.

Don’t forget if you’d like to join the Live session and follow along me building this system in realtime register here.

Happy building!

James

P.S. Advance tickets for Create With Conference are still available at https://luma.com/createwith26. Grab yours before they’re gone!

Subscribe now

Welcome back to NoCode SaaS. This is the newsletter where I take you along for the ride of building and scaling a software business without code using AI.

This week I want to show you something that felt like magic when I first tried it.

I got Claude Code to build me an entire SEO strategy. It researched my competitors, analysed keywords, looked at what content is ranking, and came back with a prioritised plan of exactly what pages I should add to my website to improve my search rankings.

All backed by real data. And it took about 20 minutes!

But before I get into how I did it, I want to talk about why I think this stuff matters so much right now.

The Shift That’s Happening

No-code made building software easy. AI is making it even easier.

When anyone can spin up an app in a weekend, the hard part isn’t building anymore. It’s getting people to notice what you’ve built.

Capturing attention is becoming the most important skill for indie founders. Marketing is the bottleneck now.

If I’m being honest, marketing is my least favourite thing to do. I’d much rather be building features than writing blog posts or figuring out SEO. But as a solo founder, you don’t get to just ignore it.

So the holy grail for me is getting Claude Code to help run marketing autonomously.

I want a marketing team of agents instead of a bunch of employees I have to manage. A team that can help me grow my app without needing to hire anyone. I’ve been actively experimenting with ways to do this using Claude Code and tools like OpenClaw.

MCPs are a big part of that story. They’re how you give Claude Code the ability to actually do things. Research keywords. Check rankings. Analyse competitors. Post content. All of it.

If you haven’t tried Claude Code yet, or you’ve been intimidated by it, this is a really good way in. It’s pretty easy to set up. You don’t need to be technical.

I’ll walk you through the whole thing step by step below. And by the end you’ll have something genuinely useful - an AI-generated SEO plan based on real data.

Over the next few months I’m going to cover a lot of the MCPs and tools I’m using in Claude Code (and remember, I’m not a developer!)

They’re giving it capabilities we couldn’t have even imagined last year for building software. This week we’re starting with two that completely changed how I think about SEO.

What Are MCPs?

MCP stands for Model Context Protocol. But you don’t really need to remember that. Just think of them as tools you give to Claude Code that it can decide when and how to use. You can read more about MCPs in the official documentation.

Here’s what makes them different from something like a Bubble plugin or an API connection. With those, you’re in control. You set up the connection, you decide when it fires, you tell it exactly what to do.

With MCPs, you’re giving Claude Code a capability and letting it figure out when to use it. You say “I want an SEO strategy for my website” and Claude decides: okay, I need to crawl the site first, then I need to research keywords, then I need to compare them. It picks the right tools for the job and chains them together.

I really realised Claude Code was an unbelievable tool once I added the Supabase MCP. I’ve written about Supabase before, but this really suprised me with just how easy it made things.

I was working on a project and Claude just went off and completely configured the database for me. Set up the tables, configured the security rules, linked it all up to my project.

It was amazing to watch it work.

Claude Code on its own is incredibly clever. But it can’t see the full web. It can’t check how your site is ranking on Google. It can’t browse your competitors’ websites. It can’t update your database. MCPs unlock all of that.

The really nice thing is that setting them up is way easier than you’d think. Most of the time you’re just adding a line to a config file. No coding required. I’ll show you exactly how below.

The Two MCPs I Used

For this SEO project I used two different MCPs together.

Playwright

Playwright is an MCP that gives Claude Code a real browser it can control. It can visit websites, click around, read content, basically do anything you can do in Chrome.

I used it to fetch my entire website. Claude visited every page on my site, grabbed all the content, saved it to markdown files, downloaded the images, and built a complete local copy of my site structure. By the end of it, Claude had full context of everything I’ve already published. Every blog post, every landing page, sitemaps etc.

This is important because Claude needs to know what content you already have before it can tell you what’s missing.

SerpAPI

This is the star of the show. SerpAPI gives Claude Code access to live search engine data. And I mean everything… Google search results, autocomplete suggestions, related keywords, what your competitors are ranking for, news results, shopping results.

Basically all the stuff you’d normally pay hundreds of pounds a month for with tools like Ahrefs or SEMrush.

They have a free tier which is more than enough to test this out and see if it’s useful for you. And setting it up is super simple. You literally just add a URL to your Claude Code config with your API key in it. That’s it.

Once it’s connected, you can just ask Claude things like “what keywords could my site rank for?” or “what are my competitors ranking for that I’m not?” and it will go off and actually research it using real search data.

How To Set This Up (Step by Step)

Here’s exactly how to get this working. It’s easier than you’d think.

Step 1: Get Claude Code Running

If you don’t already have Claude Code installed, head to claude.ai/code and follow the setup instructions. You’ll need a Claude Pro or Max subscription.

Once it’s installed, open your terminal and type

claude to start it up.

Step 2: Install the Playwright MCP

In your terminal, run this command:

claude mcp add playwright -- npx @anthropic-ai/mcp-server-playwright

That’s it. Playwright is now connected to Claude Code.

Step 3: Set Up SerpAPI

First, head to serpapi.com and create a free account. Once you’re in, grab your API key from the dashboard.

Now add the SerpAPI MCP to Claude Code. The easiest way is to use their hosted version. Run this command, replacing YOUR_API_KEY with your actual key:

claude mcp add serpapi --url https://mcp.serpapi.com/YOUR_API_KEY/mcp

You can find more details on the SerpAPI MCP integration page.

Step 4: Verify Your MCPs Are Connected

You can check that both MCPs are working by asking Claude Code to list its available tools. Just type:

What MCPs do you have access to?

You should see both Playwright and SerpAPI listed.

Step 5: Run the SEO Analysis

Now for the fun part. Here’s the prompt I used to kick off the whole workflow:

I want you to help me create an SEO content strategy for my website [YOUR WEBSITE URL].

First, use Playwright to crawl my website and save all the content to markdown files locally. I want you to understand what topics I've already covered.

Then use SerpAPI to research keywords in my niche. Look at what's ranking, what questions people are asking, and what my competitors are covering.

Finally, compare my existing content against the opportunities you find. Give me a prioritised list of new pages I should create, with the keyword, estimated search volume, and why I have a chance of ranking.

Claude will take a few minutes to crawl your site and run the keyword research. You’ll see it working through everything in the terminal.

And that’s it. You’ll get back a full SEO content plan based on real search data.

The next step is to get Claude Code to actually implement it’s recommendations and make all the SEO improvements itself, I’ll cover this in the future.

Coming Up: More MCPs

This is just the start. Over the next few months I’m going to cover the MCPs that have become essential to how I build:

Supabase for database operations directly from Claude Code. Super useful for setting up backends and managing data. If you’ve read my previous posts on Supabase + Bubble, you’ll love what the MCP can do.

Apify for web scraping and automation at scale. When Playwright isn’t enough and you need to scrape thousands of pages. I’ve covered using Apify with Bubble before but the MCP integration is even more powerful.

Context7 which gives Claude Code access to always up-to-date documentation for basically every API out there. Game changer for building integrations.

Notion to connect your docs and knowledge base. Let Claude read and write to your Notion workspace.

Vercel to deploy straight from Claude Code. Build something and ship it without leaving the terminal.

Each one unlocks new capabilities. I’ll show you how I’m actually using them in real projects.

One More Thing: Bubble + Claude Code

Speaking of MCPs, this is exciting news for the Bubble community.

George Collier just announced Buildprint 2.0 which connects your Bubble app directly to Claude Code. And Cursor, ChatGPT, and other AI tools.

It gives AI access to your Bubble logic, data, and logs. It can pull tickets from your project management tool, trace issues through real workflow runs, generate documentation, explain how systems work, and plan new features. And soon it’s going to be able to implement changes for you.

This is exactly the direction I’ve been talking about, it’s so exciting to see agentic tools appearing for platforms like Bubble as well as code first platforms.

Check out George’s announcement here:

Wrapping Up

The tools are evolving so fast. Six months ago I couldn’t have imagined having Claude Code research my SEO strategy for me. Now it’s something I can set up in an afternoon.

If you’re not experimenting with this stuff yet, now’s the time to start. And if the SEO angle isn’t your thing, stick around for the upcoming MCP tutorials. There’s going to be something useful for everyone.

I rebuilt my entire personal website this week in Claude Code, so I can cover how to build marketing sites in the future from start to finish if you’re interested in that, let me know.

That’s it for this week! I’d love to hear if you try this out. Just hit reply and let me know how it goes.

Happy building!

James

P.S. Create With Conference Advance tickets are still available. We’re going to be covering a lot of this stuff in person. Live coding with AI, MCPs, the whole lot. Grab your ticket here.

Subscribe now

Welcome back to NoCode SaaS. I’m kicking off 2026 with a fresh approach to this newsletter.

This year I’m going to be focusing on solo founders using AI to orchestrate agents to run a SaaS business as an independent operator. I believe we’re at an inflection point where a single person can build and run software businesses that would have required entire teams just a year ago.

But first let me tell you about what I’ve been up to.

Where I’ve Been

Last year I met founders building with AI all around the world at our Create With AI Meetups - from London to Bangkok!

The one thing that everyone I met had in common was they were high agency people actually getting stuff done using AI. Whether it’s building their app, making marketing materials or even managing their schedules.

I also visited Singapore for the AIMX conference which was a totally different vibe. This was all about real-world AI. Humanoid robots, physical automation, AI in manufacturing and logistics.

Whilst in this newsletter I’m largely going to be focussed on AI that helps you build and run a business it’s important to remember the coming wave of ‘embodied AI’ in robots, cars and just about everything else.

The Rise of the Solo Founder

I believe 2026 is going to be the year of the solo founder.

We’re seeing more and more people going independent. Quitting their jobs, particularly product managers and operators, and learning to build and orchestrate their own software using AI.

And they’re running these businesses super profitably because they don’t have a huge salary bill, office costs, or any of the traditional overhead.

The economics have completely flipped. What used to require a team of five or ten people can now be done by one person orchestrating a team of AI agents.

Kieran’s a great example of this. Back in July he wrote a blog post saying he wasn’t sold on vibe coding. It wasn’t stable enough, too many bugs, he was sticking with nocode.

Fast forward to December and he finally gave Claude Code a proper try. Now he’s completely converted.

He’s rebuilt all his static websites, replaced a $39/month blog platform with his own custom solution hosted for basically nothing on Vercel, and even built his own course platform to replace Podia after they sent him a bill for $900 for the year. The whole thing just works and he built it himself.

And that’s the mental shift I think is really important here. You’re not replacing yourself with AI. You’re becoming a conductor of all these different agents.

You have different agents handling different things. Development, customer support, data analysis, content.

You’re directing the orchestra, not playing every instrument (not always easy if you struggle to delegate 😂)

The “self-driving startup” that I’ve talked about before in this newsletter isn’t a dream anymore. It’s reality.

What Claude Code Means for No-Code Developers

Let’s address the elephant in the room. If AI can now write code, and write it really well, do no-code tools still matter?

Right now I do think they still have a part to play.

For example, if I hadn’t starting building my own apps with Bubble there is no way I would have ended up being so comfortable making things using AI generated code, using APIs etc.

Using a no-code tools is still a great entry point for building things, because it’s a visual platform you can literally see everything (UI, workflows, db, files etc) and see exactly how everything is working.

No-code tools teach you how to think logically, how to build and structure a system. Right now, Vibe Coding often feels a bit like the Wizard Of Oz… you don’t really know who is pulling the levers behind the curtain or how anything acutally works.

Personally, I use Claude Code and Bubble together. Claude Code handles the backend of my app and the high-frequency services where I need performance and cost efficiency. Bubble controls most of the user interface and the core logic where I need visibility.

However I must admit I am finding myself increasingly frustrated when using nocode tools at how long it takes to do things manually - in particular building UI. I don’t want to waste an hour building a login page or dashboard when I know AI could do it in 30 seconds (and do a better job than me)

Visibility is actually the huge advantage that no-code tools still have.

Not just over traditional coding, but over AI-generated code too. Everything is visual.

You can see exactly how your app works. The data flows, the logic, the connections. It’s all right there on the canvas.

Whilst I think it’s inevitable all nocode tools transition to being primarily AI driven (or die), it’s also true that the Vibe Coding platforms like Loveable are moving to bring more visual editing into their apps too, so I suspect we will end up somwhere in between. Where you can describe your app in plain English, then visualise everything about how it works visually.

Here’s something I think about a lot though.

If you had a $20k MRR app, would you really be comfortable with it being 100% vibe-coded and having no idea how it actually runs today?

When something breaks at 2am, can you fix it? Do you even know where to look?

The DevOps angle with fully AI-generated code is tricky right now. Monitoring, debugging, understanding what’s actually happening under the hood. It’s a bit of an issue if you don’t really understand the codebase.

But I’m pretty confident this gets solved within six months.

I’ve already seen examples of people running Claude Code in YOLO mode on dev servers and having it do its own sysadmin. Would I do that in production right now? Absolutely not. But it proves the concept.

It shows us where this is heading. AI that doesn’t just build your software but deploys it, monitors it, and fixes it too. We’re not there yet but the direction is crystal clear.

The hybrid approach I’m using has been transformational for UserLoop. I’ve been able to build loads of new features, migrate older parts of the app into a completely new architecture, and radically reduce costs.

All while maintaining visibility into how everything works.

This week I decided to challenge Claude Code to build an entire new Shopify app from scratch. I used the Shopify Dev MCP which basically describes everything from the compliance rules to how the UI should be structured to how the API works. I went into plan mode, described the app I wanted in detail, let Claude go off and make a plan using the MCP to understand all Shopify’s requirements, then let it execute.

A couple of hours later I had a fully embedded Shopify app built to their “Built for Shopify” standards. Even with no-code tools that would have taken months previously, or not even been possible at all (UserLoop is not even an embedded app today!)

It’s honestly hard to overstate how much things have changed.

It did also get me asking - if it’s so easy to build software now, does it even have any inherent value? Some interesting times are coming for SaaS for sure.

AI for Marketing - where are all the tools?

Right now most AI content online is focused on building software.

And yes, Claude Code has made it incredibly easy to build. But building is only half the story.

What about marketing? What about operations? What about all the other stuff that actually makes a business run?

This is where I think the even bigger opportunity lies.

We’ve actually been doing this ourselves with Create With. Kieran’s been building out a custom internal dashboard that’s basically replacing a bunch of different tools we were using. Zapier, n8n, Google Sheets, Notion, all of it.

It watches all the AI news, ranks stories by relevance to our audience, helps us put together the newsletter. And we can just keep adding features whenever we need them. It’s becoming our own little operating system for running the conference.

You can use AI to orchestrate your entire business, not just your codebase.

Content creation, marketing campaigns, customer outreach, analytics, reporting. All of this can be handled by AI agents working together. The full picture isn’t just “build with AI.” It’s “build with AI and run with AI.”

I’m even using Claude Code to generate our marketing visuals for the conference (on brand right?)

This is how solo founders can now genuinely compete with funded startups.

You’re not just a developer anymore. You’ve got an AI-powered team handling development, marketing, and operations. You’re the founder directing all of it.

I’m going to be writing a lot more about using AI for marketing this year as I learn new things.

Looking Ahead to 2026

I’ve never been more optimistic about the future of building software.

We’re going to see a huge wave of independent operators launching profitable businesses this year.

People leaving traditional jobs to build their own thing. Product managers who understand users and problems, now able to build and ship solutions themselves.

The combination of no-code for visibility, AI for speed, and agents for operations creates a complete business engine that one person can run.

If you’ve ever thought about making the jump and building something of your own, now is the time. The tools have never been better, the barriers have never been lower, and the opportunity has never been bigger.

Create With Conference 2026

Speaking of where things are heading, I’m thrilled to announce that this year’s Create With conference is moving to the Brighton Centre!

It’s going to be much bigger than previous years and the theme is going to focus on exactly these questions. Live coding with AI, what it means for builders, and how to navigate this new landscape. More details coming soon but save the date.

This is going to be the place to be if you’re thinking about any of this stuff. Today is the final day for early bird tickets.

What’s Coming Next

This newsletter is taking a fresh approach for 2026. I’m going to be focusing on solo founders and how to build and run a SaaS business as an independent operator.

AI orchestration and using agents to handle development, marketing, and operations.

Real examples of what’s actually working, what isn’t, and what I’m learning along the way.

I’m really excited to take you along for the ride!

That’s it for this week! I’d love to hear what you’re building or thinking about. Just hit reply and let me know.

Happy building!

James

P.S. Early bird tickets for Create With Conference are just £35 but they end TONIGHT at midnight! Grab yours here.

Welcome to this week's NoCode SaaS newsletter, where I take you along on the journey of building a profitable business without code using AI.

This week I want to show you something that's changed how we work internally at Create With - building custom MCP servers using n8n.

I recently saw a fascinating thread from Toby Lütke, the CEO of Shopify, following up on his widely shared AI first memo about their internal tool called Scout.

It's essentially an internal MCP server and has indexed hundreds of millions of merchant feedback items, giving anyone at Shopify instant access to customer insights.

But what really caught my attention was that Shopify isn't just using MCPs as simple connectors.

They're treating them as the backbone of a new kind of company operating system.

Every team is building MCP-powered tools that are living, breathing extensions of their expertise.

Their Creative Production team has an agent, their Product team has the AlphaAI mesh, and they have a VibeOps Stack for internal development.

Each tool doesn't just share data - it shares the team's entire playbook, workflows, and know-how.

This is exactly the direction we've been moving at Create With, and today I'm going to show you how to build your own MCP server in n8n and connect it to Claude.

It’s a lot easier to set up than you might think - you don’t need write any code!!

Once you see how powerful this is, you'll understand why MCPs are becoming the new standard for how companies operate with AI.

What exactly is an MCP server?

Before we dive into the how-to, let me quickly explain what MCP (Model Context Protocol) servers are and why you’re reading about them everywhere at the moment.

MCP is a protocol that lets AI assistants like Claude connect to external data sources and tools in a standardized way.

But it's becoming much more than just a connector, companies like Shopify are using MCPs as the backbone of their entire AI operating system.

Think of it as creating not just a bridge between your AI and your data, but packaging your team's entire expertise into something that can be accessed and used by anyone in your organization.

When you build an MCP server, you're essentially creating what some are calling "an expert in a box". Your workflows, knowledge, and decision-making processes all become accessible through natural language.

The MCP repository becomes your gateway to all company knowledge and capability.

The beauty of building your MCP server in n8n is that you get all the flexibility of n8n's workflow automation combined with the intelligence of AI.

You can connect to literally any data source or app that n8n supports. Databases, APIs, spreadsheets, you name it.

Why build your own MCP server?

There are some really compelling reasons why MCPs are becoming the new standard:

Teams become scalable through their tools. Instead of being a bottleneck, each team can package their expertise into MCP powered tools that anyone can access. It's like cloning your best people's knowledge and making it available 24/7 (imagine getting less of those weekend Slack messages!!)

Building agents that know your business. Building MCPs containing all your data doesn’t just benefit the humans you work with, you can also give access to AI agents. For example in n8n you could have an AI Agent that can query data from your MCP about your latest content and automatically write social posts about it.

Instant access to expertise: Instead of scheduling meetings or waiting for responses, anyone can tap into any team's knowledge immediately through natural language queries.

Keep your tools organized: Once you build an MCP server in n8n, you can reuse those same tools from any workflow or AI agent. It becomes part of your company's AI operating system. You only have to update it one place.

Works everywhere: You can use these MCP servers from Claude, from within n8n itself, or from any tool that supports the MCP protocol (there are more and more every week). Build once, use everywhere.

I really think understanding MCPs and learning how to use them is important for any business who is serious about embeddeing AI in everything they do.

Watch the video tutorial

I've recorded a video tutorial that walks through the entire process of setting up your MCP server in n8n and connecting it to Claude. In the video, I show you our actual Create With MCP server in action and demonstrate how to build your own from scratch.

I would recommend reading my previous post about building a RAG database if you follow this tutorial as we are using a lot of what we built in that here.

Watch the tutorial

Setting up your first MCP server in n8n

Below I'll walk through the key steps from the video tutorial in more detail. If you prefer to follow along visually, definitely check out the video above first.

Step 1: Create the MCP Server Trigger

First, you need to create a new workflow in n8n and add an MCP Server Trigger node. This is what will listen for requests from Claude.

When you add the MCP Server Trigger, n8n will generate a unique URL for your server. This is the URL you'll need to connect Claude to your MCP server later. It'll look something like:

https://your-n8n-instance.com/webhook/mcp/your-unique-id

Keep this URL handy - you'll need it in a minute.

Step 2: Connect your tools

Now comes the fun part - connecting the tools and data sources you want to make available through your MCP.

In our Create With server, we've connected six different tools:

• Events database

• Featured content

• Tweets

• Newsletter archives

• YouTube video transcripts

• Internal documentation

Each tool is connected as a separate branch from the MCP Server Trigger. The key here is that each tool needs a clear description so Claude knows when to use it.

For example, our YouTube videos tool has this description: "Contains a database of YouTube videos published on the Create With YouTube channel"

This description is crucial, it's what Claude uses to decide which tool to use when you ask it a question.

Step 3: Set up your data retrieval

For each tool, you need to configure how it retrieves data.

We're using a Supabase vector store for our RAG (Retrieval Augmented Generation) database, but you could use any data source n8n supports.

If you want to learn more about setting up a RAG database in Supabase, check out my previous tutorial on creating RAG databases.

Here's how we configured our YouTube videos tool:

1. Added a Supabase Vector Store node

2. Set it to retrieve up to 50 results

3. Added a metadata filter to only pull YouTube video content

4. Connected it to GPT-4 for processing

5. Used OpenAI's embeddings for semantic search

The beauty of using a vector store is that you can ask natural language questions and it will find semantically similar content, not just keyword matches.

Step 4: Connect Claude to your MCP server

Now for the magic moment - connecting Claude to your new MCP server.

1. Open Claude's settings

2. Go to the Connectors section

3. Click "Add Custom Connector"

4. Paste in your MCP server URL from Step 1 - make sure you use the production URL!

5. Give it a name (like "My Company MCP")

That's it! Claude will now show your MCP server in its list of available tools.

Testing your MCP server

Once everything's connected, you can test it right in Claude. Just ask a question that would require data from your MCP server. For example, I asked Claude:

"Can you write a tweet based on the latest Create With YouTube video?"

Claude automatically recognized it needed to use our MCP server, requested permission to access the YouTube videos tool, pulled the latest video data, and generated a perfect tweet based on the content.

The first time Claude uses each tool, it will ask for permission. You can click "Allow Always" if you want it to use that tool without asking in the future.

Advanced tips and tricks

Using your MCP from other n8n workflows

One of the coolest things about building your MCP in n8n is that you can use it from other workflows too.

Just add an MCP Client node to any workflow, paste in your MCP server URL, and boom - that workflow now has access to all your MCP tools.

This is incredibly useful for keeping your automation organized. Instead of rebuilding the same data retrieval logic in multiple workflows, you build it once in your MCP and reuse it everywhere.

Adding authentication and security

If you're dealing with sensitive data, you'll want to add authentication to your MCP server. n8n makes this easy with built-in authentication options for webhooks. You can use:

• Basic authentication

• Header authentication

• Query parameter authentication

• JWT tokens

For our internal MCP, we use header authentication with a secret token that only our team knows.

Monitoring and debugging

n8n's execution history is really useful for debugging your MCP server.

You can see exactly what queries Claude is sending, what data your tools are returning, and where any errors might be occurring.

Pro tip: Add a Set node after each tool to format the response data exactly how you want Claude to see it. This gives you fine control over what information gets passed back.

Combining multiple data sources

Don't limit yourself to just one data source per tool.

You can create complex workflows that pull from multiple sources, process the data, and return a unified response.

For example, we have a tool that combines customer feedback from our surveys with purchase data from Shopify to provide insights on how feedback correlates with customer behavior.

The MCP handles all the complexity, Claude just sees a simple tool it can query.

Building your company's AI operating system

What's really exciting about this approach is that you're not just building isolated tools, you're creating what's essentially an AI-powered operating system for your company.

At Shopify, teams aren't just sharing data through their MCPs, they're sharing their entire playbook. Scout gives access to hundreds of millions of merchant feedback items, but more importantly, it provides the context and workflows for how to interpret and act on that feedback.

This is intentional architecture, not accidental automation. When you build MCP servers this way, you're creating:

• Knowledge repositories that capture not just information but expertise

• Workflow automation that encodes your team's best practices

• Composable tools that can be mixed and matched for new capabilities

• Living documentation that stays current because it's actively used

The shift here is profound - instead of AI replacing people, it's amplifying them. Each expert in your company can package their knowledge and make it accessible to everyone. Your company becomes smarter as a whole.

Getting started with your own MCP

If you want to build your own MCP server, here's what I'd recommend:

1. Start simple: Pick one data source to begin with. Maybe your customer feedback, your documentation, or your product catalog.

2. Use existing tools: If you already have workflows in n8n that retrieve data, you can easily adapt them to work with an MCP server.

3. Test thoroughly: Use Claude to ask various questions and see how your MCP responds. Refine the tool descriptions and data retrieval until it works smoothly.

4. Expand gradually: Once you have one tool working well, add more. Each new tool makes your MCP server more powerful.

5. Share with your team: The real power comes when your whole team can access internal knowledge through Claude. Set up MCP connections for everyone who could benefit.

What's next?

The MCP ecosystem is evolving rapidly. What we're seeing at companies like Shopify and what we're building at Create With is just the beginning. MCPs aren't just connectors anymore, they're becoming the backbone of how AI-powered companies operate.

Every tool, every workflow, every bit of expertise can be packaged and made accessible through this new operating system.

Resources

If you want to learn more about building AI agents and automation, check out the Create With YouTube channel where we have uploaded a ton of other tutorials.

Also don't miss our weekly Create With podcast where we discussed MCP servers in detail this week.

That's it for this week!

Building your own MCP server might seem complex at first, but hopefully the video tutorial should make it a bit clearer. Once you get it running, I think you’ll get addicted to adding more and more tools to build out your companies’ own AI operating system!

Let me know if you build your own MCP server - I'd love to hear what tools you connect and how you're using it! Tag me on X/Twitter @jamesdevonport with your creations.

Thanks again for reading, and happy building!

James

P.S. - We just launched the new Create With Membership program with office hours where youc an ask quesitons about building your own AI company operating system, get tutorials, courses and early invites to our events.

Share NoCode SaaS

This week I wanted to focus on adding AI agent capabilities to your Bubble app visually without any code at all.

If you’re like me, you’ve probably seen a ton of hype around n8n recently. Whether it’s on YouTube, X or LinkedIn it’s almost impossible to escape the endless screenshots of super complex workflows that people are sharing.

I admit there is a lot of quite over hyped content around n8n, sometimes showing fake workflows that don’t stand up to scrutiny when you actually try and use them for real in production.

However, over the last few week’s I’ve been really diving into n8n and using it a lot more to help with real life day to day operations in two companies I’m working on, UserLoop and Create With.

It’s some of the most fun I’ve had building things since I first discovered Bubble 7 (😱) years ago. The standout feature in n8n which got me so excited to learn it is AI Agents.

So rather than just building regular workflows that complete tasks in a predefined order one step at a time, you can add intelligent agents which have access to a set of tools and can actually take actions based on the instructions you give them.

What is n8n?

For those who haven't encountered it yet, n8n is a workflow automation platform that lets you connect different apps and services together without writing code.

For people coming from the Bubble world - it’s effectively a combinations of Bubble’s backend workflows and API Connector. But with some added extra AI magic we’ll talk more about in a bit.

While you might be familiar with tools like Zapier or Make, n8n takes a different approach that gives you way more control and flexibility.

While this does mean it can be a bit more intimidating for beginners with a slightly steeper learning curve, putting in the extra time to learn it really pays off.

The key difference that sets n8n apart is its open architecture. You're not limited to pre-built integrations - you can connect to virtually any API, write custom code snippets when needed, and even create your own nodes. This means you can automate processes that would be impossible with other tools, especially when you need to handle complex business logic or unusual data transformations.

To make things even easier, n8n recently really enhanced their support for Community Nodes. These are wrappers for various APIs and services that members of the n8n community have put together to make it super easy to connect to services like Firecrawl even thought there isn’t an official integration.

You can install them in one click and everything is set up and ready to go for you.

The interface itself is pretty intuitive - you drag and drop nodes onto a canvas and connect them visually. But don't let the simplicity fool you. Under the hood, you're actually building with the super powerful AI framework Langchain.

As a result you can build some absolutely mindblowing automations that can rival custom coded solutions, all without touching a single line of code.

Why n8n is Exploding Right Now

I think one of the biggest reasons for n8n's explosive growth is actually their approach to hosting.

Unlike most SaaS tools that lock you into their pricing tiers, n8n gives you genuine choice - and that's been critical to their success.

You can start with n8n Cloud if you want the simplest setup. It's hosted, managed, and you don't need to worry about any technical stuff. But here's where it gets interesting - you're not trapped there.

The self-hosting option is what really sets n8n apart. We actually host our internal Create With n8n instance on Elest.io for just $10/month, and it completes thousands of tasks without a problem.

Elest.io even handles automatically updating the n8n software for us every week, and keeps backups. So even though it’s self hosted it feels a lot like a SaaS type experience.

Think about that for a second - we're running complex AI workflows, handling massive volumes of automation, and our monthly hosting cost is less than most people spend on coffee.

This flexibility means you can start small with the cloud version, then as you scale up and understand your usage patterns, you can move to self-hosting and dramatically reduce your costs.

This chart caught my attention this week, showing the breakdown in n8n’s growth between self hosted (purple) and cloud (yellow) - there’s actually a fairly even split between them. So not everyone is self hosting, many are also just using n8n’s own cloud hosted version!

The one major downside of self hosting n8n is that it requires a little more setup when it comes to connecting external services. Whereas the cloud version takes care of most of this for you with simple one click integrations, the self hosted version requires you to do more manual setup for each tool you want to connect to.

However, the n8n docs are incredible and guide you step by step through hooking everything up, plus there are endless amazing tutorials on YouTube for everything you could want to connect.

Small plug: I just posted my tutorial for building a custom AI database system using n8n and Supabase to the Create With YouTube channel.

So that’s a bit of context around why I’ve been getting so excited about n8n. The combination of AI agents, self hosting and tons of integrations makes it an indespensbible tool in every nocoder’s back pocket.

And what’s more, it integrates super easily with my all time favourite nocode tool - Bubble!

Let’s dive into building your first n8n AI agent and hooking it up to Bubble.

Connecting Bubble to an AI Agent in n8n

Bubble doesn’t have any built in AI Agent functionality right now, but thankfully it’s super easy to hook it up to n8n and start building custom agents.

For this mini tutorial I’m going to assume you already have an n8n account set up and running, and have added your OpenAI API key as a credential.

If you’re totally new to n8n and are interested in self hosting it I recommend checking out this YouTube video which guides you through deploying n8n self hosted on elest.io

We’re going to be connecting to n8n via the API Connector in Bubble, and optionally accepting a response back via a backend workflow to deliver the result of our agent back into Bubble.

For the tutorial I’m going to build a simple AI Agent which will help us onboard new users to a SaaS app.

Here’s what it will do…

1. Bubble will send a POST request to n8n using the API Connector whenever a new user signs up.

2. The POST request will include some basic info about the user who signed up like their name, email, company name, domain name and the plan they selected.

3. When this lands in n8n it will trigger our Webhook trigger and start our workflow running.

4. We will then go straight into an AI Agent node which we will give some instuctions to telling it to write a personalised welcome email to the user.

5. It will have access to a couple of tools…

   1. Firecrawl to crawl the user’s website (we will get the domain passed to us from Bubble). This will return us a block of markdown which we can feed into the agent to help it personalise it’s email to the user.

   2. Gmail to send a email to the user from my Gmail account.

6. We can then optionally also return that data back to Bubble via another HTTP request which hits a backend workflow in Bubble.

Step 1: Setting Up Your n8n Workflow

First things first - we need to create our n8n workflow. I'm going to assume you've already got n8n set up (either cloud or self-hosted) and have added your OpenAI API key as a credential.

The workflow is pretty straightforward - we've got 4 main nodes:

1. Webhook - This receives the POST request from Bubble

2. AI Agent - The brain of our operation that writes the welcome email

3. Three tools connected to the AI Agent - OpenAI Chat Model, HTTP Request (for Firecrawl), and Gmail

4. Post to Bubble - Sends the result back to Bubble (optional)

Let's build this step by step.

Step 2: Creating the Webhook Trigger

Start by adding a Webhook node to your canvas. This is what will receive the data from Bubble.

Click on the Webhook node and you'll see all the configuration options. The key things to note:

• HTTP Method: Set this to POST

• Path: You can leave this blank or add a custom path like /new-user

• Authentication: For testing, you can set this to "None", but for production I'd recommend setting up Bearer Token authentication

The webhook will automatically generate a URL that looks something like:

https://n8n.yourdomain.com/webhook-test/yourwebhookid

Copy this URL - you'll need it for the Bubble API call later.

Step 3: Setting Up the Bubble API Call

Now let's switch over to Bubble and set up the API call that will trigger our n8n workflow.

In Bubble, go to your API Connector and create a new API:

• Name: "New Signup" (or whatever makes sense for you)

• Authentication: If you set up Bearer Token auth in n8n, add that here. Otherwise leave as "None"

• Shared headers: Leave blank for now

Create a new call:

• Use as: Data

• Data type: JSON

• Method: POST

• URL: Paste that webhook URL you copied from n8n

• Headers: Add Authorization: Bearer YOUR_TOKEN if you're using auth

• Body type: JSON

In the body, you'll want to send all the user data that the agent might need:

{
  "first_name": "<first_name>",
  "email_address": "<email>",
  "last_name": "<last_name>",
  "source": "<source>",
  "company": "<company>",
  "website": "<website>",
  "plan": "<plan>"
}

Replace the <> values with dynamic data from your Bubble app.

This is just some example data from my app that I want the agent to have to complete it’s task, so you should just inject whatever you want to send to n8n from Bubble here.

Step 4: Setting Up the AI Agent

Now for the exciting part - the AI Agent! Add an AI Agent node and connect it to your webhook.

Here's where the magic happens. In the System Message field, you want to give your agent clear instructions about what it should do.

Here's what I used:

Your job is to write a personal welcome email to new users signing up to the UserLoop survey app.

Use the website GET tool to get the user's website to help customise your welcome message and make it more personal.

Keep the email friendly, professional, and around 150-200 words.

The key here is being specific about what you want the agent to do, but not being too prescriptive about how it should do it.

You want to give it enough flexibility to be creative while staying on task.

Give it instructions on when it should use tools, and what it should use them for.

Step 5: Adding Tools to Your Agent

This is where n8n really shines. We're going to give our agent access to three tools:

Tool 1: OpenAI Chat Model

This is the "brain" that will actually write the email content. Connect an OpenAI Chat Model node to your AI Agent.

I recommend using either the 4.1 model or o3 for more complex tasks.

Tool 2: HTTP Request (Firecrawl)

This tool will crawl the user's website to get content that the agent can use to personalise the email. Add an HTTP Request node and configure it to call the Firecrawl API.

You'll need to sign up for a Firecrawl account and get an API key. The HTTP Request should be set up like this:

• Method: POST

• URL: https://api.firecrawl.dev/v0/scrape

• Headers: Authorization: Bearer YOUR_FIRECRAWL_API_KEY

• Body: {"url": "{{website_url_from_bubble}}"}

Tool 3: Gmail

Add a Gmail node and connect it to your AI Agent. You'll need to authenticate with your Gmail account (n8n will walk you through this process).

The cool thing here is that you can set most of the fields to be "Defined automatically by the model" - this means the AI Agent will decide what to put in the subject line, email body, etc based on the data it has.

No fiddling around with annoying parameters, just click the magic icon and the agent will populate the field with the required data. This feature has made setting up agents in n8n so much easier!

Step 6: Optional - Setting Up the Response Handler

If you want to get the AI-generated email content back into Bubble (maybe to save it to your database or show it to the user), you can set up a response handler.

In your n8n workflow, add a final HTTP Request node that posts back to a Bubble backend workflow:

• Method: POST

• URL: Your Bubble backend workflow endpoint

• Body: The generated email content from the AI Agent

Then in Bubble, create a backend workflow that accepts this data and does whatever you want with it.

Don’t forget to make this workflow public, and if it’s not a secure endpoint allow it to be run without authentication. If it needs to be a secure endpoint leave this unchecked and add an…

Authrozation: Bearer <Get this key from your Bubble API settings tab>

This will allow n8n to connect to Bubble securely.

Step 7: Testing Your Integration

Here's the fun part - let's test it!

Test the n8n workflow first: Use the "Execute workflow" button in n8n with some sample data

1. Test the Bubble API call: Use the "Initialize call" button in Bubble's API Connector

2. Test the full integration: Trigger the API call from a workflow in your Bubble app

When this agent ran, it scraped this demo website, wrote an email tailored to the user and then sent it via my Gmail account from me in my persona, here’s what that looked like…

The quality of your AI Agent's output is heavily dependent on the instructions you give it.

Don't be afraid to iterate and refine your prompts based on the results you're getting. n8n also recently added evaluations which can let you see how changes you make to your prompting makes to the end result.

The beauty of this setup is that once it's working, you can easily extend it. Want to add more tools? Just connect them to your AI Agent. Want to change the email template? Just update the system message. Want to add more data from Bubble? Just update the API call.

Honestly once you build your first of these you’ll be totally hooked. I can’t beliveve some of the things I’ve been able to build over the last few weeks (espescially when you hook your agent up to a RAG database).

This is just scratching the surface of what's possible when you combine Bubble's frontend power with n8n's AI capabilities.

In my next newsletter, I’m going to cover how to give your agents even more superpowers by using MCP servers in n8n - this is honestly so cool I can’t wait to write it up!

Let me know how you get on with this setup, I'd love to hear about the creative ways you're using AI agents in your apps!

As always if you have any feedback or questions drop me a reply to this issue, I really love hearing from you.

Happy building!!

James.

I wrote a while back about how I loved the idea of the "Self-Driving Startup," which Jonas spoke about at the recent Create With conference (videos coming this week on YouTube)

I already automate tons of the operations for my own SaaS UserLoop and it has helped make it possible for me to grow and run it as a solo founder, it’s truly amazing what is possible now.

I'm going shift the focus of this newsletter to cover more of the tech that makes it possible for a startup to operate autonomously using AI, rather than just how to use nocode tools to build a SaaS

This is the first issue where I am primarily going to be looking at n8n and Supabase instead of Bubble.

n8n is one of the key tools that I believe is going to make the self-driving startup possible for many. It’s a powerful and cost-effective tool, and I’ve built tons of automations that save me hours every day using it.

Today's tutorial is all about building your own custom AI-powered database, often called a Retrieval-Augmented Generation (RAG) system. We recently made our own internal RAG system and it’s been a real eye opener for me, so I wanted to share how you can make your own step by step from scratch.

I’ve covered everything from building the workflow in n8n to creating the vectors in Supabase. I highly recommend watching the video, it starts with a demo of what it can do and then goes step by step with a guide you can follow along.

I’ve recorded the whole process in this YouTube video, from creating your Supabase account and setting up your database, to building your n8n workflow to automatically ingest documents from Google Drive and store them to your Supabase Vector Store.

Watch the Tutorial

What this lets you do is train a custom AI on your own private data, like documents from your Google Drive, and then ask it questions about that information.

This is interesting because it allows you to create AI tools that can provide specific, contextual answers from your own knowledge base.

For this tutorial, we'll set up a simple chat interface to ask questions. However, the real potential here, which we can explore in future lessons, is extending this with the AI Agent node in n8n.

An agent could use this knowledge to perform more complex tasks, like pulling structured data out of your documents to use in other workflows.

It’s a lot easier to set up than you might first think, and you can build the entire thing without writing any code. We’ll start from a blank slate and build the n8n workflows to get data in and then query it back out.

You can watch the entire tutorial on YouTube here.

What are n8n and Supabase?

n8n is a workflow automation tool that lets you connect different applications and services together to create automated processes. Think of it like Zapier, but open-source and with more flexibility.

You can use their cloud-hosted version, or you can self-host it, which is incredibly cheap to operate and what we'll be assuming for this tutorial. I personally host mine with Elest.io for $10/month, and it even handles updating the n8n software automatically.

Supabase is an open-source hosted database. It gives you a suite of tools to build backends quickly, including a Postgres database, authentication, and storage.

For our purposes, we'll be using its Postgres database to create a "vector store," which is a specialized database for storing the numerical representations of our text data.

Supabase has a very generous free tier which is more than enough to get started and build this entire project.

Part 1: Ingesting Your Data

First, we need to get our custom information into a database that our AI can use. I'll show you a workflow that takes a file from Google Drive, processes it, and stores it in Supabase.

Before the data is stored, it goes through a crucial step: it's converted into a numerical format called a 'vector embedding' using OpenAI.

This process is what allows an AI to understand the semantic meaning and context of your text, so it can find the most relevant information later when you ask it a question. Think of it as creating a special map of your data that the AI can read.

The basic workflow looks like this:

1. Trigger when a new file is added to a Google Drive folder.

2. Download the file and extract its text.

3. Encode the text into a numerical format (called an "embedding") using OpenAI.

4. Save the encoded data into our RAG database in Supabase.

Step 1: Setting Up Your Supabase Project

• Head to Supabase and select "New Project." Give it a name (e.g., "n8n-rag-tutorial") and a strong password. Make sure to save this password, as you'll need it later.

• Once the project is ready, you need your API credentials.
  
  Go to Project Settings > API. Copy the URL (Host) from the Project URL field and the service_role secret key from the Project API Keys section. These will let n8n connect to your database.

Step 2: Preparing the Database in Supabase

Our AI needs a specific type of table to store the data and its embeddings. The n8n documentation makes this straightforward.

• In the Supabase Vector Store node documentation within n8n, there is a "Quick Start" section with a ready-made SQL script.

• Copy this script.

• In your Supabase project, go to the SQL Editor, paste the script into a new query, and run it.

• This creates a new table called documents with all the necessary columns (content, metadata, and embeddings) already set up. Your database is now ready to receive data.

Step 3: Building the Ingestion Workflow in n8n

Now, let's build the n8n workflow to populate this database.

1. Get the Data: Start with a Google Drive node set to "Download File." Point it to a specific Google Doc you want to use. Make sure to set the Google File Conversion to download the doc as plain text.

2. Extract Text: Add an Extract from File node to get the raw text from the downloaded binary file.

3. Upsert to Vector Store: This is the main step. Add the Supabase Vector Store node.

   • Action: Set the action to Upsert.

   • Credentials: Connect it to the Supabase account using the Host and Service Role Key you saved earlier.

   • Embeddings: You need to tell n8n how to encode the text. Select OpenAI as the embedding tool and choose an embedding model like text-embedding-small.

   • Metadata: This is useful for filtering later. Add a metadata field, for instance, type with the value doc. This way, you can have the AI query only documents if you add other data sources like tweets in the future.

When you run this workflow, n8n will download the file, extract the text, convert it into embeddings, and load it into your Supabase table. If the document is long, the text splitter will break it into smaller chunks, creating multiple rows in your database.

Part 2: Querying Your Data with an AI Agent

With data in our database, we can now set up an AI agent to chat with it.

Step 4: Creating the Chat Workflow in n8n

1. Chat Trigger: Start with a trigger node, On Chat Message, which provides a simple chat interface for testing.

2. AI Agent: Add an AI Agent node. Here, you'll configure the main AI model, for example, OpenAI GPT-4.1.

3. Memory: To remember the conversation history, the agent needs memory. For this, we'll use our Supabase database. Select the Postgres memory option. You'll need to create a new credential for this.

   • Go to your Supabase project's Database settings and find the Connection string. Copy the Host, Database name, User, and Port details into the n8n Postgres credential configuration. For the password, use the main project password you set up in Step 1.

Step 5: Giving Your Agent the Right Tool

An AI agent needs tools to perform actions. We need to give it a tool to access our custom knowledge.

• In the AI Agent node, go to Tools and add the Supabase Vector Store.

• Name & Description: This is important. Give the tool a descriptive name like Company Documents and a clear description like Contains documents about the Create With conference. The AI uses this description to decide when to use this tool.

• Configuration: Connect it to your Supabase credentials, select the documents table, and point it to your OpenAI embeddings model, just as you did in the ingestion workflow.

Step 6: Asking Your First Question

Now you're ready to test it. Activate the workflow, open the chat panel, and ask a question related to the document you uploaded, like, "What do you know about the Create with conference?"

The AI agent will:

1. Receive your question.

2. Analyze it and determine the "Company Documents" tool is the best way to find the answer.

3. Use the tool to query your Supabase vector database.

4. Receive the relevant text from your original document.

5. Use that text to form an answer and display it in the chat.

That’s it for this week!

You've just seen how to take text content, load it into a vector database, and build a custom AI agent to query it, all without writing any code!

You can expand this by adding data from websites, Twitter, LinkedIn, and more. The setup is also quite inexpensive to run, using the free tiers of the tools. I’m using it for all sorts of things now and it’s amazingly powerful.

In the next edition I’ll dive a bit more into loading in data from other sources like Twitter, and building an AI agent which can complete tasks using intelligence it can get from your vector store.

I hope you found this helpful. Let me know if you end up trying this method!!

Until next time, happy building!

James

This is the week after the Create With Conference which I help organise in London with Kieran and Ash. This was our second year of running the conference and we managed to double the event in size and run it across 3 days. There were tons of workshops, speaking sessions and fireside chats, all revolving helping people to create with AI and visual development tools.

I appologise for the slight gap with newsletter issues - a huge amount of work goes into running the conference so my focus has been on that for a few months.

We actually built a ton of custom software to run and operate the conference, and I’m going to dive into a few of the things we built in today’s issue.

One of my favourite sessions at the conference this year was a fireside chat Monzo cofounder Jonas Templestein and Charlie Ward.

I’ve covered Jonas’ writing in the newsletter previously, particularly around the concept of ‘Self Driving Startups’ which can build and operate autonomously.

The session was super inspirational and really brought home for me just how close we are to startups being able to build and operate themselves. Not only building new features and writing code - but also handling support, finances, operations and much more. Pretty much everything required to run a startup.

Indeed - I’m aiming to make my startup UserLoop as much of a self driving startup as possible. The app is currently written in Bubble with a lot of Cloudflare Workers as I’ve covered in the past, but recently I’ve also been extending it with n8n AI Agents to complete tasks and take over entire functions of running the company.

Some of the most popular sessions at the conference were about AI agents, and I’m going to be covering them a lot more in this newsletter over the coming weeks.

Back to this issue though! This week I want to share with you some of the custom software we built to help us run the Create With Conference.

I’m going to focus on our Native Mobile Apps for iOS and Android, and AI Agents we built to support the app.

Building a native app with Bubble

After getting access to the beta for Bubble for Native Mobile Apps we decided to play around with it and see if we could put together an app for the conference that showed the schedule, venue map and let attendees network with each other through public profiles.

The only issue was - this was with a month left to go until the conference. So I wasn’t sure we’d be able to put the app together ourselves and get it launched on the iOS and Android App Stores in time!

Thankfully the marketing site for Create With was already running on Bubble which gave us a head start and made putting the app togehter much quicker. Kieran did an amazing job of designing a schedule view for the web which showed all the sessions happening on every stage. We already had most of the data types we needed - like speakers, conference sessions etc.

After spending a day or two with the new Bubble Native Mobile editor I was confident we would be able to put something together. It works very similarly to the web version with the visual editor and workflows.

The primary difference for me was how navigation works. With the fixed tab bar at the bottom and top of app sheets, navigating between views etc but this didn’t take long to get the hang of.

The other huge benefit of running the main website and native apps on Bubble was that they all ran off the same database. So as we updated speakers, sessions and other data it was synced immediately everywhere.

The main concern I had was whether we’d be able to get through the App Store Review processes on Apple and Google’s app stores. We didn’t have any accounts on either of them so we’d need to sign up and get everything approved in under a month, I wasn’t sure if it could be done but we decided to give it a go anyway!

After about a week of putting the core screens together we had a basic version of the app ready to go and tested in the BubbleGo app simulator (this is an app in the app store which lets you test out your Bubble app without it having to go via Testflight or the App Store)

The next step was signing up for developer accounts on Apple and Google.

This whole process took about a 4 days to get all the accounts up and running, there is a ton of KYC and admin to go through to verify your identity.

I was quite suprised that the process for signing up and deploying on the Apple App Stores was way easier than on Android! I was able to get our first test flight built released within another day or two.

Then we were able to get a few people to help us out with testing the app on their own phones and added a few more features.

Then about 2 weeks before the conference we went ahead and submitted the apps to both app stores and waited for the response.

Apple came back within a matter of hours with a list of changes we had to make to the app, thankfully these were all quite straight forward things like allowing users to delete their account, and giving more detailed explanations for the permissions we were asking for when accessing the user’s camera rolls.

Android was accepted on the first attempt without any changes required - however I didn’t get any notification it had been approved. The first thing I knew was when I next logged in and found the app was live on the Google Play Store 🤣

Bubble for Native Mobile is releasing their public beta very soon on June 10th! Check out their ProductHunt page to keep updated on the release.

I can’t wait to start building more native apps with Bubble - making the conference app has gotten me very excited about being able to build native mobile apps for the first time!

AI Agents in the App

We wanted to push things a bit further with the app - adding a few AI features to help people connect with others at the conference and also find the sessions that might be most relevent for them.

To do this I used the Cloudflare Workers method I’ve discussed previously in this newsletter and made 3 simple workers which we could then call from the Bubble API Connector.

Here are the three AI agents we made to help within the app…

Attendee Moderator. This is a simple worker which moderated user profiles using Google Gemini - mostly to protect against pranksters putting inappropriate photos on their profile or in their profile text.

It was fairly simple in how it worked, we sent through the user’s profile text and their profile photo then asked Gemini to return a yes/no for whether it was a spam profile.

If it was yes we updated the user’s profile to be hidden in Bubble so users wouldn’t see it in the list of attendees in our app.

Session Matcher. This worker was designed to help match attendees with sessions they were interested in. Again it was made using Google Gemini, and we passed in a user’s profile information along with a list of all the sessions happening at the conference from the database.

Then we asked Gemini to suggest around 5 sessions the user might be interested in based on their profile - and a short explanation of why we think they’d like the session.

This is how recommendations were shown in the app…

We had some really good feedback about this feature, it helped a lot of people pick which sessions they went to on the day!

Attendee Matchmaker.

It was also important to us to help attendees connect in person on the day of the conference so we made a final AI agent which was a matchmaker. We sent through the current user’s profile and a list of all other attendee bios, and then asked for a short list of attendees that would be a good connection.

Thanks to Google Gemini’s large context windows this worked really well, even when sending in hundreds of attendees for a potnential match.

We got lots of feedback that people loved their recommendations and had met up with each other - next time we want to take this even further and make it more of a game experience.

That’s it for this week!

If you’re interested in hearing more about building with Bubble Native Mobile or AI Agents in Bubble drop me a reply - I’d be more than happy to do a more in depth dive into how they work and how to get start with building apps and agents!

Thanks again for reading and I hope you found this interesting - I’ll be getting back to a more regular schedule with the newsletter now that the conference is finished!

Happy building!

James

The next Create With meetup is happening very soon, and we’re going international! The next event is in Madrid next week on June 2nd - check it out here!

If you’d like a weekly email about everything in AI & Visual Development checkout the Create With Newsletter below - you’ll also be first to hear about future meetups and events :)

Subscribe to the Create With Newsletter

This week I wanted to take a look at a topic which is often discussed - how to get your content ranking highly on Bubble and optimising your SEO.

I’m going to touch on a few of the basics of getting Bubble optimised for SEO as well as another technique I use for running my own blog on the UserLoop site using Ghost as a backend.

Deciding whether to use Bubble for your blog.

If you’re early on in your project it’s worth spending a bit of time thinking through how you’re going to host your app and marketing content.

This is one of those decisions which can be a bit tricky to unpack later so it’s worth spending some time to get it right at the start.

When I launched UserLoop (which started out as a weekend side project) I decided to host both the app and the marketing site on the same Bubble app on the same domain.

While this does have some benefits like being able to build a slick integrated signup flow there’s also a bunch of tradeoffs.

For example, if you want to run a blog and attract traffic from search you’ll need to think how to host your blog.

It’s not really an option to host your blog content on a subdomain like blog.yourdomain.com, I tried this in the early days and it didn’t rank in Google at all.

It’s super important that however you decide to host your marketing content that is lives on the root domain of your app.

As such, now looking back it would have been much better to host the UserLoop app on a subdomain like app.userloop.io, that would have given me the choice to use whatever I wanted to run the marketing site.

However, I’ve managed to make everything work with having everything on the root domain and rank well for my key target search terms.

In this issue I’m going to cover 2 of the main things I learned from optimising Bubble for SEO and getting it to rank highly.

• The basics of configuring Bubble to be indexable by search engines

• How to use Ghost to serve as the backend for your blog and serve content via Bubble

By following a few simple steps you can easily get your Bubble based pages to start ranking in Google.

Bubble Basic SEO: Getting Started with Search-Friendly Pages

Let’s dig into making your Bubble content actually show up on Google.

It’s defiantly possible to rank well with Bubble based content despite what you might think. Even though Bubble’s page speed load times arent the best, if you follow some simple basics you can still rank well. (I believe Bubble are also still working on improving page load speeds further by pre-rendering content server side)

So let’s get into some of the basics…

1. Sort Out Your Page Titles and Meta Descriptions

You’ve got to tell Google what your blog post is about, and Bubble makes it pretty simple. Open up the property editor for your blog page—that’s the panel on the right when you’re tinkering with a page. Look under “SEO/metatags” for “Title” and “Description.”

• Page Title: Keep it short and shove your main keyword in there. Stick to under 60 characters so Google doesn’t chop it.
  
  You can set it static or pull it from your database if your titles are dynamic. Bubble’s got more on this here.
  
  In the above example you can see how I’m injecting this content from my database (though it’s actually coming via Ghost, I’ll cover that in more detail later)
  

• Meta Description: This is your quick pitch—280 characters max—that pops up in search results. Again I’m pulling this content from the database, I actually have a workflow set up which writes this text using OpenAI whenever I publish a blog post (more on that later)

2. Chuck in Some Headers for Structure

Headers aren’t just pretty—they help Google figure out your post and keep readers from bouncing. Bubble’s got a switch to flip for this.

• Turn On Header Tags: Pop into the “Settings” tab in your app, scroll to “SEO,” and tick “Enable header tags in text elements.” That unlocks H1, H2, and so on in your text options—check Bubble’s guide here.

• Set Them Up: For your main blog title—like “Master Bubble Workflows in 5 Steps”—add a text element, set it to H1 in the style dropdown, and link it to your post’s title field if it’s dynamic.

  Then, for bits like “Step 1: Plan Your Workflow,” use H2s. Just pick “Heading 2” in the appearance settings. It’s a no-brainer way to keep things tidy for Bubble users and Google.
  
  Depending on how you’re hosting your Bubble blog content you can either add these H tags manually, or if you use the same Ghost method as me it will take care of this formatting for you.
  
  

3. Trim Down Images So It Loads Quick

Big images can tank your Bubble site’s speed. Thankfully Bubble has some built in tools to help optimise images.

Wherever you use images in your blog content templates, ideally use the :processed with Imigx function. This means Bubble will automatically optimise the image and serve the smallest version possible.

I use quality at 75% with resize to fit dimensions by cropping enabled. You could even lower this quality setting down if you’re just showing thumbnail images.

4. Link Up Your Pages to Keep Folks Around

It’s really important to make sure you’re linking content in Bubble correctly to make sure Google can index it correctly.

Most importantly - don’t use Buttons or Workflow based links for your content - Google can’t see them!

You need to use the built in Bubble ‘Link’ element type. This formats the link in a way that it’s indexable by Google.

5. Hand Your Sitemap to Google

It’s also important to make sure you’ve enabled Bubble’s sitemaps in your app’s SEO/Metatags settings page. By default Bubble creates a sitemap for you at “yourapp.com/sitemap.xml” with all your public pages, and also a sitemap for each page linked to a database type.

I recommend enabling these three options in your SEO settings.

This means the H tags will be correctly exposed for the content on your pages.

Connecting Ghost & Bubble to serve your site’s blog content.

I searched for a long time for a solution which would let me host a blog on the main root domain of my Bubble app at /blog. I tried out several different methods without great results.

I tried building the blog fully within Bubble, saving the blog content to the Bubble database and serving it from there too.

Unfortunately this had a few drawbacks, firstly all the WYSIWYG editors for actually writing and editing the blog content were pretty poor. And then I also found that serving the blog content from the Bubble DB made pages load far too slowly, and images embedded in posts weren’t optimised.

It was important for me to not only have content served quickly, but to also have a nice writing environment in the editor for creating posts.

This is when I started exploring Ghost more, to see whether I could use it with Bubble to host my blog content.

Ghost not only has a gorgeous post editor and wide support amongst other tools like Zapier, it’s super easy to use and affordable.

At first my plan was to try and point my /blog page directly to Ghost using some URL / DNS tricks with Cloudflare. Unfortunately this didn’t prove to be possible to I started considering other approaches.

This led to me investigating the APIs that Ghost offered. I wondered if there would be a way to host all my blog content in Ghost then dynamically pull it into Bubble and render it on Bubble.

I discovered that Ghost had a Content API which you could use to pull entire post content, including the full HTML of the post.

This returns the following object, including things like the slug, title, post html and a lot more.

My next step was to experiment with setting this up in Bubble via the API connector.

The plan was to pull in the content for a specific blog post using the content API and render it on a page in Bubble.

Thankfully, given that the key that Ghost generates is just for reading content I was able to use the feature in Bubble to ‘attempt to make the call from the browser’ which calls the API directly from the user’s browser making it super fast.

This is how it looks set up in the API connector in Bubble…

So to test this out, we just need to create a post in Ghost, and get it’s ID and past it in to this call to pull the content into Bubble to initialise the API Connector.

We want to set this up as a data type of ‘Data’ as we’re eventually going to pull this in when a page is loaded and render the content inside a HTML element.

Next, I created a page in Bubble, placed a simple HTML on it and made a group on the page which called the Ghost Content API and pulled in the post data.

Then I just render the ‘html’ value from the post and render it in an HTML element.

I tested this out and it worked really well! The page loaded instantly (the Ghost content API seems to be lightning fast). Even really long posts containing tons of content loaded instantly.

Once I realised this could work well I started looking into the next step, how to sync the content between Ghost and Bubble automatically.

One thing to note is you need to apply a bit of a <style> element in Bubble for everything to style correctly from Ghost with all the proper formatting. If you’d like a copy of the style tag I used to make this work just drop me a reply to this post and I’ll send it over.

Connecting Bubble & Ghost using Webhooks

The first thing I realised is that I would need a simple table in Bubble which stored a few key fields in order to render the pages.

So I created a new data type in Bubble called ‘Post’ with the fields

Ghost Post ID - the ID of the given post from Ghost in order to pull the content over the content API

Post Title - The title of the blog post

Featured Image - The featured image of the post

Snippet - A short 280 Char snippet of the article content for SEO purposes

Author - Optional extra field containing the authour of the post.

You could also add a few other fields, but I just wanted this data type to be very lean and fast loading, after all we’re pulling the bulk of the content from Ghost.

The next step was to keep Ghost in Sync with Bubble.

I decided to do this using Ghost’s webhooks feature.

So heading into Ghost, I created a new integration.

Then I selected custom and ‘Add custom integration.’

Then I gave the integration the name Bubble

Then I needed to set up 2 new webhooks which call backend workflows in Bubble.

• One when a new post is published. This creates a new record in the Bubble posts table with the Ghost ID of the new post.

• One when a post is updated. If a post is edited in Ghost we want to update Bubble with the new title, image etc. We need another backend workflow to run to make that update.

This is what the Webhook setup looks like in Ghost. You can see the 2 webhooks I set up to keep data in sync.

Back in Bubble I set up 2 new backend workflows using the ‘Detect data’ method which picks up the API request structure from Ghost.

For the create a post workflow these are the steps I use…

Then we want to create a new ‘Post’ in our Bubble database using the data we receive from Ghost.

We also get a field called ‘slug’ from Ghost which we want to use to set the slug for the Post in our Bubble database. This means the URL we set in Ghost will be the same in Ghost.

Then we also set up a similar workflow for the update action which basically is doing the same thing but instead of creating a new record it’s searching for existing records matching the given Ghost Post ID.

With all that in place we have everything we need to start publishing content to Bubble from Ghost using the beautiful Ghost post editor.

That’s it for this week!

Hope you find it helpful, let me know if you end up trying this method. I’ve used it across two Bubble apps I work on and it’s been great for helping us rank and made it really easy to publish more content with Bubble.

Don’t forget, the Create With AI Conference I help organise is coming to London on 22nd May. £99 Advance tickets are still available if you’re interested in coming along - we’re going to be talking everything AI and NoCode. It would be great to see you there.

Until next time, happy building!

James

Welcome to this week’s NoCode SaaS newsletter, where I take you along on the journey of building profitable businesses without code using Bubble and AI.

This week, I’m excited to share how you can add AI-driven decision-making to your app without code.

We’ll be using DeepSeek, a reasoning model on Cloudflare Workers AI to analyse data and make decisions—all without even needing an API key!

I’ve put together a simple demo where we’ll build an “agent” that analyzes a supermarket stock report and provides key insights, like identifying items at risk of spoilage and recommending actions to minimize losses.

It’s easy to set up, and I’ll walk you through every step. It’s not as hard as you’re probably thinking!

I’ve recently switched some of the logic in my own app UserLoop over to using this method and it’s an amazing tool to have in your pocket, while working alongside the other LLMs we’ve covered previously like GPT-4o.

I’ve recorded a short video showing exactly how to set everything up, I highly recommend watching it, though I’ve also put together a step by step guide below too.

Watch the tutorial

Why Use DeepSeek on Cloudflare Workers with Your NoCode App?

So why exactly do I think you should consider Deepseek for your app? And how does it work with Bubble?

1. No API Key Needed

With Cloudflare Workers AI, you can run DeepSeek directly on Cloudflare’s infrastructure without needing an API key.

It’s all handled seamlessly within your Cloudflare account.

Plus that means no sending data outside the US/EU, it all runs inside Cloudflare’s network.

2. Incredibly Cost-Effective

Running AI models can get expensive, but Cloudflare Workers AI is budget-friendly. For DeepSeek, it’s just $0.50 per million input tokens and $0.488 per million output tokens.

That’s a steal for the power you’re getting, especially when compared to other AI services.

3. No Code Required

You don’t need to be a developer to set this up. We’ll use AI (specifically, Grok3) to generate the entire Cloudflare Worker code for us.

From there, it’s just a matter of copying, pasting, and deploying.

If you can follow a tutorial, you can do this.

4. Easy Integration with NoCode Tools

Once your Cloudflare Worker is set up, you can easily call it from Bubble, Zapier, or any other platform that supports API requests.

In this demo, I’ll show you how to integrate it with Bubble using the API Connector - it’s super easy.

5. Powerful Reasoning Capabilities

DeepSeek is a reasoning model, meaning it can analyse data, make decisions, and provide structured outputs based on complex criteria.

In my example, it will analyse a stock report, identify at-risk items, calculate potential financial losses, and recommend actions—all in seconds.

What We’re Building: A Supermarket Stock Analyzer

To demonstrate the power of DeepSeek on Cloudflare Workers, we’re going to build a simple “agent” that:

• Analyses a supermarket stock report (provided as JSON) here’s a link to the dummy report I used if you want to try it for yourself.

• Identifies the top two items at greatest risk of spoilage based on sell-by dates and stock levels.

• Estimates the potential financial impact if those items aren’t sold in time.

• Recommends two actions to minimise the risk of loss (e.g., discounting items or promoting them).

  This is just a starting point—once you see how it works, you can adapt it to analyse any kind of data relevant to your app.

Step-by-Step Tutorial: Setting Up Your AI-Powered Agent

Here’s how to build this in under 10 minutes:

Step 1: Understand the Data

We’ll be working with a sample supermarket stock report that includes:

• Item names

• Sell-by dates

• Cost per unit

• Weekly sales rates

• Stockroom details

  This data will be sent to our Cloudflare Worker as JSON, and DeepSeek will analyse it to provide insights.

Step 2: Choose the Right Model

Cloudflare Workers AI offers several models, but for reasoning tasks, DeepSeek R1 is a great choice.

It’s affordable and powerful enough for our needs. You can find it in the Cloudflare AI Models documentation.

Copy the model name: @cf/deepseek-ai/deepseek-r1-distill-qwen-32b.

Step 3: Generate the Cloudflare Worker Code with AI

We’ll use Grok3 (or any AI code generator) to create the Cloudflare Worker code. Here’s the prompt I used:

I want to make a Cloudflare Worker that uses Cloudflare AI. I want to use the model `@cf/deepseek-ai/deepseek-coder-v2-lite` to analyze my store's stocktake report. Here is an example stocktake report: [paste your JSON stocktake data here].
I want DeepSeek to return a JSON object with:
- The top two items at greatest risk of spoilage.
- The estimated financial impact if those items are not sold.
- Two recommended actions to minimize the risk.
Generate the code for the worker and provide an example input request.

Grok will generate the worker code and an example POST request. Copy the code—it’s ready to use!

Step 4: Set Up Your Cloudflare Worker

1. Log in to your Cloudflare account and go to Workers.

2. Click Create a Worker and give it a name (e.g., nocode-stocktake-agent).

3. In the worker settings, go to Bindings and add a new binding for Workers AI. Name it AI

   

   .

4. Paste the AI-generated code into the worker’s code editor.

5. Deploy the worker.

That’s it! Your worker is now live and ready to analyse stock data.

Step 5: Test the Worker

Use the example POST request provided by Grok to test your worker. You can do this directly in Cloudflare’s test console or using a tool like Postman.

Here’s what the response might look like:

json

{"top_two_at_risk":[{"item":"Bread (White Loaf)","sell_by":"February 23, 2025","reason":"Expires February 23, 2025"},{"item":"Bananas","sell_by":"February 24, 2025","reason":"Expires February 24, 2025"}],"potential_financial_loss":{"items":[{"item":"Bread (White Loaf)","quantity_at_risk":58.57142857142857,"cost_per_unit":1.2,"total_loss":70.28571428571428},{"item":"Bananas","quantity_at_risk":148.57142857142856,"cost_per_unit":0.8,"total_loss":118.85714285714285}],"total":189.1428571428571},"recommended_actions":["Discount Bread (White Loaf) this weekend","Promote Bananas to clear stock"]}

DeepSeek analysed the data, identified risks, calculated losses, and suggested action, all in seconds.

Step 6: Integrate with Bubble (or Any NoCode Tool)

Now, let’s bring this into Bubble:

1. In Bubble, go to the API Connector and add a new API.

   

2. Set it as a POST request and paste your Cloudflare Worker URL.

3. Use the example JSON body from Groq to initialise the API call.

4. Save and test the API connection.

   

   Once set up, you can trigger this API call from any workflow in Bubble, passing in stock data and getting back structured JSON with decisions you can display or act on.

That’s it for this week!

This is just the beginning. In future issues, I’ll dive deeper into reasoning models, explore more AI tools, and share how to build even more advanced features without code. If there’s something specific you’d like to see, let me know by hitting reply!

And if you’re inspired to try this yourself, I’d love to hear how it goes. Feel free to reply to this email with your experiences or questions.

Thanks for reading, and happy building!

James

P.S. Don’t forget—early bird tickets for the Create With Conference in London on May 22nd are still available! Join us for a day of talks, tutorials, and networking with top NoCode and AI builders. Get your ticket here.

What if you could build a startup that practically runs itself?

Not just the product development, but everything from customer onboarding to marketing.

This week, I'm diving into AI Agents and how they might finally help us realize the dream of the 'self-driving startup.'

I've been thinking about this a lot lately.

As an indie founder running UserLoop without VC funding or a large team, I've already embraced AI and NoCode for all my product development.

But I kept wondering - could we push this automation even further? That's when AI Agents caught my attention.

Instead of just theorizing, I decided to spin up my own self hosted instance of n8n.

After watching a few tutorials I was able to put a new onboarding agent for UserLoop which helps me out with a few tasks

• When a new user signs up to UserLoop it scrapes their website using Perplexity Sonar

• I then get back a detailed report of who the customer is, their market etc

• I then use Anthropic to compose a personalised series of welcome emails to the specific customer

• The emails then automatically get sent from my personal Gmail account

To really understand where this technology is headed, I reached out to my long-time friend (and NoCode industry legend) JJ Englert.

We had a fascinating conversation about everything from getting started with AI Agents to their potential to revolutionize how we build and run businesses.

Let’s dive in now, it’s a truly fascinating topic.

The Rise of AI Agents: A Conversation with JJ Englert

JD: There's a lot of buzz around AI agents right now. How would you define them for someone new to the concept?

JJ: Let me first explain what a true AI agent is, and then address some of the confusion in the market. At its core, an AI agent is a system that can think, reason, and take autonomous actions on your behalf.

What sets it apart from traditional automation is its ability to make independent decisions based on context and reasoning, rather than following predefined paths.

Think of it this way: traditional automation is like following a detailed recipe – if X happens, do Y.

An AI agent is more like having an assistant who understands your goals and can figure out how to achieve them, making decisions along the way based on changing circumstances.

That said, there's currently some confusion in the market because many tools being labeled as "AI agents" are really just AI-enhanced workflows or automations. While the terminology might not be perfect, it's what the world knows right now. Rather than fight against this terminology, it's better to meet people where they are and then help them understand the spectrum from simple AI automation to truly autonomous agents.

The key distinction is independence and reasoning capability. A true AI agent can:

• Understand and interpret complex instructions

• Make independent decisions based on multiple factors

• Adapt its approach based on new information

• Take appropriate actions without needing step-by-step guidance

• Learn from previous interactions and outcomes

What's particularly interesting is that despite No-Code being around for 5+ years, AI Agents have achieved far greater market visibility and interest.

Looking at Google Trends data we can see that AI Agents have rapidly surpassed No-Code in terms of search interest and industry attention.

This suggests that AI Agents are resonating with a broader audience and addressing more immediate business needs than previous waves of automation technology.

JD: What platforms are leading the way in the AI agent space?

JJ: There's a fascinating range of platforms emerging, each with their own unique approach to AI agents:

N8N has really capitalized on the AI agent wave through their visual editor and direct integration of AI agent functionality. They've made it particularly accessible for non-technical users while maintaining the power for complex workflows.

Lindy.ai has taken a very business-focused approach - think of it as the "Softr version" of AI agents.

They're very user-friendly and have recently secured $50 million in funding, which speaks to the market's confidence in their approach.

Lutra.ai offers an interesting ChatGPT-like interface where you can create agents through natural language conversation. What's particularly powerful is that these agents can be scheduled to run automatically, making it very intuitive for users who are comfortable with chat interfaces.

Lyzr.ai has carved out a niche by focusing on security and privacy - they provide a way to build AI agents that can safely connect to your business data. This is particularly important for enterprises and businesses handling sensitive information.

Mindstudio.ai is emerging as a more advanced platform, similar to N8N in power but with deeper AI integration. While it's still early in its development, it shows a lot of promise for users who need more sophisticated agent capabilities.

Make (formerly Integromat) can build agent-like capabilities, though they've been somewhat quiet about it from a marketing perspective. I expect them to make a bigger push in this direction soon - they have the technical foundation to be a major player.

Zapier has recently entered the space as well. True to their reputation for simplicity, they've made it exceptionally easy to add tools to an agent and create basic agentic workflows. While it might not be as powerful as some other platforms, it's perfect for simple use cases and users who want to get started quickly.

The interesting thing about this space is that we're seeing platforms approach it from different angles - some focusing on ease of use, others on power and flexibility, and others on security and privacy. This diversity means users can choose a platform that best matches their specific needs and technical capabilities.

JD: Can you share a practical example of how businesses are using AI agents?

JJ: Let me share several real-world examples that showcase the versatility of AI agents: The first is social media engagement automation. You can create an agent that monitors platforms like Reddit for brand mentions.

Here's how it works:

• The agent continuously scans Reddit for your company name.

• When a mention is found, it uses AI to analyze whether the post is valuable or just promotional
  - If it's a meaningful post, the agent automatically drafts a response using content from your help center

• The draft is sent to your team via Slack for review

• Once approved, the response is automatically posted

This moves your team from constant monitoring to just reviewing and approving thoughtful, pre-written responses.

It's a perfect example of keeping humans in the loop while automating the time-consuming parts of the process.

Another powerful use case is SEO and backlink automation. Traditional backlink management tools can be replaced with specialized AI agents that:

Monitor your backlink profile Analyze the quality and relevance of incoming links Identify opportunities for new backlinks Generate appropriate outreach messages Track and report on backlink performance

What's particularly exciting is that we're seeing new use cases emerge almost weekly as platforms add capabilities and users discover novel ways to implement them.

JD: How are these platforms making AI agents accessible to non-technical users?

JJ: Platforms are taking different approaches. Lindy.ai, for instance, uses plain text for conditions and logic - you can simply type what you want to happen, and it will define the logic for you.

Other platforms like Lutra.ai use a playbook mechanism where you can configure your account and then use chat-GPT style interactions to set up automations.

The key is making it visual and intuitive rather than code-heavy.

JD: What's your perspective on the future of this technology?

JJ: The space is evolving so rapidly that the eventual market leader might not even exist yet. What's clear is that we're moving toward a future where everyone will have their own suite of AI agents working for them, fundamentally changing how we interact with technology and manage our work.

I envision a transition where our role will shift from doing tasks to supervising agents who do them for us. Initially, we'll see a lot of "human in the loop" systems where agents handle the heavy lifting but still require human oversight and approval for key decisions.

This is a necessary trust-building phase.

As these systems prove themselves reliable and we become more comfortable with their decision-making, we'll gradually allow them to operate more autonomously.

The key here isn't just technological capability - it's about building trust and understanding where human judgment remains crucial.

Think of it like training a new employee: at first, you review everything they do, but over time, as they prove themselves capable and reliable, you give them more independence.

The difference is that once an AI agent masters a task, it can be replicated infinitely.

JD: For someone looking to get started with AI agents, what would you recommend?

JJ: Start with a real problem you want to solve. Having a specific challenge in mind makes the learning process much more focused and meaningful than just experimenting randomly. Begin with simpler platforms like Zapier for basic implementations, then progress to more sophisticated tools like Lindy.ai and n8n as your needs grow.

A great shortcut is to explore the template galleries on platforms like N8N. These templates show you how experienced builders have structured their agents and can give you practical insights into best practices. Plus, you can often modify these templates to fit your specific needs rather than starting from scratch.

JD: How do you see AI agents impacting the traditional SaaS business model?

JJ: We're witnessing the emergence of entirely new business models. The most significant is what I call "Agents as a Service" - instead of subscribing to traditional SaaS products, companies will rent specialized AI agents for specific tasks. We're already seeing early signs of this transition.

I expect we'll soon see dedicated agencies focusing solely on building and maintaining custom AI agents for businesses.

Alongside this, agent marketplaces will emerge where you can "hire" pre-built agents on a monthly basis, similar to how we subscribe to software today.

What's particularly exciting is the potential for highly specialized agents. Imagine agents specifically trained to edit videos in Premiere Pro, design your app in Figma. As agents mature, the more domain access to specific tools, will grow too.

In fact, Hubspot’s CTO, even thinks websites and SaaS's will alter to allow for very Agent ready documentation for each site / app, making it very easy for external agents to tap into the platform, similar to how we might be using APIs today.

Instead of paying monthly subscriptions for various SaaS tools, companies might redirect those budgets toward renting these specialized agents that can actually execute the work.

This shift could fundamentally change how businesses allocate their resources. Rather than purchasing software licenses and training employees to use them, you might simply rent an agent that's already an expert at that specific task. It's like having access to a skilled workforce that operates at machine scale and speed.

JD: What's the relationship between no-code tools and AI agents?
JJ: I think no-code tools will increasingly be discovered through AI, rather than the other way around.

Our no-code knowledge becomes particularly valuable when deploying AI solutions - understanding visual builders, workflow automation, and system integration are all crucial skills in the AI agent space.

JJ Englert is currently developing a comprehensive course on AI agents, teaching everything from basic automations to complex multi-agent systems. His approach focuses on practical, real-world applications that businesses can implement today. You can get $50 off with the code NOCODESAAS. Intro to AI Agents Course.

That’s it for this week! Thanks for reading I hope you found this interesting.

Would you like me to cover more on AI Agents in the future? Drop me a reply.

If you have a moment I’d really appreciate you taking my reader’s survey (thank you to everyone who has so far!) this is helping me work out the future format of the newsletter.

If you’re in the UK don’t forget that earlybird tickets to the Create With Conference 2025 end at midnight tonight, so don’t miss out on attending the UK’s first AI and NoCode conference!

This week I want to take a look at Supabase - and why I think it’s such a great tool to have in your back pocket when building with Bubble - and any other platform for that matter.

I’ve been reading about Supabase for years but had never checked out in depth, but over the last few months I decided to finally dive into it.

After getting to grips with it, I moved my app UserLoop’s core database to Supabase and it’s really helped me realise what a great platform it is, and how even non technical people can now use it to build apps thanks to AI.

We actually discussed it a bit on this week’s edition of the Create With podcast here.

So for this issue I’m going to cover my top 10 reasons it’s worth considering using Supabase for your next project - even if you’re not a coder.

One quick thing - reader survey

Could you take a moment to answer some questions in my quick reader survey. I am planning the content for the newsletter for the rest of the year and would love to hear your feedback!

Take The Reader Survey

Now let’s dive into Supabase!

10 Reasons to use Supabase with Bubble

I’m going to cover why I think Supabase is a great companion to Bubble here, but most of these points really apply to using it with other NoCode / AI tools as well.

To give some context on my own journey with Supabase, my app UserLoop is a survey app built primarily for Shopify merchants.

Let me know if you find this interesting - and if you would be interested in a video tutorial of how to get everything set up and running.

There are excellent well documented Bubble plugins for Supabase

One of the best things about building with Bubble is the extensive plugin ecosystem. As of this week there are over 6,500 plugins made for Bubble.

Now whilst not all of them are of high quality this is generally a great thing as there are plugins to do anything you could imagine.

I spent some time going through all the different Supabase plugins and eventually landed on Supabase by Nocodegarden.

The plugin has excellent documentation, making setting everything up in Bubble super easy, I even requested a feature and the developer responded in a day or two adding it!

You don’t need to be able to write SQL

One of the most common misconceptions about Supabase is that you need to be a SQL expert or programmer to use it, and this was probably true a year ago.

When I first looked at Supabase a few years ago, I was intimidated by the amount of SQL knowledge that seemed to be required. But trying it again recently, I was amazed at how much easier it's become to use, especially for non-technical people.

Here's what makes it so accessible now, and why I think it’s a good time to take another look at it…

The AI SQL Editor

Supabase has built an incredible AI assistant right into their platform. Instead of writing SQL queries, you can simply describe what you want to do in plain English, and it will write the SQL for you. For example, you could write:

"Show me all customers who signed up in the last 30 days and have made more than 2 purchases"

The AI will then write the correct SQL query for you. This means you can build complex database queries without knowing SQL syntax.

I’ve actually found this to be much easier to use to query data than manually using the database tab inside Bubble.

The assistant can also help you with setting up tables, security rules, populating tables with demo data and just about anything else you can think of.

Visual Table Editor

For basic database operations, Supabase provides a spreadsheet-like interface that should feel familiar to anyone who's used tools like Airtable or Excel. It’s even pretty similar to the Bubble database tab in a lot of ways

You can:

• Create new tables by clicking buttons

• Add columns by selecting from dropdown menus

• Edit data directly in cells

• Import data from CSV files

You can still stream results into Bubble in realtime

One of the most powerful features of Supabase is its real-time features, and thanks to plugins like NoCodeGarden's Supabase connector, you can easily bring this functionality into your Bubble app, without any coding.

Simply drop an element on your page, add your connection settings and you can stream realtime changes to any table or repeating group - it works really nicely and was a lot easier to set up than I anticipated

In my own app UserLoop, I use this for displaying live survey responses. When a customer submits feedback through a survey, store owners see the response appear instantly in their dashboard without needing to refresh the page.

Using Supabase's real-time features through the plugin also helps with performance since you're not constantly polling the database for changes. Instead, updates are pushed to your app only when they actually occur, making it both more responsive and more efficient.

You can do complex queries on data it would be difficult to do in Bubble

One of the biggest game-changers I've discovered since moving UserLoop's data to Supabase is the ability to perform complex data analysis that would be challenging or impossible to do efficiently in Bubble alone. Let me share some real examples from my own experience.

Recently, I completely revamped UserLoop's analytics capabilities by leveraging Supabase's powerful querying abilities. Here's what this enabled:

• Time-series charts showing survey response trends over custom date ranges

• Revenue impact analysis comparing customer feedback to purchase behavior

• Cohort analysis of customer satisfaction scores

• Complex aggregations of customer sentiment across different store locations

What's particularly exciting is how I built these features without being a SQL expert, thanks to AI assistance. I used Claude to help me write the SQL queries, which I could then test and implement in Supabase.

1. Design Your Query: I describe what I want to analyze in plain English to Claude (you need to give it the basic structure of your table as context, you can just copy and paste this from Supabase)

2. Generate SQL: Claude helps write the SQL query

3. Test in Supabase: Run and refine the query in Supabase's interface

4. Connect to Bubble: Use the API connector to pull the results into Bubble's UI

In Bubble alone, complex calculations across large datasets can be challenging because:

• They can consume lots of capacity

• They might time out on large datasets

• They're often slower than native database queries

• Some types of calculations are hard to express in Bubble's workflow language

But with Supabase handling the heavy lifting, we can:

• Process millions of records in milliseconds

• Perform complex mathematical operations

• Create sophisticated data groupings and aggregations

• Generate reports in real-time

Here's a glimpse of the kind of analysis that's now possible by using Supabase in my app.

This query aggregates customer feedback by answer, works out the count, percentage, revenue and average order value.

Then in Bubble I can chart that over time and put it into a repeating group. This is all called via the API Connector directly to Supbabase using a JWT generated for the specific user.

In another report I’m able to take it a step further with a whole host of new calculated metrics all powered by Supabase and based on querying a single table.

Here I’m working out all sorts of things like the total number of orders per response, order frequency, repeat rates etc. This would have been impossible to make using the built in Bubble database so this is a good example of why if you have any analytics capability in your app it’s worth considering Supabase.

It’s cost effective when reading and updating many records

One of the most compelling reasons to consider Supabase is its pricing model, especially when dealing with large volumes of data operations. While Bubble's wokflow unit-based pricing can get expensive when doing lots of database operations, Supabase remains incredibly cost-effective even at scale.

For example, in UserLoop, we process hundreds of thousands of survey responses per month. On Supabase's free tier, you get:

• 500MB database space

• 50,000 monthly active users

• Unlimited API requests

• Real-time subscriptions

• Database backups

Even when you outgrow the free tier, the pricing remains very reasonable. I'm currently on their Pro tier ($25/month) which handles all my app's database operations with plenty of headroom to spare.

What's particularly great is that you can use Supabase just for the data-intensive parts of your app while keeping everything else in Bubble, giving you the best of both worlds.

I still use the built in Bubble database for data types with low volume like billing, user preferences etc. But the ability to have Supabase as an option for very high volume tables / frequent read write operations is great to have in your pocket!

You don’t have to use Supabase’s built in auth if you don’t want to

Supabase does have a built in auth system, but if you’re already using Bubble’s built in auth you don’t need to switch. You can generate a JWT for each user in your database (basically an API key for each user) which lets them read only their own data from Supabase.

The Nocodegarden plugin handles this really simply, and you can just run it from a backend workflow to generate a token easily. Supabase’s AI assistant can also set up your RLS (Supabase equivalent of Bubble privacy rules)

I've found this particularly helpful when setting up row-level security policies, which can be tricky to get right without the AI's help.

One thing I love about Supabase's JWT authentication system is how it lets you be strategic about what data you keep where. In UserLoop, I use this flexibility to keep sensitive survey response data in Supabase while storing user preferences and billing info in Bubble. The JWT system makes it easy to maintain secure data access patterns without writing complex code. This hybrid approach gives you the best of both worlds - you can use Supabase where it makes sense while keeping the rest of your app in Bubble.

It also works great with the API connector, you can pull data into Bubble just like any other API. You can choose whether to use the plugin to pull data (maybe if you need the realtime updates) or to just use the regular old API connector.

The integration between Supabase and Bubble's API Connector feels completely natural. When I first set it up in UserLoop, I was pleased to find that making calls to Supabase felt just like working with any other API in Bubble. The difference is that you have the full power of a PostgreSQL database behind those API calls.

This makes it perfect for handling large datasets and complex operations that might be challenging in Bubble alone.

It works great with Cloudflare Workers if you want to do more of your processing on the edge at a low cost

I've recently started exploring the combination of Supabase with Cloudflare Workers, and it's opened up some exciting possibilities.

I’ve covered Cloudflare Workers a lot in the past, and how I love using them for backend processing tasks. The good news is they work amazingly well with Supabase too!

For example I have recently made a Cloudflare Worker which pulls data from Supabase and runs it through OpenAI to extract key themes from customer feedback, it then responds with a nicely formatted JSON object.

I’m going to touch a bit on combining Cloudflare Workers and Supabase in future issues - I think this is going to be a great combination for building AI Agents.

If you’re interested in learning more about building agents I really recommend checking out JJ Englert’s new course on the topic. He’s one of the OG Bubble and NoCode experts - and this new course on agents covers everything on how to build them, the tools to use and what they can do.

That’s it for this week’s edition!

Let me know if you would find a video tutorial of getting started with Supabase and Bubble useful and I’ll put one together. I really do encourage you to give it a try!

Don't forget to fill out my reader survey to help shape future content if you have a spare moment!

Thanks again for reading, and happy building!

James

PS: There is only 1 week left to get your early bird to the Create With Conference in London on Thursday May 22nd. It’s going to be a day of talks, tutorials and of course drinks with some of the best NoCode and AI builders from around the world. Tickets here.

I was lucky enough to spend the end of last year exploring on motorbikes, trains, planes and boats and it was an incredible experience.

It also renewed my thanks for tools like Bubble which have allowed me to build my own SaaS and to be able to take trips like that. Even though I continued working throughout the trip of course, there’s no true break for us solo founders!

I filmed a ton which I’m currently editing together for YouTube - which is a lot more work than I originally anticipated 🤣

As we look into 2025 I’m really excited to share some of the things I’ve been working on that I’ve learnt over the last few months when building with AI and Bubble.

I’ve been working on the first major technical reorganisation of my app UserLoop since it launched, simplifying the feature set and switching out much of the core backend logic.

I’ve been doing all of this with AI generated code, and the results have been really breathtaking for me. Some of the core changes including moving my core database to Supabase, and much of the most common processing to Cloudflare Workers.

I’ve covered Cloudflare Workers a bit in this newsletter in the past, and I’m going to be covering them a lot more over the next few months, along with more content on how to use Supabase with Bubble.

My app dev stack has changed quite a bit.

It’s worth mentioning that the entire stack is still effectively ‘nocode’ - although I am using AI to generate a lot of the code that is getting deployed to Cloudflare and queries for Supabase.

Bubble - frontend app logic, simple database for storing user preferences and account management, billing.

Cloudflare Workers - complex backend logic, AI data processing, high throughput processing. Super fast and insanely cheap way to complete processing tasks.

Supabase - high scale database with complex querying capability, fast speed. No need to know how to code or use SQL. Low cost, powerful, fast.

Hookdeck - managing inbound webhooks, allowing me to route them either to Bubble, directly to Supabase or Cloudflare, along with super easy monitoring and ability to replay.

OpenAI & Anthropic - powering all the AI features in my app, now largely called via Cloudflare Workers than through backend workflows in Bubble itself.

We’re really starting to blur the lines between traditional coding and nocode tools now, even a year or two ago I would never have thought I’d be able to use developer platforms like Cloudflare Workers and Supabase so effectively, but they’re now core parts of my workflow when building with Bubble - and the features I’ve been able to make are way beyond anything that would have been possible previously without being a fairly advanced developer.

It’s an incredibly exciting time to be building apps - and as the technology continues to improve this year with more autonomous agents we’ll see more and more solo founders finding success without huge teams or giving away equity.

We’re entering the world of the ‘Self Driving Startup’ - where you can put all the systems in place to build and grow a SaaS business using AI autonomously.

This fantastic post from Monzo co-founder Jonas Templestein outlines the concept, and the neat way of breaking down the different levels of autonomy from Level 1 to Level 5. There’s also a more detailed blog post on the subject here which is well worth reading.

I’m going to aim to cover building a startup using AI and NoCode in this way more in this newsletter in 2025, and try to automate as much of the day to day running of UserLoop as I can using agents.

On to this week’s topic though - how to translate your Bubble app into multiple languages!

How to translate your Bubble App into 30+ languages for free

For the last year or so I’ve offered UserLoop in 5 different langauges. Users are able to select from a dropdown when they sign up, and then the entire app’s UI switches to that language.

Like many others I signed up to a fairly expensive service which took care of the translation. All I needed to do was drop a javascript snippet on the page and then trigger some Javascript to switch languages.

While this worked great, it was also crazy expensive!

You get charged per word translated, at a very steep rate.

So when I saw this tweet from David Bressler of FormulaBot on how he used some custom code on top of Google Translate to translate his app into multiple langauages for free it really caught my attention!

The translation works in exactly the same way as for the paid services, you drop a code snippet onto every page you translate then call some custom Javascript to translate the page content.

The only difference is it’s totally free.

After a very long conversation with ChatGPT I was able to add the same functionality to my own app, and I was shocked how simple it is!

The only caveat worth mentioning is that this is a slightly unofficial way of using the Google Translate website embed widget, so there is no guarantee it will work forever but it’s well worth trying out.

To get started with adding translation to your app, first you need to add the following code snippet to all pages in your Bubble App.

Download the script here.

For simplicity I recommend adding it to your app’s meta header in settings.

This will load the translate script on every page.

Then, you need to create a simple option set in Bubble containing the languages you want to translate your app into.

The display should be the language code, for example en, fr, de, es and then add a user readable title such as English, French, German.

Then, add a dropdown to either your app’s settings page, or your footer. Wherever you want to let the user change their language.

In my app, I’ve added the dropdown on the account settings page.

Then in the dropdown, we load in our option set. And show all the languages from our option set, and set the user readable field as the display option caption.

Then we need to set up a new workflow on our page.

This will trigger when the value of this dropdown is changed.

When the user changes the value in the language dropdown we then run the following Javascript using the free Javascript Toolbox plugin on Bubble.

We simply then inject the display code of the language the user selected and then Google will instantly translate the contents of that page into that language.

Here’s the plain javascript to run…

translateToLanguage('en’);

Obviously you just inject your language string in there.

Also you might notice I’m storing the user’s language preference to the database against their company record in the database.

This means I always know which language the user has selected in the backend - and also lets me run this javascript whenever they load the app. So the app is always automatically translated into their language of choice whenever they open it.

To do this, you simply need to call this javascript action on page load, if the user has a language set (use a conditional rule).

It’s an amazingly cheap, easy and effective way to translate your app. Huge shoutout to David for spotting this!

That’s a wrap for the first edition of 2025! Thank’s so much for being a subscriber and following along with my journey.

Are there any topics you’d like me to cover this year? Or have any feedback, just hit the reply button - I love hearing from you!

Until next time have a great weekend - and happy building!

James.

This was my second time visiting, and it didn’t disappoint. I’m always blown away by how friendly people in the NoCode community are, and I feel really lucky to be a part of it and have made so many friends, including some of you who subscribe to this newsletter!

Watch NoCode Summit episode on YouTube

For me the big takeaway from the event is how AI is continuing to redefine the entire space, and really blur the lines between traditional development and NoCode. Indeed even the term NoCode is being used less and less, with more of the tools preferring to talk about ‘visual development’.

I think this is a good way of framing how the tools work, I’ve never fully understood why tools like Bubble are under the NoCode umbrella, many of the best apps have lots of custom code in them (even if it’s increasingly generated by LLMs 😅)

If you’re interested in hearing more about what happened at the summit, how to plan your time there, and all the after hours fun check out the latest Create With Podcast which I recorded right from the venue at Station F in Paris with Kieran and Ash.

Now let’s dive into this week’s topic…

Dynamic Prompting in Bubble for AI

If you’ve been building with AI and Bubble, I’m sure you’ve wondered like me about the best way to create prompts to get the highest quality outputs in your app.

I covered the basics of returning structured data from OpenAI in this previous edition which you might find helpful to read before following the below if you’re not familiar with it.

The fact is, if you write simple prompts without a whole lot of context - you’re always going to get fairly generic responses back from the model.

To build truly magical user experiences that go way beyond what people could do directly in ChatGPT you need to get serious about writing dynamic prompts.

This means customizing the prompt every time it runs, depending on things like…

• The current user

• What this specific user is trying to achieve, and what other tasks they’ve already completed in your product

• Where the user is located, the time of day and the date, what language do they speak

• Pulling in things from external APIs, like scraping the user’s website to understand the context in which to execute your request

• Changing a prompt behaviour depending on user preferences and settings

By passing data like this into your requests to LLMs like OpenAI and Anthropic, you can dramatically improve the quality of the responses you get - and ultimately how useful your app is to users.

In this edition I want to cover a few of the most important basics for writing dynamic prompts in Bubble based on showing you an example from my own app, UserLoop.

I’m going to show you an example of one of my app’s most popular AI features - our AI powered survey question generator.

This feature not only helps with our onboarding flow by generating personalised survey questions for each user, it also is one of the most frequently used features in the app.

It’s all driven by dynamic prompting

I’ve made a short video outlining the main techniques you can watch below, or read on for the written tutorial version.

Watch the tutorial

Here’s the written version if you prefer that to watching the video…

Use Option Sets for Prompt Management

Option sets are the easiest way to manage prompts in Bubble. I use them for everything - survey types, languages, you name it.

Just so long as it’s not sensitive information you can store it in an option set!

Why they work:

• Easy to update prompts without touching your workflows

• Simple to test different versions

• Can be attached to entities in your database

Here's how to get started:

1. Create option sets for different scenarios (e.g., survey types, languages) - it all depends on what your app does.

2. Add a "prompt" field to each option in your option set

3. Store the actual prompt text within these options

Example

Option Set: Survey Types

Here you can see I’ve created a field called OpenAI Prompt where I’m going to store the prompt I want to inject for each option.
This makes your prompts easily maintainable and allows for quick updates without changing your workflow.

Prompt Branching Logic

Use Bubble's conditional logic to create dynamic branches in your prompts. Here's the basic pattern:

1. Use "Is empty: formatted as text" to check field values

2. Create Yes/No branches for different content

3. Nest conditions for complex logic

Example Structure:

Here’s an example from one of my prompts.

Here we are creating a branch in the logic for the prompt which is going to change depending on whether thie company’s Brand Text field is empty or not.

We do this by using the expression Brand Text is empty: formatted as text

Then in the formatting for the text we leave yes empty (we don’t want to inject any prompt if this record doesn’t have any data. And for no (which mean a record exists) we want to inject the content from the database along with some instructions for the AI to follow.

But if we just injected these instructions when the record was empty, it would lead to us getting a very poor quality output from the model.

Database Content Injection

This is the big one - using what you already know about your users makes AI responses 10x better.

In UserLoop, we check what questions are already in a survey to avoid duplicates. But this could be used to pull any kind of information from your database and inject it into your prompt.

• Format your data clearly for the AI

• Use the :format as text operator on a Search expression to add written context to results from your database

• Add specific instructions ("Don't use any of these:")

• Keep lists clean and readable, use line breaks to separate items

Here’s an example of that in practice…

Here I’ve created a branch based on…

Search for Questions: first item is empty formatted as text

That means for yes (there are no records) we don’t want to inject anything.

But, if data does exist (in the Formatting for no section) we want to inject a prompt and the content from the database.

Here you can see the prompt and us running another Search for Questions operation, where we are formatting the output as text.

Then in our text box, we want to tell the LLM the name of each record, and add a comma and a line break in between each record.

This means the LLM is going to output a list of questions and for each one all the data listed above.

External API Enrichment

This is a bit more advanced but worth it. We use Perplexity to scan user websites and understand their brand. This means our AI writes questions that match their style.

We then take that data and inject it into our prompt - this gives the model additional information about the user making the request and their context. Which in turn helps it write higher quality questions.

Remember to:

• Have a backup plan if the API fails - use conditional branching!

• Only use external data when it helps

• Make sure you use the :formatted as JSON safe on all data you get back to avoid breaking your prompt with rogue characters

I covered using Perplexity AI for this in a recent edition, you can read it here.

Remember, the key to effective dynamic prompting is finding the right balance between providing enough context and keeping your prompts manageable. Start simple and build up complexity as needed depending on the results you get.

That’s it for this week!

I hope you found this issue helpful, I’m excited to dive into more AI topics in the next few issues. I’m going to be covering Replicate, Bland AI, Replit and more on Cursor and Cloudflare - so stay tuned!

Anything else you’d like me to cover, or have thoughts on what I should be writing about? Drop me a reply or a comment, I love to hear from you!

Happy building! James.

We touched on lots of topics, from how to get started building AI features with Bubble, through to more advanced topics like returning structured data, how to pick the right AI model for your use case and prompt engineering in Bubble.

The full discussion is now live on YouTube here for you to watch - I’d love to hear your thoughts and questions in the comments.

Watch on YouTube

Over the 2 days we heard Bubble had acquired Flusk, launched the Native Mobile App Builder in Beta and announced Bubble Assisst AI. We also got a new design for the workflow tab in the editor and a bunch other updates.

There was a great session from Gregory John on SEO in Bubble (it is possible to rank well!) and another from Petter Amlie on Balancing Workload, UX and Performance that is defiantly worth a watch

It was great to meet so many people building amazing things with Bubble over the 2 days, and lots of subscribers to the newsletter in person!

I was also lucky enough to meet the winner of the free BubbleCon ticket from the contest in this newsletter a few weeks ago - Steven Traykovski (awesome to meet you Steven!!)

Once we wrapped on the conference I was lucky enough to be joined by Sam Morgan and Andrew Vernon from Bubble for a quick chat on the Create With Podcast, where we talked about our highlights from the 2 days and predictions for next year.

So if you’re looking for a quick 30 minute summary of everything that happened that’s worth checking out.

Watch the Podcast on YouTube

It was a super interesting few days, where I learnt a lot and left feeling super optimistic about the opportunities for people building with NoCode and AI over the next year.

I’ve put together some of 3 of my overall takeaways from the conference below, focussed on Bubble x AI… and what’s next.

1. Bubble should be the default way most AI powered SaaS starts out

Bubble is exceptionally well positioned to win in the AI software development space. It has all the components needed to beat players like Replit if it can execute well.

I see Bubble as being a central hub in my own app UserLoop - it’s the glue that sticks all these other services together. From OpenAI, to Anthropic, Tinybird, Shopify - they’re all spokes around Bubble as the central processing hub.

Bubble combines an IDE, hosting, database, security management, hosting, API management all in one package - with a powerful visual workflow editor that let’s you see what’s happening.

I believe that pretty much every SaaS app that wants to leverage intelligence should start out being built with Bubble. The ability to build, iterate and ship quickly alone is incredibly powerful.

2. Job market disruption will send way more people into Bubble’s ecosystem

As AI increasingly disrupts the job market I expect more and more people to enter the Bubble ecosystem and start building their own software to make a living.

One trend I noticed at BubbleCon this year was how many other ex-product managers I met who were now building in Bubble.

I spent 10 years in product management myself before starting to work full time with Bubble on a SaaS. Skills like product management translate to Bubble and AI really well, as you can often apply your skills to actually shipping features instead of just describing them in Jira tickets.

10 years ago I would never have imagined I’d be running a SaaS without being a programmer, and to be making a living from it.

I’m really excited to see more and more people take that path, becoming independent and building incredible things.

3. Importance of Prompt Engineering

One skill I think it’s super important to work on is prompt engineering. Not only for using in tools like ChatGPT and Claude, but also for building custom complex prompts in Bubble itself.

As I mentioned in a previous issue, I now use the combination of Claude + Cloudflare + OpenAI + Bubble to ship most of the AI features in apps I work with, and that all depends on having a good understanding of how to prompt AI.

Knowing how to write high quality prompts that give clear direction can mean you can ship incredible features quickly with minimal revisions. I covered this example in a previous issue but I’ld love to cover this more in future issues as I think it’s so important.

The other prompting skill it’s important to learn is how to write dynamic prompts in Bubble, with branching and injection of data from the database into prompts.

I’m going to cover this in a future edition, as this is pretty essential when trying to do more advanced things with AI models in Bubble.

Don’t expect to get high quality outputs from AI without making amazing prompts, and providing the model with as much data as possible. Without customizing your prompts and injecting user specific data, you’re not offering anything over what they could do with ChatGPT directly - so this is important to learn.

That’s it for this week!

I hope you found this issue interesting, I feel really lucky to have been able to attend BubbleCon and meet so many fantastic people.

I honestly don’t think there’s ever been such an exciting time to be building software without actually writing the code yourself - what you can build now is truly incredible.

Next week I’m heading to NoCode Summit in Paris - I’ll be covering everything that happens and all the big news. Will you be there? drop me a reply I’d love to meet you and get a coffee!

That’s it for this time, we’ll be back to more tutorial focussed content soon. But in the meantime don’t forget to subscribe to my other newsletter Create With for more weekly news on AI and NoCode!

Until next time, happy building!

Cheers,

James.

PS: Need help building your own NoCode SaaS or implementing AI or APIs? Check out my consulting and development page - I’m love working with other founders and startups to help bring products to life. ✌️

Welcome to this week's NoCode SaaS newsletter, where I take you along on my journey of building profitable software businesses without code using Bubble.

This week’s tutorial is all about how to build a Cloudflare Worker without code that can extract structured data using OpenAI and return it to Bubble - it’s a super cool technique I’ve been using lots of my apps.

I’m heading to New York this weekend for the second ever BubbleCon. I can’t wait to see lots of you there. I’m hosting a AI and NoCode fireside chat on Day 2, so be sure to check that out as we have an awesome panel with George and Emily!

But first I wanted to update you on a busy few weeks - super excited to have just launched Create With!

It's bringing together a bunch of different projects I’ve been working on over the last few years.

• The NoCode UK Conference I organized with Kieran and Ash

• The NoCode SaaS Podcast

• Tutorials, interviews and reporting from AI and NoCode events around the world

The next few years hold incredible opportunity for more and more people to change their lives through learning how to build apps, without being a traditional programmer.

We wanted to pool our resources so we can help as many people as possible upskill with AI and NoCode and start building.

Kieran, Ash and I recorded a podcast this week where we spoke about the reasoning for the change and some of what we have planned.

The Create With Conference is going to be back bigger and better than ever in London in 2025 - earlybird tickets are already on sale and going fast. We’re pulling together the leading experts in AI and NoCode, who have been there and done it themselves to speak at the event. Can’t wait to reveal more about this soon!

Please consider subscribing to the free Create With Newsletter - we’re aiming to make an unmissable weekly summary of what’s happening in AI and NoCode. With the top news, tutorials and events from around the world.

Subscribe to the Create With Newsletter

Now, on to this week’s tutorial…

Creating a Cloudflare Worker to Extract Data Using AI

I’ve written before about how much I love Cloudflare Workers.

Workers are small JavaScript programs that run on Cloudflare's network.

They execute incredibly fast and can handle tasks like processing HTTP requests, making network calls, and interacting with APIs—all without the need for a traditional server setup.

They’re an amazing tool to use with Bubble, as they can complete tasks at a very low cost - and they can do things you simply can’t do in Bubble.

And the best thing is, you can create them without writing any code all through a web UI, and they hook up to Bubble easily via the API Connector.

In this tutorial, I’m going to walk through…

• Use AI (OpenAI's GPT-4o-mini model) to extract key information from resumes.

• Generate the worker code automatically using Anthropic's Claude AI assistant.

• Integrate the worker with Bubble.io using the API Connector plugin.

You can watch the tutorial here…

Watch Free Tutorial

Step-by-Step Guide

1. Set Up Your Cloudflare Worker

• Log into Cloudflare: Access your Cloudflare account dashboard.

• Navigate to Workers: Click on the "Workers" section on the left sidebar.

• Create a New Worker:

  • Click "Create a Worker" and select "Create a blank worker."

  • Name your worker (e.g., Resume-AI-Extractor) and click "Deploy."
    
    

2. Generate Worker Code Using AI

• Open Anthropic's Claude:

  • Provide a prompt outlining what you want the worker to do. For example here is the example prompt I use in the video

I want to create a Cloudflare Worker which extracts key info from a resume and returns it as a structured JSON object.

- The Cloudflare Worker variable for the OpenAI key is OPENAI_API_KEY.

- Use the OpenAI model 'gpt-4o-mini'.

- Use OpenAI's JSON mode to return structured data.

- Make a POST request to the worker with an object containing the text from a resume, e.g.:

{

"resume_text": "Your resume text goes here..."

}

- I want the worker to return a standard structure of data from a resume. You should define the structure.

• Receive the Generated Code:

  • Claude will generate the JavaScript code for your worker, handling the POST request, calling the OpenAI API, and returning the structured data.
    

• Copy the Code:

  • Paste the generated code into your Cloudflare Worker's code editor.
    
    

3. Securely Store Your OpenAI API Key

• Set Environment Variables:

  • In Cloudflare, go to your worker's "Settings" and add an environment variable for your OpenAI API key.

  • Name it (e.g., OPENAI_API_KEY) and paste your API key.

  • Encrypt the Variable to keep your API key secure.

  • Don’t forget to press ‘Deploy’ to store the key.
    

4. Test Your Worker

• Prepare Sample Data:

  • Use a sample resume text to test your worker.
    
    A great tip is to just ask Claude to generate you some test data to use in a post request, it will be formatted correctly and saves you spending time on mocking up test data!
    
    
    

• Use the Testing Pane:

  • In the Cloudflare editor, switch to the right hand pane where you can test out your Worker code.

  • Set the request method to POST and paste your sample resume into the request body.
    
    

• Run the Test:

  • Click "Send" to execute the worker.

  • Check the output. The worker should return structured JSON data extracted from the resume.

  • If you get any errors in the output from the worker, you can copy and paste the error and put it into Claude to ask it to fix the Worker code.
    
    Tip: You can take screenshots of the errors and upload them to Claude, it recognises them too!

5. Integrate with Bubble.io

• Copy the Worker's URL:

  • You'll need this to set up the API call in Bubble.
    

• Set Up the Bubble API Connector:

  • In your Bubble app, head to the API Connector

  • Create a new API call:

    • API Name: Cloudflare Worker

    • Call Name: Resume Extractor

    • Method: POST

    • URL: Paste your worker's URL.

    • Body Type: JSON

    • Request Body: Include a parameter for resume_text.

• Initialize the Call:

  • Bubble will detect the data structure from the worker's response.
    

• Use the API in Your App:

  • You can now use this API call in your workflows to extract data from resumes and use it within your Bubble app.

Why Use Cloudflare Workers for AI Tasks?

• Cost-Effective: Cloudflare Workers are inexpensive to run, with a generous free tier - you probably will never need to pay unless you’re running millions of requests.
  

• Performance: They run on Cloudflare's global network, ensuring low latency and high speed. There’s minimal lag when you make the request from Bubble, the Worker starts working immediately.
  

• Scalability: Easily handle increasing workloads without worrying about server management - not to mention the reduced WU consumption.
  

• Security: Store sensitive data like API keys securely using environment variables.

Things to Keep in Mind

• Security Measures: Consider adding authentication to your worker to prevent unauthorized access. I’ll cover this in a future edition, it’s as simple as asking Claude to implement
  

• Error Handling: Implement robust error handling in your worker code to manage exceptions gracefully, Claude can handle writing all of this for you.
  

• Customization: Tailor the data extraction and JSON structure to fit your application's needs - the possibilities are pretty endless.

Next Steps and Enhancements

While we've focused on extracting data from resumes, this approach can be extended to other documents like invoices, contracts, or any text-based data.

You could also:

• Add More Features: Integrate additional AI models or services as needed, you can even make multiple calls to different AIs and group together the responses. I have used looping to make hundreds of requests to OpenAI from a single worker and then batched together the outputs - it’s amazing.

• Expand Functionality: Use the worker to perform other tasks like data validation, sentiment analysis, or language translation, you can even use the built in Workers AI Meta models to use AI analysis for free - we’ll cover this in another future edition.

That’s it for this week!

You don’t need to be a hardcore coder to use Cloudflare Workers, I believe they’re something every Bubble developer should have in their pocket.

For doing complex things with AI, reformatting data or other custom logic, they’re the perfect partner to your Bubble App - I’ve already built over 20 for doing different tasks in my own apps!

I hope you found this guide helpful! As always, feel free to reach out with any questions or feedback. I'm excited to see how you implement this in your projects.

Stay tuned for next week’s issue where I’ll write up everything that happened at BubbleCon!

We’ll have some exciting interviews from the conference lined up, so don’t forget to subscribe to the Create With Newsletter and Podcast to stay posted!

Need help building or planning a AI and NoCode App? Check out my Dev & Consulting options! I’ve worked with lots of founders to help them build and launch AI powered apps with Bubble

That’s it for this week - happy building!

James.

It's James from the No Code SaaS newsletter. This is the newsletter where I take you along on my journey of building a profitable SaaS business without code.

This week we're diving into an alternative approach for getting certain types of data into your app - web scraping.

If you've ever wanted to pull in tweets, Instagram posts, or Google search results, this technique is well worth considering.

I've used it in a couple of apps myself and found it incredibly handy, it’s a really flexible way of getting all sorts of data into your app. Particularly useful for doing things like AI analysis.

Also in this week’s edition I’m running a contest for a free ticket to the Bubble conference in NYC taking place next month, BubbleCon. I’ll be speaking on the AI panel on Day 2 - so can’t wait to see you there.

If you’d prefer to dive in and watch the tutorial straight away, just click here.

Watch Bubble Scraping Tutorial

Why Scraping?

Let's face it - many services like Twitter, Instagram, and Google either don't have APIs we can easily use, or they're heavily restricted.

Twitter's API limitations have become particularly onerous lately. This is where scraping services come in handy.

They're reliable, high-quality, and way easier to use than official APIs. Plus, there are far fewer restrictions - though you will likely have to pay to use them.

But in my experience it’s worth the cost compared the extra dev time, limitations and restrictions that often come with using official APIs.

With large scale providers like Apify maintaining the scrapers, all you have to do is set up an API call and forget about it, I’ve found it to be highly reliable with minimal issues.

What Can You Scrape?

The possibilities are vast, but here are some practical examples:

1. Social Media Content:

   • Twitter/X: Grab tweets, user profiles, or trending topics

   • Instagram: Fetch posts, stories, or user information

   • LinkedIn: Pull job postings, company updates, or user profiles
     

2. Search Engine Data:

   • Google: Capture search results, featured snippets, or local business listings
     
     

3. E-commerce Information:

   • Amazon: Product details, prices, reviews

   • Etsy: Handmade and vintage item listings

   • eBay: Auction data, seller ratings
     

4. News and Content:

   • News websites: Article headlines, summaries, full content

   • Blogs: Posts, comments, author information

   • YouTube: Video titles, descriptions, view counts
     

5. Travel and Hospitality:

   • TripAdvisor: Hotel reviews, ratings, pricing

   • Airbnb: Property listings, host information, availability

The Tool: Apify

In this week's tutorial, we're using Apify. It's like an app store for scrapers - thousands of pre-built options ready to go.

I've found it super reliable and it plays nice with Bubble. Best of all, it's dead simple to use.

How It Works

1. Choose Your Scraper: Apify has scrapers for almost everything. We're using their Instagram scraper as an example.

2. Configure: Set what you want to scrape (e.g., hashtags, number of posts).

3. Run: Execute the scraper through an API call.

4. Get Data: Receive structured JSON data ready to use in your Bubble app.

In my video tutorial, I walk through scraping Instagram posts with the #bubblecon2023 hashtag.

We set it up in Apify, create an API connector in Bubble, and then display the results on a page. It's that straightforward.

Watch The Tutorial

Why This Matters for Your SaaS

1. Rich Data: Enhance your app with real-world, current data without complex integrations.

2. Flexibility: Not limited by official API restrictions - scrape what you need.

3. Quick Implementation: Often faster to set up than official APIs, especially for prototypes or MVPs.

4. Cost-Effective: Many scrapers charge per result, allowing for better cost control.

Next Week: Leveling Up with AI

We're taking this a step further next week. I'll show you how to:

1. Run a scraping job

2. Process the results with AI (using Claude)

3. Return the processed data to Bubble

All of this happens on a Cloudflare worker, without writing any code.

Imagine scraping Instagram posts, categorizing them with AI, and returning the sorted data to your Bubble app - all in one go.

It's a powerful combo that opens up tons of possibilities - without using hardly any Bubble WUs!

Bubblecon Giveaway

Don't forget - I’m giving away a free ticket to Bubblecon! I'll be speaking on the AI panel on day two. If you're keen to attend, hit this link to enter. One lucky subscriber will snag that free ticket.

Enter the Giveaway

That’s it for this week!

Scraping can be a really handy tool have in your pocket for your Bubble apps. It lets you pull in data that might otherwise be out of reach - and it’s really useful when you’re trying to get data into your app to analyze with AI.

Give the tutorial a watch, and let me know if you have any questions or cool ideas for future issues - I always love hearing from you.

Catch you next week for our AI Cloudflare Worker deep-dive!

Cheers, James

Welcome to this week's NoCode SaaS newsletter, where I take you along on my journey of building a profitable SaaS business without code using Bubble.

This week, I'm excited to share a game-changing feature that's been hiding in plain sight: a secret hack to run backend workflows from the frontend in Bubble, without the usual hassle of the API connector.

First off, a huge shoutout to reader Stuart for his fantastic comment on last week's newsletter, which pointed me to an eye-opening forum post by George Collier.

This hidden gem has unlocked a method I've been wishing for in Bubble for ages!

The Problem: Running backend workflows from the frontend and returning data has always been a bit of a pain.

Traditionally, we've had to use the API connector, which comes with its fair share of headaches:

• Time-consuming setup

• Tedious maintenance

• Nightmare to update when fields change

The Solution: Enter the App Connector plugin.

While it's designed to let you run workflows in other Bubble apps, it turns out you can use it within your own app to call your backend workflows.

This method is not only more efficient but also saves hours of tedious setup time. The full documentation for the plugin is here if you’d like to read up on it before the tutorial.

In this newsletter, we'll dive into:

1. What this secret hack is all about

2. How to set it up (spoiler: it's surprisingly quick!)

3. Building a simple workflow to demonstrate its power

So, whether you're looking to boost security, improve performance, or enhance usability, this method of running backend workflows is a game-changer.

Setting Up the Bubble App Connector Plugin

Watch the video tutorial

Let's walk through how to set up this magical workflow hack step-by-step:

1. Install the App Connector Plugin

First, head over to your Bubble app's plugin section and search for "App Connector". This plugin is officially made by Bubble, so you can trust its reliability.

2. Configure the Plugin

Once installed, it's time for a quick setup:

a) Go to the App Connector settings in your Bubble editor.

b) Click on "Connect to app"

c) Enter your app’s domain

d) Hit "Connect"

3. Refresh App Metadata

This step is crucial for syncing your backend workflows:

a) In the App Connector settings, find the "Refresh app metadata" button.

b) Click it to pull in all your current backend workflows.

4. Select Your Backend Workflows

Now you'll see a list of all your app's backend workflows. Simply check the boxes next to the ones you want to make available through the App Connector.

Important: You will only see backend workflows which have the ‘Expose as public API workflow’ option checked.

And that's it for setup! Believe it or not, you're now ready to start calling backend workflows from your frontend with ease.

Using the App Connector in Your Workflows

Now that we're all set up, let's see how to use this in practice:

1. Create a New Workflow

In your Bubble editor, create a new workflow or edit an existing one where you want to call a backend workflow.

Make sure your workflow is returning some data - if you need it. You can see me do this in the video tutorial.

Make sure the workflow ‘Expose as public API workflow’ option ischecked.

2. Add the App Connector Action

In your frontend workflow editor:

a) Click to add a new action

b) Search for your app name

c) You'll see options like "Run [Your App Name] [Workflow Name]"

3. Configure the Action

When you select the action, Bubble will automatically show you the input fields required for your backend workflow. No more manual setup or guesswork!

4. Use the Returned Data

The best part? You can now use the data returned from your backend workflow in subsequent steps of your frontend workflow. It's seamless!

Why This Matters

This method of calling backend workflows offers several advantages:

1. Improved Security: Keep sensitive operations on the backend

2. Better Performance: Offload complex operations from the frontend

3. Easier Maintenance: Update your backend workflow, and the frontend call updates automatically

4. Cleaner Code: No more cluttered API connector setups

Potential Use Cases

Now that we've seen how easy it is to set up and use the App Connector for backend workflows, let's explore some real-world scenarios where this can be a game-changer for your Bubble app:

Complex Calculations and Data Processing

Generating detailed reports or analytics

Example: Let's say you're building a financial app. You could create a backend workflow that calculates complex metrics like ROI, compound interest, or risk assessments based on multiple data points.

Call this workflow from the frontend when a user requests a report, process the data securely on the backend, and return only the necessary results to display.

Third-Party API Integrations

Securely interacting with external services

Example: Imagine you're building a weather app. Create a backend workflow that fetches data from a weather API, processes it, and returns only the relevant information.

This keeps your API keys secure on the backend and allows you to format the data before sending it to the frontend.

User Authentication and Authorization

Enhanced security for sensitive operations

Example: For a finance app, you could create a backend workflow that handles authentication and login by generating a magic link.

The frontend calls this workflow, which then manages the entire authentication process, including sending verification codes and validating responses, before returning a simple "authenticated" or "failed" response, along with the magic link to log the user in if it was succesful.

Batch Operations

Handling large-scale data operations efficiently

Example: In an e-commerce app, use a backend workflow for bulk product updates.

The frontend sends a list of products to update, the backend workflow processes each item, perhaps interacting with inventory systems or other databases, and returns a summary of the changes made.

By leveraging backend workflows through the App Connector, you're not just simplifying your development process – you're opening up a world of possibilities for creating more powerful, efficient, and secure Bubble applications.

The added bonus is you can also include pretty loading animations (like the ones in the video tutorial)

Remember, the key is to think about which operations benefit most from being run on the backend, and then design your workflows accordingly.

With this approach, you'll be able to build more sophisticated apps without sacrificing performance or user experience.

I hope I’ve inspired you to try out this method for running your workflows! By bridging the gap between frontend and backend workflows, we're able to create more powerful, efficient, and secure applications with less hassle.

Key Takeaways:

1. Simplicity: Setting up the App Connector is surprisingly quick and easy.

2. Flexibility: You can now run complex operations on the backend and seamlessly use the results in your frontend.

3. Maintenance: Say goodbye to the headaches of manually updating API calls every time you tweak a backend workflow.

4. Security: Keep sensitive operations and data on the server-side where they belong.

Start small – perhaps by converting an existing API connector call to use the App Connector instead.

As you get more comfortable, you might find yourself rethinking how you structure your app's logic, taking full advantage of what backend workflows can offer.

I’ve already started using this technique in my own apps.

I'd love to hear how you end up using this in your own projects! Feel free to reach out and share your experiences, or if you have any questions as you start implementing this approach.

That’s it for this week!

That's it for this week's deep dive into the world of Bubble backend workflows. I hope you found this as game-changing as I did when I first discovered it.

A huge thanks again to Stuart for the tip and to George Collier for sharing this tip - I really hope more people hear about this as it’s an amazing hack!

Happy building, and here's to making our Bubble apps even more powerful!

James

P.S. If you haven't already, don't forget to subscribe to the NoCode SaaS podcast where myself and Kieran (@nocodelife) discuss all things no-code and SaaS. You can find us on all major podcast platforms.

Listen to the podcast