2024年4月に発表されたものの検証/調査記事です。 Elmo (Chrome拡張) Elmoは今開いているページの要約や概要の箇条書き、ページ内容を元に追加質問ができるChrome拡張です。 https://chromewebstore.google.com/detail/elmo-your-ai-web-copilot/ipnlcfhfdicbfbchfoihipknbaeenenm 以下の画像のように、ページの要約や概要などがサイドバーで表示されます。追加質問もできるため、ページの内容を理解するのに便利です。 文章選択時は「Get insight from internet」...

対象 PythonのFastAPIをAWS Lambdaで動かしたい人 カスタムイメージを使ってビルドしたい人 ローカルでの動作確認方法を知りたい人 AWSのリソース作成の概略を知りたい人 利用するライブラリのバージョン 以下のライブラリを利用します。 fastapiは執筆時点での最新版、mangumは0.11.0より新しいバージョンだとエラーが発生するため、このバージョンとしてます。 pydanticやstarlette, typing-extensionsはfastapiやmangumの依存ライブラリです。 fastapi==0.103.1 pydantic==2.3.0...

目標 CircleCIで定期実行ができるようにします。 対象 CircleCIで定期実行したい人 2022年度末に廃止予定のScheduled Workflowsの移行方法を確認したい人 migrationガイドを読んでもよく分からなかった人 Dynamic Configでconfig.ymlを分割したいけど、定期実行のやり方が分からない人 コード こちらがサンプルコードです。 https://github.com/kusakabe-t/playground/tree/main/circleci/dynamic_cron Scheduled Workflow...

対象 Next.jsでブログを作ってみたい方 MarkdownやmicroCMSでブログ記事を管理してみたい方 データ取得周りが気になる方 コード こちらに公開してます！ https://github.com/kusakabe-t/blog ブログの構成 基本的な部分はNext.js + TypeScript + TailwindCSSで作成しています。 その他の記事の管理方法やインフラ周りは以下の表の通りです。 記事の管理方法 説明 microCMS 更新頻度の高い内容や検索したい記事を投稿するために利用 Zenn 独断と偏見で公共性が高めだと感じた記...

目標 以下のような感じで、親窓と小窓のstore共有、および小窓間でのstore共有ができるようにします。 本記事の対象 サブウィンドウやタブ間で、storeを共有したい方 wobsoriano/pinia-shared-stateのコードリーディングをしたい方 環境 簡単のため、SPAのアプリで実験しました。 使用ライブラリのバージョンは以下です。 "nuxt": "3.0.0-rc.3", "pinia": "^2.0.14" "@pinia/nuxt": "^0.1.9", "broadcast-channel": "^4.2.0" 結論 具体的なコードはこち...

どういうエラー？ これはChrome102で追加されたウィンドウ配置に関するバリデーション由来のエラーです。 Chrome拡張でウィンドウを作成するときに、ウィンドウサイズが大きいときやディスプレイの表示領域から離れすぎると発生します。 [Extensions] Display window only when its bounds intersect the displays Windows should only be displayed when they intersect the displays in a meaningful manner (in this case,...

GCPのCloud Run上でNext.jsを動かす方法について

Tailwind v3から設定ファイルの書き方が変わり、Gatsbyの公式ページやブログ記事通りにやっても設定できなくなってるので追加しました

対象 WebAssemblyに興味があり、簡単なサンプルを動かしてみたい方 環境 $ sw_vers ProductName: macOS ProductVersion: 11.4 BuildVersion: 20F71 $ cargo --version cargo 1.53.0 (4369396ce 2021-04-27) $ yarn --version 1.22.10 $ wasm-pack --version wasm-pack 0.10.1 viteでプロジェクトの準備 先にviteでプロジェクトを作り、その中にwasm用のプロジェクトを作ります。 $ ...

サーバレスアプリを実装、ローカルで実験、デプロイできるツールであるServerless Frameworkの使い方を紹介します。

対象 GitHubのプロジェクトが霧散し、どこに何があるか毎回探すのに時間がかかる方 GitHubのブラウザを確認せずに、PRのチェックアウトをしたい方 ワンライナーが大好きな方 pecoが好きな方 必要なもの peco これは、インクリメンタル検索をするのに使います。 https://github.com/peco/peco ghq これは、フォルダをリスト表示をするのに使います https://github.com/x-motemen/ghq GitHub CLI これは、hubのGo再実装が公式になったNTR感ある、GitHubの公式ライブラリです。 PRやissueを...

対象 OAuthに不慣れで、Pawを使ったことがない人 Twitter OAuthをpawで叩く 公式サイト記載のOAuth認証をpawで実行します。 https://developer.twitter.com/en/docs/authentication/guides/log-in-with-twitter#tab2 エンドポイントやパスはこちらにも記載されています。 https://developer.twitter.com/en/docs/authentication/api-reference/request_token リクエストを以下のように設定します。 POST...

はじめに sapperでsitemap.xmlを生成する方法で少し時間がかかったので、まとめておきます。 対象 sapperでsitemapを自動生成したい人 svelteKitのリリースを待てず、sapperを使いたい人 参考資料 基本的にはこちらのissueを読んでいけば、できます。 ソースが散らばっているのと、ブログ利用がメインの話が多かったので、今回記事化しました。 https://github.com/sveltejs/sapper/issues/461 sitemapの生成 本題、routes/sitemap.xml.jsを作成し、以下を記述します。 la...

AWSが用意している通知方法は、メールだけです。しかし、メールでは見落としてしまう可能性があります。そこで、SlackやLINEにもメッセージが届くように、AWS Budgets, Amazon SNS, AWS Chatbot, Lambdaを併用した通知システムを作ってみます。