RORK LABEN
TOOLING — Rorkの開発者向けリポジトリが動き続けています。rork-xcodeが7月16日、rork-deviceが7月15日、rork-plistが7月13日に更新されましたOPUS46 — RorkでClaude Opus 4.6が稼働しています。Rork MaxはClaude Codeを土台にアプリを組み立てる設計ですSIM — ブラウザ上で動くクラウドのiOSシミュレータを備え、実機へのインストールは1クリック、App Storeへの提出は2クリックと案内されていますMAX — Rork MaxはReact Nativeではなく純粋なSwiftを出力します。iPhone・iPad・Apple Watch・Apple TV・Vision Pro、そしてiMessageまでが射程ですNATIVE — HealthKit、ARKitとLiDAR、NFC、Dynamic Island、Live Activities、Metalによる3D、Core MLのオンデバイス推論まで扱えますSEED — RorkはLeft Lane Capitalが主導する1,500万ドルのシードラウンドを実施し、Peak XVとa16z Speedrunが参加しましたTOOLING — Rorkの開発者向けリポジトリが動き続けています。rork-xcodeが7月16日、rork-deviceが7月15日、rork-plistが7月13日に更新されましたOPUS46 — RorkでClaude Opus 4.6が稼働しています。Rork MaxはClaude Codeを土台にアプリを組み立てる設計ですSIM — ブラウザ上で動くクラウドのiOSシミュレータを備え、実機へのインストールは1クリック、App Storeへの提出は2クリックと案内されていますMAX — Rork MaxはReact Nativeではなく純粋なSwiftを出力します。iPhone・iPad・Apple Watch・Apple TV・Vision Pro、そしてiMessageまでが射程ですNATIVE — HealthKit、ARKitとLiDAR、NFC、Dynamic Island、Live Activities、Metalによる3D、Core MLのオンデバイス推論まで扱えますSEED — RorkはLeft Lane Capitalが主導する1,500万ドルのシードラウンドを実施し、Peak XVとa16z Speedrunが参加しました
記事一覧/開発ツール
開発ツール/2026-03-31中級

Rork × Make(旧Integromat)連携ガイド:Webhookでノーコードバックエンドを構築する方法

Rorkアプリに Make(旧Integromat)を連携させる方法を解説。Webhookを使ったノーコードバックエンドの構築から、フォーム送信→Notion保存→メール通知まで実践的なシナリオを紹介します。

MakeWebhook2ノーコード42自動化12バックエンド10Rork515外部連携

取り組みの背景:Rorkアプリにバックエンドが必要になったとき

Rorkでアプリを作っていると、こんな場面に直面することがあります。

「ユーザーが送信したフォームデータを Notion に自動保存したい」「新規登録があったら Slack に通知を飛ばしたい」「毎朝9時にプッシュ通知を自動配信したい」

こうした処理を実現するには、通常はサーバーサイドのプログラミングが必要です。しかし、Make(旧Integromat) を活用すれば、コードを一行も書かずにこれらのバックエンド処理を構築できます。

Make は「Zapier に似たノーコード自動化ツール」ですが、より柔軟なデータ変換や分岐処理が得意で、無料プランでも月1,000オペレーションまで利用できます。Rorkで作ったモバイルアプリのフロントエンドと Make のシナリオを Webhook で繋ぐことで、エンジニアなしでも本格的なバックエンド処理を実現できるのが最大の魅力です。


Make とは?基本概念を理解する

Make(旧名:Integromat) は、2,000以上のアプリやサービスを視覚的に繋げられるノーコード自動化プラットフォームです。2022年に Integromat から Make にリブランドされ、現在は世界中の個人開発者から大企業まで幅広く利用されています。

