Create a searchable YouTube educator directory with smart keyword matching
DISCOUNT 20%
🎓 n8n Learning Hub — AI-Powered YouTube Educator Directory
📋 Overview
This workflow demonstrates how to use n8n Data Tables to create a searchable database of educational YouTube content. Users can search for videos by topic (e.g., "voice", "scraping", "lead gen") and receive formatted recommendations from top n8n educators.
What This Workflow Does:
- Receives search queries via webhook (e.g., topic: "voice agents")
- Processes keywords using JavaScript to normalize search terms
- Queries a Data Table to find matching educational videos
- Returns formatted results with video titles, educators, difficulty levels, and links
- Populates the database with a one-time setup workflow
🎯 Key Features
✅ Data Tables Introduction - Learn how to store and query structured data
✅ Webhook Integration - Accept external requests and return JSON responses
✅ Keyword Processing - Simple text normalization and keyword matching
✅ Batch Operations - Use Split in Batches to populate tables efficiently
✅ Frontend Ready - Easy to connect with Lovable, Replit, or custom UIs
🛠️ Setup Guide
Step 1: Import the Workflow
- Copy the workflow JSON
- In n8n, go to Workflows → Import from File or Import from URL
- Paste the JSON and click Import
Step 2: Create the Data Table
The workflow uses a Data Table called n8n_Educator_Videos with these columns:
- Educator (text) - Creator name
- video_title (text) - Video title
- Difficulty (text) - Beginner/Intermediate/Advanced
- YouTubeLink (text) - Full YouTube URL
- Description (text) - Video summary for search matching
To create it:
- Go to Data Tables in your n8n instance
- Click + Create Data Table
- Name it
n8n_Educator_Videos - Add the 5 columns listed above
Step 3: Populate the Database
- Click on the "When clicking 'Execute workflow'" node (bottom branch)
- Click Execute Node to run the setup
- This will insert all 9 educational videos into your Data Table
Step 4: Activate the Webhook
- Click on the Webhook node (top branch)
- Copy the Production URL (looks like:
https://your-n8n.app.n8n.cloud/webhook/1799531d-...) - Click Activate on the workflow
- Test it with a POST request:
curl -X POST https://your-n8n.app.n8n.cloud/webhook/YOUR-WEBHOOK-ID \
-H "Content-Type: application/json" \
-d '{"topic": "voice"}'
🔍 How the Search Works
Keyword Processing Logic
The JavaScript node normalizes search queries:
- "voice", "audio", "talk" → Matches voice agent tutorials
- "lead", "lead gen" → Matches lead generation content
- "scrape", "data", "scraping" → Matches web scraping tutorials
The Data Table query uses LIKE matching on the Description field, so partial matches work great.
Example Queries:
{"topic": "voice"} // Returns Eleven Labs Voice Agent
{"topic": "scraping"} // Returns 2 scraping tutorials
{"topic": "avatar"} // Returns social media AI avatar videos
{"topic": "advanced"} // Returns all advanced-level content
🎨 Building a Frontend with Lovable or Replit
Option 1: Lovable (lovable.dev)
Lovable is an AI-powered frontend builder perfect for quick prototypes.
Prompt for Lovable:
Create a modern search interface for an n8n YouTube learning hub:
- Title: "🎓 n8n Learning Hub"
- Search bar with placeholder "Search for topics: voice, scraping, RAG..."
- Submit button that POSTs to webhook: [YOUR_WEBHOOK_URL]
- Display results as cards showing:
* 🎥 Video Title (bold)
* 👤 Educator name
* 🧩 Difficulty badge (color-coded)
* 🔗 YouTube link button
* 📝 Description
Design: Dark mode, modern glassmorphism style, responsive grid layout
Implementation Steps:
- Go to lovable.dev and start a new project
- Paste the prompt above
- Replace
[YOUR_WEBHOOK_URL]with your actual webhook - Export the code or deploy directly
Option 2: Replit (replit.com)
Use Replit's HTML/CSS/JS template for more control.
HTML Structure:
<!DOCTYPE html>
<html>
<head>
<title>n8n Learning Hub</title>
<style>
body { font-family: Arial; max-width: 900px; margin: 50px auto; }
#search { padding: 10px; width: 70%; font-size: 16px; }
button { padding: 10px 20px; font-size: 16px; }
.video-card { border: 1px solid #ddd; padding: 20px; margin: 20px 0; }
</style>
</head>
<body>
<h1>🎓 n8n Learning Hub</h1>
<input id="search" placeholder="Search: voice, scraping, RAG..." />
<button onclick="searchVideos()">Search</button>
<div></div>
<script>
async function searchVideos() {
const topic = document.getElementById('search').value;
const response = await fetch('YOUR_WEBHOOK_URL', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({topic})
});
const data = await response.json();
document.getElementById('results').innerHTML = data.Message || 'No results';
}
</script>
</body>
</html>
Option 3: Base44 (No-Code Tool)
If using Base44 or similar no-code tools:
- Create a Form with a text input (name:
topic) - Add a Submit Action → HTTP Request
- Set Method: POST, URL: Your webhook
- Map form data:
{"topic": "{{topic}}"} - Display response in a Text Block using
{{response.Message}}
📊 Understanding Data Tables
Why Data Tables?
- Persistent Storage - Data survives workflow restarts
- Queryable - Use conditions (equals, like, greater than) to filter
- Scalable - Handle thousands of records efficiently
- No External DB - Everything stays within n8n
Common Operations:
- Insert Row - Add new records (used in the setup branch)
- Get Row(s) - Query with filters (used in the search branch)
- Update Row - Modify existing records by ID
- Delete Row - Remove records
Best Practices:
- Use descriptive column names
- Include a searchable text field (like Description)
- Keep data normalized (avoid duplicate entries)
- Use the "Split in Batches" node for bulk operations
🚀 Extending This Workflow
Ideas to Try:
- Add More Educators - Expand the video database
- Category Filtering - Add a
Categorycolumn (Automation, AI, Scraping) - Difficulty Sorting - Let users filter by skill level
- Vote System - Add upvote/downvote columns
- Analytics - Track which topics are searched most
- Admin Panel - Build a form to add new videos via webhook
Advanced Features:
- AI-Powered Search - Use OpenAI embeddings for semantic search
- Thumbnail Scraping - Fetch YouTube thumbnails via API
- Auto-Updates - Periodically check for new videos from educators
- Personalization - Track user preferences in a separate table
🐛 Troubleshooting
Problem: Webhook returns empty results
Solution: Check that the Description field contains searchable keywords
Problem: Database is empty
Solution: Run the "When clicking 'Execute workflow'" branch to populate data
Problem: Frontend not connecting
Solution: Verify webhook is activated and URL is correct (use Test mode first)
Problem: Search too broad/narrow
Solution: Adjust the keyword logic in "Load Video DB" node
📚 Learning Resources
Want to learn more about the concepts in this workflow?
- Data Tables: n8n Data Tables Documentation
- Webhooks: Webhook Node Guide
- JavaScript in n8n: "Every N8N JavaScript Function Explained" (see database)
🎓 What You Learned
By completing this workflow, you now understand:
✅ How to create and populate Data Tables
✅ How to query tables with conditional filters
✅ How to build webhook-based APIs in n8n
✅ How to process and normalize user input
✅ How to format data for frontend consumption
✅ How to connect n8n with external UIs
Happy Learning! 🚀
Built with ❤️ using n8n Data Tables