概要Bubbleでは作成したアプリからメールを配信できます。email」というactionが存在しますが、こちらは送信数に上限が課せられています。この解消方法として、メール配信サービスのSendGridと連携することが挙げられます。今回はプラグインを使用し、SendGridと連携したメール配信の実装方法を紹介します。emailの送信数の上限については、公式ドキュメントをご参照ください。Bubbleアプリにドメインを設定している方は、プラグインを使わずにSendGridでのメール配信を実装できます。詳細は公式ドキュメントをご参照ください。完成イメージ送信先メールアドレスを入力し、送信ボタンを押します。入力したメールアドレス宛に、SendGridで設定したメールが送信されました。SendGridに登録するまずSendGridに登録します。新規登録へ進み、メールアドレスを入力します。確認メールから登録を続け、登録を完了します。画面に記載の通り、登録情報の審査に通るとログインできるようになります。今回は、翌日にメールが届きました。メールに記載の情報を使い、無事にマイページにログインできました。ダッシュボードへ移動しておきます。テンプレートを作成するメールの本文内容を含んだテンプレートを作成します。Template」をクリックします。任意のテンプレート名を入力し「Create」をクリックします。Version」より、メールの内容を作成します。お好みのデザインを選択します。今回は空白のテンプレートを選択します。Editor」を選択します。パーツのドラッグ&ドロップで直感的に構築できます。メール内容を構築します。今回はテキストのみを配置してみます。Buildタブを選択し「Text」をドラッグ&ドロップします。本文の内容を入力します。フォントや色も指定できます。編集を終えたらテキストエディタを閉じます。Subject(件名)に”{{subject}}”と入力します。するとBubble側で件名を入力できます。最後に「Save」で保存し編集完了です。IDはBubbleでの設定で使うので、コピーしておいてください。Keysへ移動します。Key」を押し、APIキーを作成します。任意の名前を設定し、アクセス権限を選択します。Access」としました。View」を押し、作成完了です。APIキーが表示されるので、コピーしておきます。プラグインをインストールする続いてBubbleにて、プラグイン「SendGrid」をインストールします。Key」項目に、先ほどコピーしたAPIキーを入力します。メール送信機能を実装するDesignタブにて、InputとButtonを配置します。続けて送信ボタンのWorkflowを設定します。emailのプロパティを設定します。Address(送信元のメールアドレス)」に任意の値を入力します。value」を設定します。以上で設定は完了です。プレビューにてメールを送信してみると、SendGridからのメールが届きました。