Make の主要な概念は以下の3つです。

  • シナリオ(Scenario): 自動化の「レシピ」。どのトリガーでどの処理を実行するかを定義する
  • モジュール(Module): シナリオを構成する各ステップ。「Gmail でメールを送る」「Notion にデータを追加する」などのアクションをブロックとして表現する
  • Webhook: 外部のアプリ(Rorkのモバイルアプリなど)から Make のシナリオを起動するためのHTTPエンドポイント

Zapier との主な違いは、Make の方が複雑なデータ変換やループ処理、エラーハンドリングが得意な点です。月の無料枠もMakeの方が多く(Make: 1,000オペレーション、Zapier: 100タスク)、個人開発との相性が特に良いと言えます。


Rork × Make 連携の全体像

Rorkアプリと Make を連携させる基本的な流れは次のとおりです。

  1. Make でシナリオを作成し、Webhook URLを発行する
  2. Rork アプリ内から Webhook URL に HTTP リクエストを送信する
  3. Make のシナリオがリクエストを受け取り、後続の処理を自動実行する

Rorkは React Native ベースのため、fetch API を使って任意のHTTPエンドポイントにリクエストを送ることができます。Make の Webhook はリクエストを受け取ると即座にシナリオを起動するため、リアルタイムな連携が可能です。


Step 1:Make でシナリオを作成し Webhook URL を取得する

まず Make のアカウントを作成します(make.com)。無料プランで始められます。

ログイン後、以下の手順で Webhook を設定します。

  1. 左サイドバーの「Scenarios」→「Create a new scenario」をクリック
  2. 最初のモジュール追加画面で「Webhooks」を検索し、「Custom webhook」を選択
  3. 「Add」→「Save」でWebhookを作成すると、以下のような URL が発行されます
https://hook.eu2.make.com/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

この URL が Rork アプリから呼び出すエンドポイントになります。

Tips: Make のリージョンは「EU(ヨーロッパ)」か「US(アメリカ)」が選べます。日本からの遅延を最小化したい場合は US リージョンの方がやや有利です。


Step 2:Rork アプリから Webhook を呼び出す

Rork でアプリを開き、Webhook を呼び出す処理を実装します。フォーム送信ボタンのタップ時に以下のようなコードを実行します。

// Rork アプリ内での Webhook 呼び出し例
// フォームデータを Make に送信する
 
const MAKE_WEBHOOK_URL = 'https://hook.eu2.make.com/xxxxxxxxxxxxxxxxxxxxxxxx';
 
const sendToMake = async (formData: {
  name: string;
  email: string;
  message: string;
}) => {
  try {
    const response = await fetch(MAKE_WEBHOOK_URL, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        name: formData.name,
        email: formData.email,
        message: formData.message,
        timestamp: new Date().toISOString(),
        source: 'rork-app', // 送信元を識別するカスタムフィールド
      }),
    });
 
    if (response.ok) {
      console.log('✅ Make へのデータ送信成功');
      return { success: true };
    } else {
      throw new Error(`HTTP error: ${response.status}`);
    }
  } catch (error) {
    console.error('❌ Make への送信失敗:', error);
    return { success: false, error };
  }
};
 
// 使用例
// ボタンの onPress で呼び出す
const handleSubmit = async () => {
  const result = await sendToMake({
    name: '山田太郎',
    email: 'taro@example.com',
    message: 'お問い合わせ内容',
  });
 
  if (result.success) {
    Alert.alert('送信完了', 'お問い合わせを受け付けました。');
  } else {
    Alert.alert('エラー', '送信に失敗しました。時間をおいて再試行してください。');
  }
};

Make 側でこのリクエストを一度受け取ると、データ構造が自動的に認識されます。以降のシナリオ設定では、送信したフィールド(name, email, message など)をドラッグ&ドロップで使用できます。


Step 3:実践シナリオ — フォーム送信 → Notion保存 → メール通知

Rork アプリのお問い合わせフォームから Make を経由して、以下の自動化を実現してみましょう。

