나는 n8n 워크플로우를 위한 더 나은 검색 엔진을 만들었습니다 (튜토리얼 및 검증된 템플릿 포함)
발행: (2025년 12월 26일 오후 04:47 GMT+9)
5 min read
원문: Dev.to
Source: Dev.to
문제점
- 검색 경험 – 포럼형 커뮤니티에서 특정 n8n 사용 사례(예: “Notion to DeepSeek with error handling”)를 찾기가 어렵습니다.
- ‘블랙 박스’ JSON – 템플릿을 다운로드하고 가져온 뒤, 복잡한 설정이 필요하거나 전혀 작동하지 않는 경우가 있습니다.
해결책: n8nworkflows.world
무료이며 검증된 n8n 워크플로 템플릿을 큐레이션한 라이브러리로, 다음을 포함합니다:
- 각 다운로드 버튼 옆에 “사용 방법” 튜토리얼을 제공.
- 가져오기 전에 워크플로 로직을 즉시 미리 보기.
목표는 n8n UI를 대체하는 것이 아니라, 검색 마찰을 없애고 각 워크플로에 대한 X‑ray 가시성을 제공하는 것입니다.
기술 스택
| 레이어 | 기술 | 이유 |
|---|---|---|
| 프론트엔드 | Next.js 14 (App Router) | 빠른 SSR, SEO 친화적이라 템플릿이 Google에 잘 노출됩니다 |
| 데이터베이스 | Supabase (PostgreSQL) | JSON과 풍부한 메타데이터(튜토리얼, 단계별 가이드)를 6,000+ 워크플로에 저장 |
| 시각화 | React Flow | 노드 그래프를 빠르게 미리 보기 |
| 데이터 파이프라인 | Python + Playwright | 공개 템플릿을 수집·정제·검증합니다 |
구현 하이라이트
파싱 및 시각화
- React Flow를 사용해 n8n JSON 구조를 파싱했습니다.
- n8n의 좌표 시스템
[x, y]를 React Flow의{x, y}형식으로 변환하고, 연결 로직을 재구성해 엣지가 올바르게 렌더링되도록 파서를 작성했습니다.
데이터 강화
- n8n JSON에서
notes와description필드를 추출해 다운로드 버튼 옆에 구조화된 “사용 방법” 가이드로 표시했습니다. - 사용자는 다운로드 전에 필요한 자격 증명(예: “Notion API 키 필요”)을 확인할 수 있습니다.
검색 성능
- Supabase에서
json_content와metadata컬럼에 인덱스를 생성해 세밀한 검색을 지원합니다. - 검색은 제목뿐 아니라 특정 노드까지 매치할 수 있습니다.
- 예시 쿼리:
"OpenAI + Pinecone"은 두 노드가 모두 포함된 워크플로만 반환해 관련 없는 결과를 걸러냅니다.
- 예시 쿼리:
템플릿 검색 엔진의 특징
- 향상된 검색 – 노드 타입, 카테고리, 사용 사례별 필터링 가능.
- 검증된 로직 – 실용적이고 정상 동작하는 템플릿을 큐레이션.
- 튜토리얼 포함 – 워크플로 메타데이터에서 추출한 명확한 가이드 제공.
- 무료·빠름 – 결제 벽 없이 원클릭 복사/다운로드.
오픈 소스 데이터
UI 코드는 아직 비공개이지만, 큐레이션된 워크플로 데이터 목록은 오픈소스로 제공됩니다:
개발자는 이 데이터셋을 자신의 프로젝트에 활용할 수 있습니다.
직접 사용해 보기
- 실제 사이트: https://n8nworkflows.world/
검색 결과가 원하는 것을 찾는지, 추출된 튜토리얼이 도움이 되는지 알려 주세요.