1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Chromebookだけで、毎朝AIがIT・AIトレンドをまとめてくれるサイトを作った【第4回:カレンダー・トレンドワード・検索・総括で「学べるサイト」にする】

1
Last updated at Posted at 2026-09-30

はじめに

前回:第3回:Supabaseに保存してVercelで毎朝自動実行する

毎朝おすすめが届くようになって、実際に使ってみると、欲しいものが次々に出てきました。

「昨日のおすすめ、もう一回見たいな」
「最近この言葉よく見るけど、他の記事も読みたい」
「10件の要約を読むのも、正直ちょっと面倒」

最終回の今回は、こうした「使ってみて欲しくなったもの」を足して、ただのニュースまとめから読むだけで学べるサイトに育てていった話です。


こんな方におすすめ

  • Supabaseのjsonb列で、タグ検索や集計をしてみたい方
  • Next.jsのURLパラメータで、画面を切り替える作りを知りたい方
  • AIで「要約の要約」を作ってみたい方
  • 作ったアプリを、使いながら育てていく流れを知りたい方

カレンダーで過去のおすすめをさかのぼる

おすすめを保存するときに「どの日のおすすめか」(recommended_on)を記録していたので、データはすでに揃っていました。足りないのは見る画面だけです。

右側のサイドバーにカレンダーを置き、おすすめがある日に点を付けて、押すとその日に移動するようにしました。URLは /?date=2026-09-28 のような形にしたので、ブックマークもできます。

app/page.tsx
// ?date= が正しい形で、今日以前なら使う。それ以外は今日
const date =
  params.date && /^\d{4}-\d{2}-\d{2}$/.test(params.date) && params.date <= today
    ? params.date
    : today;

日付の計算は、サーバーが動く場所に関係なく日本時間でそろえるのがポイントです。

lib/daily.ts
export const todayJST = () =>
  new Intl.DateTimeFormat("sv-SE", { timeZone: "Asia/Tokyo" }).format(new Date());

sv-SE(スウェーデン語)の形式は 2026-09-28 のように出力されるので、そのまま日付として使えます。


トレンドワードで話題をつかむ

要約のときにAIが付けたキーワードを、直近7日分で数えて、多い順にサイドバーに並べました。押すと、そのキーワードを含む記事が日付をまたいで表示されます。

キーワードは [{ term, explanation }] の形でjsonb列に保存しているので、contains で「この用語を含む記事」を探せます。

app/page.tsx
supabase
  .from("articles")
  .select("*")
  .contains("keywords", [{ term: keyword }]);

第2回で「用語名を正式名称に統一させる」とプロンプトに書いたのは、ここで効いてきます。表記がバラバラだと、同じ話題の記事がうまく束ねられません。


検索と関連キーワードで芋づる式にたどる

検索では、タイトル・要約・記事の冒頭文の部分一致と、キーワードの完全一致をまとめて探しています。

さらに、見つかった記事によく一緒に出てくるキーワードを「関連キーワード」として表示しました。たとえば「RAG」で検索すると、関連する別の用語が並ぶので、押せばそちらの記事に移れます。

検索 → キーワード → 関連キーワード → …と、気になった言葉を追いかけていくだけで、周辺知識が自然に広がっていく作りです。


今日の総括で「まずここだけ読む」

10件の要約でも、朝に全部読むのはなかなか大変です。そこで、おすすめ10件の要約をもう一度Geminiに渡して、その日全体の流れを書かせることにしました。

lib/digest.ts
const prompt = `忙しい人が最初にこれだけ読めば今日の流れが分かるように、
日本語でまとめてください。
- overview: 今日の記事全体から見える動きや傾向を3〜4文で。
  個々の記事の言い換えではなく、全体を俯瞰して
- highlights: 特に押さえておきたいポイントを3つ。それぞれ1文で短く`;

「個々の記事の言い換えではなく」と書いておくのがコツで、これがないと単に要約を並べ直しただけの文章になりがちでした。

総括は日付ごとに別のテーブルに保存し、作成に失敗しても、おすすめ自体は表示できるようにしています。Geminiの呼び出しは1日3回になりましたが、無料枠の範囲に十分収まっています。


テスト用に過去の日も作れるようにする

カレンダーを作っても、データが今日の分しかないと動作確認ができません。そこで、/api/daily?date=2026-09-27 のように日付を渡すと、その日に公開された記事からおすすめと総括を後から作れるようにしました。

RSSには直近の記事しか入っていないので、さかのぼれるのは数日程度ですが、画面の確認には十分でした。


これからやりたいこと

使いながら思いついたものを、少しずつ足していく予定です。

  • 記事の内容についてAIに質問できるチャット
  • 1週間の流れを振り返る週次まとめ
  • よく読む分野を記録して、おすすめを自分好みに育てる
  • 要約していない記事にもタグを付けて、トレンドワードの精度を上げる

まとめ

  • おすすめの日付を保存しておいたので、カレンダーの過去ログは画面を足すだけで作れた
  • jsonb列の contains で、キーワードから記事をたどれるようにした
  • 検索結果によく出るキーワードを「関連キーワード」として出し、芋づる式に学べるようにした
  • 要約をさらにまとめた「今日の総括」で、朝はまずそこだけ読めばよくなった
    シリーズを通して、Chromebookとスマホだけ、費用0円で、毎朝AIがトレンドをまとめてくれるサイトを作ってきました。作って終わりではなく、使いながら「こうだったらいいな」を足していけるのが、自分で作る一番の楽しさだと思います。

ここまで読んでいただき、ありがとうございました。

次回:番外編:使いながら育てる

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?