取り組みの背景: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 を連携させる基本的な流れは次のとおりです。
- Make でシナリオを作成し、Webhook URLを発行する
- Rork アプリ内から Webhook URL に HTTP リクエストを送信する
- Make のシナリオがリクエストを受け取り、後続の処理を自動実行する
Rorkは React Native ベースのため、fetch API を使って任意のHTTPエンドポイントにリクエストを送ることができます。Make の Webhook はリクエストを受け取ると即座にシナリオを起動するため、リアルタイムな連携が可能です。
Step 1:Make でシナリオを作成し Webhook URL を取得する
まず Make のアカウントを作成します(make.com)。無料プランで始められます。
ログイン後、以下の手順で Webhook を設定します。
- 左サイドバーの「Scenarios」→「Create a new scenario」をクリック
- 最初のモジュール追加画面で「Webhooks」を検索し、「Custom webhook」を選択
- 「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 を経由して、以下の自動化を実現してみましょう。
シナリオの流れ:
- Rorkアプリ → Make Webhook(データ受信)
- Notion データベースに新規レコード追加
- Gmail で管理者に通知メール送信
Notion モジュールの設定
Make のシナリオに「Notion」モジュールを追加します。
- Webhook モジュールの右の「+」ボタン → 「Notion」を検索
- 「Create a Database Item」を選択
- Notion の接続認証を行い、保存先のデータベースを選択
- 各フィールドに Webhook から受け取ったデータをマッピング:
- 名前フィールド →
{{1.name}}(Webhook の name フィールド) - メールフィールド →
{{1.email}} - メッセージフィールド →
{{1.message}} - 日時フィールド →
{{formatDate(1.timestamp; "YYYY-MM-DD HH:mm")}}
- 名前フィールド →
Gmail 通知モジュールの設定
Notion モジュールの後に「Gmail」モジュールを追加します。
- 「+」ボタン → 「Gmail」→「Send an Email」
- 宛先、件名、本文を設定:
件名: 【お問い合わせ】{{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 連携モジュールを使いこなす際にも役立つ知識が得られます。