# Mistake to Avoid: Pasting a Webhook URL into Your 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. Source: https://learn.ynteractive.com/content/visual/mistake-webhook-url-in-the-page · Updated 2026-10-01 · Free from Stepthrough (https://learn.ynteractive.com) [Mistake to avoid](https://learn.ynteractive.com/content/visual#format-mistake) · One graphic · [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 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. ## The mistake Pasting the **webhook URL** into the page Anyone who has it can send data to your workflow. ## Do this instead Store it as a **Lovable secret** named `N8N_WEBHOOK_URL`, so it stays out of the source and is easy to change. **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) · [Secrets and environment variables](https://learn.ynteractive.com/content/glossary/environment-variables) · [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) [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: 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 Webhook? A Visual Guide](https://learn.ynteractive.com/content/visual/term-webhook-explained): 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. - [Mistake to Avoid: A Soft Yes When You Mean No](https://learn.ynteractive.com/content/visual/mistake-a-soft-yes-in-a-no): A visual tip for customer emails: AI drafts blur a no into "we'll do our best." Say no early, give one reason and a real alternative. [All visual guides](https://learn.ynteractive.com/content/visual) · [All free tutorials](https://learn.ynteractive.com/content)