Slack の次世代プラットフォームで作る ChatGPT Bot

Slack がベータ公開 (2023年時点) している次世代プラットフォームを使って ChatGPT Slack bot を作りました。bot へメンションすると ChatGPT API を叩いて返答してくれます。

これだけの機能の bot なら多くの人が作っていて github.com 上でもコードが散見されますが、今回作ったものには次の機能があります。ワイが作ったやつが一番ようできとる。

  • ファイルに固定値で指定したチャンネルだけでなく、後から任意のチャンネルに bot を追加できる
  • Slack Datastores に会話履歴を保存することで、一連の会話をまるっと ChatGPT API に投げられるため文脈を理解して返答してもらえる
  • ChatGPT API に渡す system messagebot が動くチャンネル毎に設定できて、後からでも変えられる

詳しい導入の仕方や設定の仕方はリポジトリの README に書いています。アイコンとか名前は好きに変えてご利用ください💁‍♀️

github.com

  • 機能説明
    • bot を動かすチャンネルの設定
    • 会話履歴の保持
    • system message の設定
  • 作ったモチベ
  • Slack の次世代プラットフォームへの感想
    • 良かったところ
    • いまいちだったところ
  • ChatGPT への感想
続きを読む

「買ってよかったもの」サイトを Heroku (Rails) から Vercel (Next.js) に移行しました

この記事は CAMPHOR- Advent Calendar 2022 の18日目の記事です。

2017年に「買ってよかったもの」というウェブサイトをリリースし運営していますが、リリースから5年経った今 PaaS 移行のため技術スタックも一新しフルスクラッチで書き直したのでその話をします。

ソースも公開しています。

github.com

  • 「買ってよかったもの」とは
  • Heroku 無料プラン終了に伴う移行検討
  • Vercel + PlanetScale への移行
  • 新アプリの技術スタック (Next.js + Prisma + tRPC)
  • パフォーマンスチューニング
  • Rails vs Next.js
  • Heroku に感謝
  • 宣伝
続きを読む

Azure Static Web Apps で作る React + GraphQL なサーバレスウェブアプリケーション

この記事で言いたいことは2つあって、

  • Azure Static Web Apps の開発体験が良い
  • TypeScript + React + GraphQL (Apollo Server, GraphQL Code Generator, React Query) の組み合わせが良い

です。

これらの技術要素を使って https://github.com/morishin/azure-static-web-apps-template というサンプルアプリを作成したので、その紹介をします。

github.com

上記の要素に加え、ビルドツールとして Vite、ルーティングに React Router、UI フレームワークChakra UI を利用しています。

続きを読む

ご家庭を支える定期実行ジョブの開発フロー

この記事は CAMPHOR- Advent Calendar 2021 の5日目の記事です。

CAMPHOR- Advent Calendar には初回の2014年から参加していて8度目の参加になります。老ですね。

今回は私生活でしばしば必要になって作っている家庭内タスクのリマインダーのお手軽構築スタイルを紹介します。

さて、僕は家庭内のコミュニケーションツールとして主に SlackSnapchat を利用しています。日常会話は Slack で、子ども・猫の様子やその他日常の風景を動画で共有するのに Snapchat を使います。Snapchat は大好きなのですが今はその話は置いておいて、家庭内タスクのリマインド通知先としても Slack が最適なので色々な通知を Slack に流しています。

https://i.gyazo.com/41474ab4a448bf950cc7a5f976e5849c.png
家庭内コミュニケーションの様子

この記事では毎週決まった時刻に締め切りのある、生協のネット注文のリマインダーを例にして構築手順を説明します。

  • 例: 生協のネット注文のリマインダー
  • ブラウザで完結させる編
    • 関数の作成
    • Lambda レイヤーでモジュールを使い回す
    • 関数の実装
    • できあがり
  • AWS CDK 編
  • おわりに
続きを読む

Firebase Hostingのリライトをローカルでエミュレートするプロキシ

Firebase Hosting にはリライトという機能があって、設定ファイル(firebase.json)を書くことで例えば

  • 全てのパスを /index.html へ向ける (SPA などで使う)
  • /items/1234 へのリクエストを /items/id.html へ向ける
  • /api/get_item へのリクエストを Cloud Functions の get_item 関数の HTTP トリガへ向ける

といったことが実現できます。

また cleanUrls 属性を使用することで URL から .html 拡張子を取り除くことができます。/page へのアクセスは Hosting にアップロードされた /page.html のファイルを取得するようになり、/page.html へのアクセスは /page へ 301 リダイレクトされるようになります。

これらの挙動はシュッとしたウェブアプリを作るためには大変便利でよく利用しますが、Firebase 本番環境へデプロイされたアプリケーションでしか効きません。本番環境では /items/1234/item/id.html を返してくれるけど開発環境では /item/1234 は 404 になるといったつらみが生じます。

rewriteproxy

そこで開発環境でもリライトと cleanUrls の挙動を再現してくれるプロキシを作りました。お手元の firebase.json を読み込んで動作します。

リポジトリはこちら。

github.com

続きを読む

開発で使ってる便利ツール

この記事は CAMPHOR- Advent Calendar 2020 の23日目の記事です。22日目は れおまる さんの「ニキシー管の魅力 」でした。ニッチ!!!!(賞賛)

CAMPHOR- Advent Calendar には初回の2014年から参加していて7度目の参加になります。

今回は普段の開発で便利に使っている周辺ツールを紹介します。他人の開発風景を見ていると色んな発見があって面白いので、自分の環境もコンテンツになるかもと思って書きました。他の人の記事も見てみたいのでよかったらみんな書いて。

macOS を普段使いしているので macOS 用のアプリケーションも多く含みます。

  • Alfred
  • ウィンドウのサイズと位置をコントロールするやつ
  • アクティブなアプリケーションを切り替えるやつ
  • 絵文字を入力するやつ
  • スニペットを素早く入力するやつ
  • Slack のステータスに今やってることを反映させるやつ
  • VSCode プラグイン
    • case を変えるやつ
    • ゲーミングカッコ
    • カンマで改行するやつ
    • GitHub で開くやつ
  • git 関連
    • git-rerere
    • peco 芸
  • シェルのコマンド履歴検索するやつ
  • cd のかしこいやつ
  • 環境変数をコマンドに渡すやつ
  • sudo を Touch ID でやるやつ
  • URL エンコードされた文字列を戻すやつ
  • 英かな切り替えるやつ
  • おわり
続きを読む

React Hooks の感想

React Hooks は最初は何が嬉しくてこんな書き方をしないといけないのか訳がわからなかったけど、しばらく使ってみた実感として大きなメリットは2つで

  • クラスを使わなくて良くなる
  • コンポーネントのステートやライフサイクルに結合していた処理を Hooks 関数の形で切り出して、複数のコンポーネントで使い回せるようになる

と理解した。

続きを読む