# What Is a Webhook? A Visual Guide > A visual guide to webhooks: a web address that waits for another app to send it data, shown in a real Lovable + n8n lesson, with tips to use it safely. Source: https://learn.ynteractive.com/content/visual/term-webhook-explained · Updated 2026-10-01 · Free from Stepthrough (https://learn.ynteractive.com) [AI term explained](https://learn.ynteractive.com/content/visual#format-term-of-the-day) · 4 slides · [Lovable](https://learn.ynteractive.com/content/tool/lovable) · [n8n](https://learn.ynteractive.com/content/tool/n8n) By [Robert Breen](https://learn.ynteractive.com/content/about) · Published October 1, 2026 · From the free lesson [Lovable + n8n: Build a Web App with an AI Backend](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend) A visual guide to webhooks: a web address that waits for another app to send it data, shown in a real Lovable + n8n lesson, with tips to use it safely. Swipe or scroll sideways for all 4 slides. The whole guide is written out below. ## The guide in text ****Webhook**:** A web address that waits for another app to send it data. When a form is submitted, the details go to the URL right away, and the workflow behind it starts. ## The doorbell for a form In the Lovable + n8n lesson, a contact form sends Name, Email, Question and Feedback as JSON to an n8n webhook. ## Use webhooks safely - Treat a webhook URL like a password. Store it as a secret. - A form that should only say thanks after the work is done needs a **Respond to Webhook** node. - Test with one real submission and check every place it should land. **The full definition:** [What is a webhook?](https://learn.ynteractive.com/content/glossary/webhook) in the AI glossary, with an example from a free lesson, common confusions and tips. Businesses and people in the examples are made up. The steps, screens and wording come from the free lesson and the Stepthrough glossary and prompt library. ## Do it yourself, free **Lovable + n8n: Build a Web App with an AI Backend**. Build a contact form in Lovable and connect it to an n8n workflow — webhook trigger, AI Agent, Google Sheets, Gmail, and a Respond node that ties it all together. You do every step yourself in a practice copy of Lovable and n8n, it checks your work as you go, and “Do it for me” finishes any step you get stuck on. Free, and nothing touches your real accounts. [Start the free lesson](https://learn.ynteractive.com/modules/lovable-n8n) [Or read the full step-by-step guide](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend) ## Related terms Plain-English definitions, each with an example from a free lesson. [Webhook](https://learn.ynteractive.com/content/glossary/webhook) · [Deployment (publishing a web app)](https://learn.ynteractive.com/content/glossary/web-app-deployment) · [No-code (and low-code)](https://learn.ynteractive.com/content/glossary/no-code) · [Request body (payload)](https://learn.ynteractive.com/content/glossary/request-body) · [Vibe coding](https://learn.ynteractive.com/content/glossary/vibe-coding) · [Artifacts (Claude)](https://learn.ynteractive.com/content/glossary/claude-artifacts) · [HTTP Request node](https://learn.ynteractive.com/content/glossary/http-request-node) · [Prompt injection](https://learn.ynteractive.com/content/glossary/prompt-injection) [The full AI glossary](https://learn.ynteractive.com/content/glossary) ## Related prompts - [Lovable web form prompt](https://learn.ynteractive.com/content/prompts/web-form-builder-prompt): Write a Lovable prompt for a web form that posts to n8n: fields, validation, button states, a thank-you message, and a webhook… - [AI agent system message prompt](https://learn.ynteractive.com/content/prompts/agent-system-message-draft-prompt): Draft the system message for an n8n AI Agent: who it is, what it knows, its rules and how it writes, including a rule never to… - [AI agent test messages prompt](https://learn.ynteractive.com/content/prompts/agent-test-messages-prompt): Test an AI agent before launch with realistic messages: normal requests, borderline cases, missing details and tricky ones, each… - [Customer intake form questions prompt](https://learn.ynteractive.com/content/prompts/customer-intake-form-questions-prompt): Design the questions for a booking or intake form: only what you need to do the job, each with a field type, help text and a… [All free prompt templates](https://learn.ynteractive.com/content/prompts) ## From the blog - [What Is Lovable? Build a Web Form from a Written Prompt](https://learn.ynteractive.com/content/blog/what-is-lovable): What is Lovable? A plain guide to the tool that builds web apps from a written prompt: how it works, what it's good for, what it costs and where n8n fits. - [n8n Triggers Explained: Which One Starts Your Workflow?](https://learn.ynteractive.com/content/blog/n8n-triggers-explained): n8n triggers explained: schedule, Gmail, chat, webhook and form triggers, how to test each one, and how the trigger changes your AI Agent's prompt. - [n8n Webhook Test URL vs Production URL, Explained](https://learn.ynteractive.com/content/blog/n8n-webhook-test-vs-production-url): n8n webhook test URL vs production URL: why a form works while you test, then stops live, and the fixes for Publish, Respond and $json.body. ## More visual guides - [Mistake to Avoid: Pasting a Webhook URL into Your Page](https://learn.ynteractive.com/content/visual/mistake-webhook-url-in-the-page): A visual tip: don't paste your n8n webhook URL into the page. Store it as a Lovable secret so it stays out of the source and is easy to change. - [Mistake to Avoid: Testing an Unpublished n8n Workflow](https://learn.ynteractive.com/content/visual/mistake-testing-an-unpublished-workflow): A visual tip: an n8n production webhook URL only works once the workflow is published. Publish first, then copy the URL into your app. - [What Is a Context Window? A Visual Guide](https://learn.ynteractive.com/content/visual/term-context-window-explained): A visual guide to the context window: how much text an AI model can see at once, shown with a real ChatGPT meeting summary lesson. [All visual guides](https://learn.ynteractive.com/content/visual) · [All free tutorials](https://learn.ynteractive.com/content)