📒

ブログ記事などを要約してNotionに登録してくれるChrome拡張機能を6時間でつくりました

2023/12/10に公開

はじめに

あるふさん27時間オーバーしてごめんなさい!!

あるふさんの生成AI Advent Calendar 2023の12月9日分として投稿いたします。

きっかけ

前からNotionに要約した内容も含めて記事登録したいーってずっと思ってて、9月に一緒につくろうとフロントをやってくれるとい言っていた人がいたのでAWSlambdaでのバックエンドだけは作っていたのですが、結局フロントができずそこから放置してました。

mah_labさんのこちらの記事を見て、あーこれアドベントカレンダーのネタとして作るカー(20:30頃)に思って作り始めました。
https://note.com/mahlab/n/nf9c4ffe8b1a2

結局時間が間に合わず・・・

たぶんある程度ニーズある機能だと思うのでGitHubで公開しました。

拡張機能導入方法

https://github.com/Olemi-llm-apprentice/SummarizeToNotion
から

ZIPにしてダウンロード

ZIPファイルを展開する:

ダウンロードしたZIPファイルをローカルマシン上の適当な場所に展開(解凍)します。展開したフォルダ内には拡張機能のソースコードが含まれている必要があります。

Chromeを開き、拡張機能ページに移動する:

Chromeブラウザを開き、アドレスバーに chrome://extensions/ と入力して拡張機能ページにアクセスします。

デベロッパーモードを有効にする:

拡張機能ページの右上にある「デベロッパーモード」を有効にします。

拡張機能をロードする:

「パッケージ化されていない拡張機能を読み込む」をクリックし、展開した拡張機能のフォルダを選択します。

使い方

Notionデータベースを作成する


※テンプレート公開が上手くいかなかったので調べて後日展開します。

Integration(SecretKey) を作成する

このサイトが詳しく乗っていますので、NotionのIntegrationを作成し、データベースと連携しておきます。
https://zenn.dev/kou_pg_0131/articles/notion-api-usage

APIKeyなどを登録する


OpenAI API KEYと先ほど作ったIntegrationのSecretKey
作成したデータベースページのURLにあるデータベースIDを登録します。下の黄色い部分

入力したらAPIキー確認ボタンで確認ができます。

記事・ブログ登録

Notionに追加したいブログや記事のサイトに行き、[Notion登録]ボタンを押すだけ
※アラートなり、完了しましたポップアップなど出したかったのですが上手くいかず、Notionの方を確認してできてるかを確認してください。



こんな感じで追加される

おわりに

あるふさん本当にごめんなさい!!
JavascriptまったくわからないけどもCursorに98%書いてもらってなんとか作れました・・・
要約のプロンプトひどかったり、登録したAPIキーとかを編集できなかったり
タグ追加機能なかったりと欠陥が多いですが
6時間で作ったから多めに見てください!!
今後機能追加していきますね

おしり

Discussion