Make your app do things on its own. You built the part people see with Lovable. Today you learn the part that works behind it. No coding experience needed. Really none.
built withLovable
Bodo Buschick, Exasync OÜ, Tallinn. Everything from today is on one page, QR code at the end.
Thirty seconds
Why listen to me?
I am Bodo. For 5 years I have been building automations for companies.
My company is Exasync, here in Tallinn. My customers are logistics companies: many trucks, a lot of paperwork.
Why this matters
Most work is repetitive. At school too.
1At school: the attendance check. Every lesson the same list: who is here, who is missing. Then someone types it into the system and writes to the parents.
2After online shopping: the confirmation e-mail lands in seconds. Nobody typed it. That is an automation.
3In companies: reading e-mails and typing them into another program. Copying numbers from one screen to the next. Checking every morning: did the payment arrive?
RPA: a robot that clicks like a person.
Cloud automation (n8n): a rule that runs on a server on the internet, not on your laptop.
AI Agents: an AI decides the steps.
Start at zero
Automation is a rule that runs without you.
You already use it
"When it is 7:00, ring."
Today we write rules like
"When someone orders in my app, prepare it and answer them."
When something happens, do these steps. That is the whole workshop.
One picture for the whole morning: a restaurant
Your Lovable app is the counter. n8n is the kitchen.
An order goes in, a dish comes out. n8n is where all the systems meet: a database, payment, e-mail, AI, but also Google Sheets, WhatsApp, your calendar, the weather service.
Your app is made of elements: a button, a text box, a line of text. The button "Order" is the element that rings the kitchen.
And yes, the restaurant itself can be automated
Order taken, dish cooked, plate delivered. No human in between.
What these machines do with plates, n8n does with data.
Country Garden robot restaurant, China. Clip from South China Morning Post, 27 seconds, no sound.
Word one · API = Application Programming Interface
An API is how you talk to someone else's kitchen.
Scan it. You just used an API. Yes, it is supposed to look like code. Nothing is broken. No account, no key. themealdb.com/api/json/v1/1/list.php?c=list
The restaurantWhich kitchen you are talking to. Every service has its own address.
The dishWhat you want from the menu. The menu is written down: the API documentation.
The special wish"Only the seafood dishes, please." Everything after the question mark narrows it down.
And your app? A guest types "chicken" in your app. Your kitchen, n8n, opens exactly such an address with ?s=chicken at the end and gets the recipe back. That is Workflow 2.
Word two
JSON is the order, written down.
Yes, JSON is a coding language. The easiest one there is: a label, a colon, a value. You can already read it. When your app sends this form to the kitchen, n8n calls it the body.
Word three
A webhook is the kitchen bell.
The bell is a web address. Your app sends the order there, only then the kitchen starts. The bell is a box too: the first box, the Trigger node. The clock is another one: "every morning at 8". Today we use the bell.
Other trigger nodes: a new e-mail. A new row in a sheet. A form sent. A message in a chat. A file dropped in a folder.
All of it in one picture
This is every app you will build this weekend.
Trigger node
The "when". The first box. The bell rings, the recipe starts. The webhook is a node too.
Node
One box that does one job. One step of the cooking.
Workflow
The whole recipe: boxes connected with lines. Trigger node first, the rest follows.
Plan for the next 30 minutes
Three workflows. Workflow 1 we build by hand. The other two you paste.
Workflow 1 · the greeting
One order in, a greeting out
Three nodes. We build them together, live.
Workflow 2 · pasted
A dish, a supplier, a decision
An API, then an IF: two paths.
Workflow 3 · pasted
Your Lovable app orders, n8n confirms
The connection to your app.
Think of each workflow as a recipe: the same bell at the start, the same "hand it back" at the end. Only the middle changes.
Before Workflow 1 · one minute of clicking
How I start a new workflow in n8n.
1I click Create workflow.2Empty canvas: I add nodes. Each node does one job.3I click Publish.
Workflow 1 · live · I build it, you watch
Build Workflow 1 from zero: three nodes.
1Webhook, the bell. Add first step, search "Webhook". Method POST, path order, Respond: "Using Respond to Webhook node".
2Edit Fields, the order slip. Click the plus, search "Edit Fields". Add field: label greeting, value as Expression, see right.
3Respond to Webhook, hand it back. Click the plus, search "Respond". Respond with JSON: {{ { "answer": $json.greeting } }}
4Publish. Now the bell is live.
labelvaluegreetingHi {{ $json.body.name }}, your order is in the kitchen.
{{ ... }} is a placeholder. n8n fills it with what came in: body is the order your app sent, name is one line on it. Today Mari, tomorrow Alan.
Workflow 1 · the greeting · copy it, paste it, test it
One guest orders. The kitchen sends a greeting back.
the bell: an order arrives (Trigger node)Webhook
→
reads the name, writes one line: greetingEdit Fields
→
hands it back as "answer"Respond to Webhook
This is what we just built. Copy the whole workflow with the button, paste it into an empty canvas with Ctrl+V, click Publish. Then I ring the bell. The answer is one line: "Hi Mari, your order is in the kitchen."
1On the page: the blue Copy button.2In n8n, empty canvas: Ctrl+V.3Click Publish.
The download link says "JSON". Yes, that is code. No, you do not need to read it. I promise. Copy, paste, done.
Workflow 2 · pasted · a supplier + IF: two paths
A guest orders a dish. The kitchen asks the supplier, then decides.
HTTP Request is the API call: n8n opens the TheMealDB address with ?s=chicken, like you did with the QR code. IF: two paths, never both. Mari orders chicken: "chicken: available". Liis orders unicorn: "unicorn: sold out, ask the chef".
The Lovable prompt · the button is an element, one thing on the screen · the connection is the line with the address
Build a one-page app "Order at the kitchen": name, main dish, drink, button "Order".
On click, send the form as JSON { "name": ..., "main": ..., "drink": ... }
to https://exasync.app.n8n.cloud/webhook/confirm (POST, Content-Type: application/json)
and show the field "answer" from the reply below the form.
Important: replace exasync.app.n8n.cloud with your own workspace URL. You find it in your Webhook node under "Production URL".
Our live demo vibesprint-counter.lovable.app
When something does not work
Check the workflow runs to find errors.
1Make it run. Click "Execute workflow" at the bottom of your workflow, or let your app order once.
2Click the tab "Executions". Every run is one line. Green worked, red failed.
3Click a line, then click a box. You see what came in and what went out. That is how you find the mistake: the box where the right thing went in and the wrong thing came out.
A red line: click it, the red box shows what went wrong.
What we have learned today
Six building blocks you know now.
Kitchen bell · Trigger node
Webhook
Order slip · label + value
Edit Fields
Suppliers
API
Head chef · two paths
IF
Serve
Respond
Workflow runs · find errors
Executions
Take-away for the next 28 hours
Three workflows to paste. All on one page.
1Workflow 1 · the greeting: one order in, one line back
2Workflow 2 · one dish in, checked with the supplier, IF: two paths
3Workflow 3 · your Lovable app connected to n8n
Everything from today. This deck with the copy buttons, the files, the handout. exasync-vibesprint.pages.dev
Who uses ChatGPT, Claude or Gemini?
Then you do not even have to learn n8n by heart. Tell the AI: "I am building this automation in n8n, tell me what nodes I need."
Let's stay in touch.
If questions come up later, feel free to contact me.
Bodo Buschick on LinkedIn linkedin.com/in/bodo-buschick-6815231b7
Lovable
