DEV Community

zo Aoo
zo Aoo

Posted on

I scraped 6,000+ n8n workflows and built a search engine with interactive previews

Hello Devs! πŸ‘‹

I've been using n8n heavily for my automation tasks recently. It's a fantastic tool, but I kept running into a specific friction point with the official template library and various community sources.

The Problem:
Every time I searched for a workflow (e.g., "Post to Twitter from RSS"), I found lists of templates, but I couldn't really see the logic without downloading the JSON file and importing it into my local n8n instance. It was a cycle of: Download -> Import -> Check nodes -> "Nope, not what I need" -> Delete.

The Solution:
I decided to solve this by scraping/aggregating over 6,000+ workflows and building a dedicated search engine that renders the node graph directly in the browser.

πŸš€ Live Site: https://n8nworkflows.world/

✨ Key Features

  1. Interactive Preview (The Killer Feature):
    I implemented a visualizer (using React Flow) that parses the n8n JSON schema and renders the workflow graph. You can pan, zoom, and inspect the connections before you download anything. No more blind imports.

  2. Better Search:
    Indexed 6,000+ templates. You can search by node type (e.g., "Webhook", "Postgres") or use case.

  3. JSON Export:
    One-click copy the raw JSON to your clipboard.

πŸ› οΈ How I built it (The Stack)

For those interested in the engineering side, here is the stack I used:

  • Frontend: Next.js (App Router) - for SEO and speed.
  • Visualization: React Flow - specifically customized to mimic n8n's UI style.
  • Backend/DB: Supabase - creating a searchable index of the workflows.
  • Data Collection: Custom Python scripts (Playwright) to aggregate data from public sources.

πŸ“¦ Open Source Data

I believe in giving back to the community. While the website provides the UI, I've started organizing the raw workflow data into a curated list on GitHub.

If you just want the raw data or want to contribute to the categorization, check out the repo:

πŸ‘‰ GitHub: https://github.com/pxw3504k-web/awesome-n8n-workflows

What's Next?

This is currently a V1. I'm planning to improve the search algorithm and maybe add a feature to generate workflows using AI based on the existing dataset.

I'd love to hear your feedback! Does the visual preview load fast enough for you? Is there any specific filter you are missing?

Happy automating! πŸ€–

Top comments (0)