tooljet
ToolJetは、オープンソースのローコードプラットフォームで、管理画面の作成、データソース接続、ドラッグ&ドロップでのCRUDアプリ構築、ToolJetの自己ホストなど、内製ツール開発を効率化するSkill。
📜 元の英語説明(参考)
Build internal tools with ToolJet, the open-source low-code platform. Use when a user asks to create admin dashboards, connect data sources, build CRUD apps with drag-and-drop, or self-host ToolJet.
🇯🇵 日本人クリエイター向け解説
ToolJetは、オープンソースのローコードプラットフォームで、管理画面の作成、データソース接続、ドラッグ&ドロップでのCRUDアプリ構築、ToolJetの自己ホストなど、内製ツール開発を効率化するSkill。
※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。
下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o tooljet.zip https://jpskill.com/download/15488.zip && unzip -o tooljet.zip && rm tooljet.zip
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/15488.zip -OutFile "$d\tooljet.zip"; Expand-Archive "$d\tooljet.zip" -DestinationPath $d -Force; ri "$d\tooljet.zip"
完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。
💾 手動でダウンロードしたい(コマンドが難しい人向け)
- 1. 下の青いボタンを押して
tooljet.zipをダウンロード - 2. ZIPファイルをダブルクリックで解凍 →
tooljetフォルダができる - 3. そのフォルダを
C:\Users\あなたの名前\.claude\skills\(Win)または~/.claude/skills/(Mac)へ移動 - 4. Claude Code を再起動
⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。
🎯 このSkillでできること
下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。
📦 インストール方法 (3ステップ)
- 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
- 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
- 3. 展開してできたフォルダを、ホームフォルダの
.claude/skills/に置く- · macOS / Linux:
~/.claude/skills/ - · Windows:
%USERPROFILE%\.claude\skills\
- · macOS / Linux:
Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。
詳しい使い方ガイドを見る →- 最終更新
- 2026-05-18
- 取得日時
- 2026-05-18
- 同梱ファイル
- 1
📖 Skill本文(日本語訳)
※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。
ToolJet — オープンソースのローコードアプリビルダー
概要
あなたは ToolJet のエキスパートです。ToolJet は、ビジュアルアプリビルダーを使用して内部ツールを構築するためのオープンソースのローコードプラットフォームです。開発者がデータベースや API に接続し、ドラッグアンドドロップコンポーネントで CRUD アプリを構築し、カスタム JavaScript/Python を記述し、完全なデータ制御のためにセルフホストするのを支援します。
手順
セットアップ
# Docker (推奨)
docker compose up -d
# UI at http://localhost:80
# Kubernetes
helm repo add tooljet https://tooljet.github.io/helm-charts
helm install tooljet tooljet/tooljet
# Cloud: https://tooljet.com (マネージドホスティング)
データソース
// ToolJet は 50 以上のデータソースに接続できます:
// データベース: PostgreSQL, MySQL, MongoDB, Redis, BigQuery, Snowflake, DynamoDB
// API: REST, GraphQL, gRPC
// SaaS: Stripe, Airtable, Google Sheets, Notion, Slack, Twilio
// ストレージ: S3, MinIO, GCS
// 変換を伴う PostgreSQL クエリ
// クエリ: getOrders
SELECT o.*, u.email, u.name
FROM orders o JOIN users u ON o.user_id = u.id
WHERE o.status = {{components.statusFilter.value}}
ORDER BY o.created_at DESC
// JavaScript 変換 (クエリ実行後に実行)
return data.map(row => ({
...row,
amount_display: `$${(row.amount / 100).toFixed(2)}`,
created_display: moment(row.created_at).fromNow(),
}));
イベントとアクション
// Button の onClick イベント — 複数のアクションをチェーン
// アクション 1: クエリを実行
await queries.processRefund.run();
// アクション 2: 通知を表示
actions.showAlert('success', `Refund of $${components.table1.selectedRow.amount} processed`);
// アクション 3: データをリフレッシュ
await queries.getOrders.run();
// アクション 4: ナビゲート
actions.navigateTo('/orders');
// イベントハンドラーの条件ロジック
if (components.table1.selectedRow.status === 'refunded') {
actions.showAlert('warning', 'Already refunded');
return;
}
複数ページアプリ
## アプリの構造
- ページ: Dashboard, Orders, Users, Settings
- 共有コンポーネント: Header, Sidebar (ページをまたいで永続化)
- URL パラメータ: 詳細ページ用の /orders/:id
- ナビゲーション: プログラムによる (actions.navigateTo) またはリンクコンポーネント
例
例 1: ユーザーが tooljet のセットアップを依頼
ユーザー: "私のプロジェクトのために tooljet をセットアップするのを手伝ってください"
エージェントは以下を行う必要があります:
- システム要件と前提条件を確認する
- tooljet をインストールまたは構成する
- 初期プロジェクト構造をセットアップする
- セットアップが正しく動作することを確認する
例 2: ユーザーが tooljet で機能を構築することを依頼
ユーザー: "tooljet を使用してダッシュボードを作成してください"
エージェントは以下を行う必要があります:
- コンポーネントまたは構成をスキャフォールドする
- 適切なデータソースに接続する
- 要求された機能を実装する
- 出力をテストおよび検証する
ガイドライン
- コンプライアンスのためにセルフホスト — ToolJet はオープンソース (AGPL) です。データがインフラストラクチャ上に保持される必要がある場合は、セルフホストしてください。
- クエリキャッシュ — 頻繁にアクセスされるデータに対してクエリキャッシュを有効にします。データベースの負荷を軽減します。
- 環境 — 異なるデータベース接続で ToolJet 環境 (dev/staging/prod) を使用します。
- カスタムコンポーネント — コンポーネントライブラリに存在しない視覚化のために React コンポーネントを構築します。
- バージョン管理 — アプリを JSON としてエクスポートします。バージョン管理とバックアップのために Git に保存します。
- きめ細かい権限 — グループとアプリレベルの権限を使用してアクセスを制御します。
- マーケットプレイスプラグイン — 構築済みのデータソースコネクタについて、ToolJet のプラグインマーケットプレイスを参照してください。
- 監査ログ — コンプライアンスのために監査ログを有効にします。誰がどのデータにアクセスしたかを追跡します。
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開
ToolJet — Open-Source Low-Code App Builder
Overview
You are an expert in ToolJet, the open-source low-code platform for building internal tools with a visual app builder. You help developers connect to databases and APIs, build CRUD apps with drag-and-drop components, write custom JavaScript/Python, and self-host for complete data control.
Instructions
Setup
# Docker (recommended)
docker compose up -d
# UI at http://localhost:80
# Kubernetes
helm repo add tooljet https://tooljet.github.io/helm-charts
helm install tooljet tooljet/tooljet
# Cloud: https://tooljet.com (managed hosting)
Data Sources
// ToolJet connects to 50+ data sources:
// Databases: PostgreSQL, MySQL, MongoDB, Redis, BigQuery, Snowflake, DynamoDB
// APIs: REST, GraphQL, gRPC
// SaaS: Stripe, Airtable, Google Sheets, Notion, Slack, Twilio
// Storage: S3, MinIO, GCS
// PostgreSQL query with transformations
// Query: getOrders
SELECT o.*, u.email, u.name
FROM orders o JOIN users u ON o.user_id = u.id
WHERE o.status = {{components.statusFilter.value}}
ORDER BY o.created_at DESC
// JavaScript transformation (runs after query)
return data.map(row => ({
...row,
amount_display: `$${(row.amount / 100).toFixed(2)}`,
created_display: moment(row.created_at).fromNow(),
}));
Events and Actions
// Button onClick event — chain multiple actions
// Action 1: Run query
await queries.processRefund.run();
// Action 2: Show notification
actions.showAlert('success', `Refund of $${components.table1.selectedRow.amount} processed`);
// Action 3: Refresh data
await queries.getOrders.run();
// Action 4: Navigate
actions.navigateTo('/orders');
// Conditional logic in event handlers
if (components.table1.selectedRow.status === 'refunded') {
actions.showAlert('warning', 'Already refunded');
return;
}
Multi-Page Apps
## App Structure
- Pages: Dashboard, Orders, Users, Settings
- Shared components: Header, Sidebar (persist across pages)
- URL parameters: /orders/:id for detail pages
- Navigation: programmatic (actions.navigateTo) or link components
Examples
Example 1: User asks to set up tooljet
User: "Help me set up tooljet for my project"
The agent should:
- Check system requirements and prerequisites
- Install or configure tooljet
- Set up initial project structure
- Verify the setup works correctly
Example 2: User asks to build a feature with tooljet
User: "Create a dashboard using tooljet"
The agent should:
- Scaffold the component or configuration
- Connect to the appropriate data source
- Implement the requested feature
- Test and validate the output
Guidelines
- Self-host for compliance — ToolJet is open-source (AGPL); self-host when data must stay on your infrastructure
- Query caching — Enable query caching for frequently accessed data; reduces database load
- Environments — Use ToolJet environments (dev/staging/prod) with different database connections
- Custom components — Build React components for visualizations that don't exist in the component library
- Version control — Export apps as JSON; store in Git for versioning and backup
- Granular permissions — Use groups and app-level permissions to control access
- Marketplace plugins — Browse ToolJet's plugin marketplace for pre-built data source connectors
- Audit logs — Enable audit logging for compliance; track who accessed what data