シナリオの流れ:

  1. Rorkアプリ → Make Webhook(データ受信)
  2. Notion データベースに新規レコード追加
  3. Gmail で管理者に通知メール送信

Notion モジュールの設定

Make のシナリオに「Notion」モジュールを追加します。

  1. Webhook モジュールの右の「+」ボタン → 「Notion」を検索
  2. 「Create a Database Item」を選択
  3. Notion の接続認証を行い、保存先のデータベースを選択
  4. 各フィールドに Webhook から受け取ったデータをマッピング:
    • 名前フィールド → {{1.name}}(Webhook の name フィールド)
    • メールフィールド → {{1.email}}
    • メッセージフィールド → {{1.message}}
    • 日時フィールド → {{formatDate(1.timestamp; "YYYY-MM-DD HH:mm")}}

Gmail 通知モジュールの設定

Notion モジュールの後に「Gmail」モジュールを追加します。

  1. 「+」ボタン → 「Gmail」→「Send an Email」
  2. 宛先、件名、本文を設定:
件名: 【お問い合わせ】{{1.name}}様より
本文:
新しいお問い合わせが届きました。

名前: {{1.name}}
メール: {{1.email}}
メッセージ:
{{1.message}}

送信日時: {{formatDate(1.timestamp; "YYYY年MM月DD日 HH:mm")}}

これだけの設定で、Rork アプリからフォームを送信するたびに、Notion への自動保存とメール通知が走るようになります。


よくある連携パターン集

Make を使うことで、Rork アプリにさまざまなバックエンド処理を追加できます。代表的なパターンをご紹介します。

パターン1:新規ユーザー登録 → CRM 自動登録

Rork Webhook → Make → HubSpot / Airtable にリード追加 → ウェルカムメール送信

ユーザー獲得数が増えてきたときに特に有効です。手動でのデータ転記が不要になります。

パターン2:アプリ内購入完了 → レポート集計

Rork Webhook(購入完了イベント)→ Make → Google スプレッドシートに売上記録 → 月次集計

Stripe などの決済プロバイダーと組み合わせることで、売上ダッシュボードを自動更新できます。

パターン3:定期的なプッシュ通知スケジューリング

Make のスケジュールトリガー(毎朝9時)→ Rork の Expo Push Notification API を呼び出し

Make の「HTTP」モジュールを使って Expo Push API に直接リクエストを送ることで、Rorkアプリへの定期プッシュ通知を Make だけで実現できます。

パターン4:エラーアラート → Slack 通知

Rork Webhook(エラーイベント)→ Make → Slack チャンネルにアラート投稿

Rork アプリで予期しないエラーが発生したとき、catch ブロック内から Webhook を呼び出して Slack に即座に通知することができます。


よくあるエラーと対処法

エラー1:Webhook URL に 404 が返ってくる

Make のシナリオが**「OFF」状態**になっている可能性があります。シナリオ詳細画面の右下にある「Scheduling」スイッチを確認し、「ON」にしてください。または、シナリオを手動で「Run once」モードにすることでもテストできます。

エラー2:データが Make に届かない

Rork 側のリクエストヘッダーに Content-Type: application/json が含まれているか確認してください。このヘッダーがないと Make がデータを正しく解析できない場合があります。また、Make の Webhook URL が最新のものか(コピーミスがないか)も確認しましょう。

エラー3:Make の無料プランでオペレーションが上限に達した

Make の無料プランは月1,000オペレーションまでです。1回のシナリオ実行が複数モジュールで構成される場合、消費オペレーション数はモジュール数分カウントされます(例:3モジュールのシナリオ1回実行 = 3オペレーション)。使用量が増えてきたら、月9ドルの「Core」プランへのアップグレードを検討しましょう。

エラー4:Notion のフィールドにデータが入らない

Notion データベースの各プロパティ(フィールド)のタイプと、Make でマッピングするデータのタイプが一致しているか確認してください。例えば、日付フィールドには ISO 8601 形式の文字列(2026-03-31T09:00:00Z)が必要です。Make の formatDate 関数でフォーマットを揃えましょう。


