Create a Searchable YouTube Educator Directory with Smart Keyword Matching

Go to Workflow
0 views
Built by David Olusola David Olusola
Created on June 05, 2026

Description

🎓 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>
🎓 n8n Learning Hub
<input id="search" placeholder="Search: voice, scraping, RAG..." />
<button onclick="searchVideos()">Search</button>


<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 Category column (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

Nodes Used (1)

Code
n8n-nodes-base.code