Repolode
投稿する
vercel-labs

vercel-labs/workflow-builder-template

ドラッグ＆ドロップのノードとTypeScriptコード生成で、視覚的なAIワークフロー自動化を構築できるセルフホスト可能なNext.jsテンプレート。

代替できる製品:Zapier

GitHub で見る公式サイト
スター
1,238
フォーク
239
未解決の Issue
36
最終コミット
4 日前

これは何？

AIを活用したワークフロー自動化プラットフォームを構築するためのテンプレートです。React Flowを使ったキャンバス上でノードをドラッグ＆ドロップしてワークフローを作成し、webhook、スケジュール、手動実行、データベースイベントなどのトリガーノードを、Resend、Slack、Linear、GitHub、Stripe、Firecrawlなどのサービス向けアクションノードに接続できます。

ワークフローは組み込みUIから実行でき、実行履歴とノードごとのログを記録します。また、"use workflow"ディレクティブを使って実行可能なTypeScriptとしてエクスポートできるほか、OpenAIを通じて自然言語のプロンプトからワークフローのドラフトを生成できます。実行エンジンにはWorkflow DevKitを採用しています。

技術スタックにはNext.js 16、React 19、shadcn/ui、PostgreSQLを使うDrizzle ORM、認証用のBetter Authが含まれます。ワンクリックでVercelにデプロイでき、その際にNeon Postgresデータベースが自動でプロビジョニングされます。

主な機能

  • 01React Flowを基盤とするドラッグ＆ドロップ式のビジュアルワークフローエディター
  • 02Resend、Slack、Linear、GitHub、Stripeなどに対応した組み込みアクションノード
  • 03"use workflow"ディレクティブを使い、ワークフローを実行可能なTypeScriptとしてエクスポート
  • 04OpenAIを使い、自然言語のプロンプトからワークフローを生成
  • 05実行履歴とノードごとの詳細なログ

ユースケース

  • イベントをきっかけにメールを送信したりチケットを作成したりする社内自動化のプロトタイピング
  • 製品開発の出発点として、セルフホスト型のワークフロービルダーを構築
  • ビジュアルで設計したワークフローをTypeScriptコードに変換し、さらにカスタマイズ

クイックスタート

  1. 1

    データベースと認証の設定を記載した .env.local ファイルを作成します

  2. 2

    依存関係をインストールします

    pnpm install
  3. 3

    データベースのマイグレーションを実行します

    pnpm db:push
  4. 4

    開発サーバーを起動します

    pnpm dev

使う前に知っておきたいこと

  • PostgreSQLデータベースはご自身で用意する必要があります。
  • AIワークフローの生成には、AI GatewayまたはOpenAI APIキーが必要です。
  • 多くのインテグレーションでは、別途サードパーティのアカウントとAPIキーが必要です。

収録されている特集

オープンソースの AI エージェント・フレームワークとアプリ

トピック

#workflow-automation#ai#nextjs#typescript#visual-builder#agents#workflows

よくある質問

workflow-builder-template とは？
ドラッグ＆ドロップのノードとTypeScriptコード生成で、視覚的なAIワークフロー自動化を構築できるセルフホスト可能なNext.jsテンプレート。 AIを活用したワークフロー自動化プラットフォームを構築するためのテンプレートです。React Flowを使ったキャンバス上でノードをドラッグ＆ドロップしてワークフローを作成し、webhook、スケジュール、手動実行、データベースイベントなどのトリガーノードを、Resend、Slack、Linear、GitHub、Stripe、Firecrawlなどのサービス向けアクションノードに接続できます。
workflow-builder-template は無料で使えますか？ライセンスは？
workflow-builder-template は Other ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。
workflow-builder-template は今もメンテナンスされていますか？
活発にメンテナンス中。workflow-builder-template の最終コミットは 2026年11月3日 です。
workflow-builder-template は何に使えますか？
イベントをきっかけにメールを送信したりチケットを作成したりする社内自動化のプロトタイピング 製品開発の出発点として、セルフホスト型のワークフロービルダーを構築 ビジュアルで設計したワークフローをTypeScriptコードに変換し、さらにカスタマイズ
workflow-builder-template のインストール方法は？
データベースと認証の設定を記載した .env.local ファイルを作成します 依存関係をインストールします: pnpm install データベースのマイグレーションを実行します: pnpm db:push 開発サーバーを起動します: pnpm dev
workflow-builder-template はどこで入手できますか？
ソースコードとインストール手順は GitHub にあります：https://github.com/vercel-labs/workflow-builder-template

概要はプロジェクトの README をもとに AI が生成しています。GitHub の数値は毎日更新されます。

関連プロジェクト