さらに自動化を深めるために

Make × Rork の連携に慣れてきたら、次のステップとしてバックグラウンドジョブのより高度な制御に挑戦してみましょう。定期実行やキュー処理、リトライ機構が必要になってきたタイミングでは、Rork × Trigger.dev バックグラウンドジョブ自動化ガイドも参考にしてください。

また、アプリの自律運用をさらに高めたい方には、AIエージェントと組み合わせた本格的なアーキテクチャを解説した記事 モバイルアプリの自律運用アーキテクチャ — Rork × AIエージェントで実現する24時間自動化 もおすすめです。


まとめ

Rork × Make の連携のポイントを振り返りましょう。

  • Make は月1,000オペレーション無料で利用でき、2,000以上のサービスに対応するノーコード自動化ツール
  • Rork アプリから fetch で HTTP POST リクエストを送るだけで Make のシナリオを起動できる
  • フォーム送信 → Notion 保存 → メール通知のような多段階の自動化をコードなしで構築可能
  • スケジュール実行や条件分岐など、複雑なバックエンドロジックも Make のビジュアルエディタで対応できる
  • エラーハンドリングのために、Webhook リクエストにセキュリティトークンを追加することを推奨

バックエンド開発の知識がなくても、Make を活用すれば Rork アプリに本格的な自動化処理を追加できます。まずは無料プランで小さなシナリオから試してみることをおすすめします。

プロンプト設計の基礎から応用まで丁寧に解説されており、Make の AI 連携モジュールを使いこなす際にも役立つ知識が得られます。

シェア

お読みいただきありがとうございます

Rork Lab は広告なしで運営しており、サーバー費用などの運営コストはメンバーシップのご支援で賄っています。実装コード・ベンチマーク・本番設計パターンなど、実務でお役立ていただける記事を毎日更新しています。もし読んでよかったと感じていただけましたら、ぜひご覧ください。

  • コピー&ペーストで使える実装コード付き
  • 毎日新しい上級ガイドを追加
  • ¥580/月 または ¥1,480 の永久アクセス
メンバーシップを見る →

もしこの記事がお役に立ちましたら、チップ(¥150)で応援いただけると大変励みになります。広告なしでの運営を続けるため、皆さまのご支援が大きな力になっています。

関連記事

開発ツール2026-04-25
RorkアプリにZapierを繋ぐ — バックエンドなしでユーザー通知・データ連携を自動化する方法
Rorkで作ったアプリにZapierを連携させ、ユーザー登録メール・フォームデータ保存・購入通知などをバックエンドなしで自動化する方法を実例コード付きで解説します。
開発ツール2026-07-03
App Store Connect API の日次集計が月末に合わなくなるとき — JWT 失効・レポート確定遅延・突合の運用メモ
App Store Connect API で自動化した売上・レビュー収集は、止まらずに「欠け」ます。401/404/429 が生む3種類の静かな欠損を fetch ログと突合クエリで検出し、バックフィルで埋める運用設計を実装コード付きでまとめます。
開発ツール2026-04-29
Rork × Cloudflare Durable Objects で『リアルタイム協調アプリ』のバックエンドを作る実装ガイド
Rork で作ったアプリに、Cloudflare Durable Objects を使った自前のリアルタイム協調バックエンドを組み込む実装手順を、本番で動くコードと一緒にまとめました。Liveblocks や Yjs ホスティングを使わずに、低コストで多人数同時接続を支える設計を解説します。
📚RECOMMENDED BOOKS
大規模言語モデル入門
山田育矢
LLM開発
生成AIプロンプトエンジニアリング入門
我妻幸長
プロンプト
Claude CodeによるAI駆動開発入門
平川知秀
AI駆動開発
※ アフィリエイトリンクを含みます
もっと見る →