Notionの更新でNetlifyに自動デプロイする方法

ロードマップ

Netlifyの手動deploy方法

MAINブランチにマージしたとき

MAINにマージするとNetlifyにデプロイされる。

プレビューを確認したいときはプルリクを投げる

本番環境(deployしたいページ)の確認の仕方です。

デバックだけならプルリクエスト作成すれば↓のプレビューで確認ができます。

ここのプレビューが使えるので、mainにマージしなくてもdraftのPRで確かめられる。

プルリク出した後に再度変更を加えて確認したい場合も、

同じブランチにプッシュすれば再度プレビューページが作られます。

プレビューのURLは同じなので注意が必要です。

プレビューページの更新のタイミングが少し分かりづらいです。

コマンドプロンプトでPOSTリクエストを送信する

Build hook のURLを生成しておけば、コマンドプロンプトからのPOSTリクエストでNetlifyのデプロイが可能。

コマンドプロンプトで実行 (powersellだと実行できない)

batファイルとかにしておけば良い。

タスクスケジューラとかでbatを自動postするように設定しておく。

javascript

curl -X POST -d '{}' {あなたのurl}

[決定版] Slack x Outgoing webhook x GAS で自動デプロイ

Slack x Outgoing webhook x GAS を使用してNotion-blogをNetlifyに自動デプロイします。

すべて無料で出来ます。

notion-blog のデータベース編集を自動検知して、 NetlifyにPostコマンドを送ってデプロイするまでを自動化します。

また、URLを踏む(クリック)するだけで、Netlifyにデプロイできるようにします。

こちらを参考に設定をします。

【Slack】OutgoingWebhookを利用して投稿を転送 | RE:ENGINES

はじめにこんにちはsuzukiです。今回はOutgoingWebhookを使用して、Slackに投稿された内

https://re-engines.com/2022/11/27/slackoutgoingwebhook/

GASでSlackのIncoming Webhookを使用して通知する方法 | specially198のブログ

手軽にプログラミングできる言語として、Google Apps Script（GAS）があります。サーバーいらずで、Googleスプレッドシートやドキュメントと連携して、自動でSlackへ通知を送ることができます。SlackのAPIには、アプ...

https://specially198.com/how-to-notify-using-slack-incoming-webhook-on-gas/

GAS (Google Apps Script) のコード

javascript

/// auther:u-ecmaker
/// updated: 2023/06/18
/// curlのpostコマンドをGASで発行するプログラム


// Outgoing WebHookから以下が呼ばれます。
function doPost(e) {
  sendPostRequest()
  sendSlack4doPost(e)
  var message = 'doPost()が呼ばれました。Netlifyにデプロイしました。';
  return ContentService.createTextOutput(message);
}


// URLをクリックした場合は以下が呼ばれます。
function doGet() {
  sendPostRequest()
  sendSlack4doGet()
  var message = 'doGet()が呼ばれました。Netlifyにデプロイしました。';
  return ContentService.createTextOutput(message);

  // html形式で表示したい場合は以下にする。
  // let html = '';
  // html += '<h1>Netlifyにデプロイしました。</h1>';
  // html += '<p>doGet()が呼ばれました。</p>';
  // return HtmlService.createHtmlOutput(html);
  // 参考:https://tonari-it.com/gas-url-click-doget/
}


// 指定のURLにPOSTコマンドを発行します。
function sendPostRequest(){
  var url = 'https://api.netlify.com/build_hooks/hoge1';
  var payload = '{}';
  var options = {
    method: 'post',
    contentType: 'application/json',
    payload: payload
  };
  UrlFetchApp.fetch(url, options);
}


// Incomming WebHookでSlackへの通知する関数：doGet(URLクリック)用：引数なし
function sendSlack4doGet(){
  var message = "notion-blog更新URLがクリックされました。\nNetlify の build trigger を叩きました。\nまもなくデプロイされます。";
  var jsonData =
  {
     "username" : "GAS-NetlifyDeployBot",
     "icon_emoji": ":tada:",
     "text" : message
  };
  var payload = JSON.stringify(jsonData);
  var options =
  {
    "method" : "post",
    "contentType" : "application/json",
    "payload" : payload
  };
  //IncomingWebhookで取得したURLを設定
  UrlFetchApp.fetch('https://hooks.slack.com/services/hoge2', options);
}


// Incomming WebHookでSlackへの通知する関数：doPost(OutGoingWebhook)用：引数あり
function sendSlack4doPost(e){
  var message = "\nnotion-blog 自動更新通知\nNetlify の build trigger を叩きました。\nまもなくデプロイされます。";
  var jsonData =
  {
     "username" : "GAS-NetlifyDeployBot",
     "icon_emoji": ":tada:",
     "text" : e.parameter.text+message,
  };
  var payload = JSON.stringify(jsonData);
  var options =
  {
    "method" : "post",
    "contentType" : "application/json",
    "payload" : payload
  };
  //IncomingWebhookで取得したURLを設定
  UrlFetchApp.fetch('https://hooks.slack.com/services/hoge2', options);
}