Create a Searchable YouTube Educator Directory with Smart Keyword Matching
š 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
Related Templates
USDT And TRC20 Wallet Tracker API Workflow for n8n
Overview This n8n workflow is specifically designed to monitor USDT TRC20 transactions within a specified wallet. It u...
Automate Daily Keyword Research with Google Sheets, Suggest API & Custom Search
Who's it for This workflow is perfect for SEO specialists, marketers, bloggers, and content creators who want to automa...
Bulk Automated Google Drive Files Sharing and Direct Download Link Generation
This N8N workflow automates the process of sharing files from Google Drive. It includes OAuth2 authentication, batch pro...
š Please log in to import templates to n8n and favorite templates
Workflow Visualization
Loading...
Preparing workflow renderer
Comments (0)
Login to post comments