自分用に作ったRead-it-laterアプリをProduct Huntに出してみた【Tuck開発記】

はじめに

「あとで読む」に保存した記事、読んでますか？

僕は正直、読めていませんでした。Pocketに100件以上の記事が溜まっていて、「いつか読む」と思いながら放置。気づけば1年以上前の記事が未読のまま眠っている状態でした。保存する行為自体が目的化してしまっていたんです。

ないなら作ろうということで、自分用のRead-it-laterアプリを5日間で作りました。

作ったもの

Tuck - 保存した記事をAIが要約し、読書習慣をサポートするRead-it-laterアプリです。

Tuck - Curate. Focus. Remember.gettuck.app

主な機能

• AI要約として、保存した記事を自動で要約してくれる（無料）
• 週間ダイジェストでは、1週間の読書をAIがレポートしてくれる
• スマート通知は読書パターンに基づいた最適タイミングで届く
• セマンティック検索があり、「あのReactの記事」のような曖昧な言い方で検索できる
• 読書インサイトでカテゴリ別の読書傾向を可視化できる
• 日本語ネイティブ設計で、UIもAI要約も自然な日本語

「読まなくても、要点だけ把握できればいい」——この発想がTuckの原点です。

なぜ作ったか

課題1: Pocketが終了する

長年愛用していたPocketがサービス終了することになりました。移行先を探す中で見つけたのがCuraQというサービス。AIで記事を要約し、セマンティック検索ができるというコンセプトに「これだ」と思いました。

ただ、実際に使ってみるとパフォーマンスやUIが自分の好みではありませんでした。「コンセプトは最高なのに、惜しい...」そう感じた瞬間、エンジニアなら誰もが思うあの言葉が浮かびました。「これなら自分でも作れるのでは？」

課題2: Claude Codeをもっと活用したい

Claude Codeに課金しているので、せっかくなら本格的なプロジェクトで活用したいと思っていました。「自分が欲しいアプリを、AIと一緒に作る」——これがTuck開発の直接的なきっかけでした。

課題3: 既存サービスの日本語対応が微妙

Pocket、Raindrop、Instapaper...どれも英語圏向け。日本語の記事を保存すると、微妙に挙動がおかしかったり、UIが不自然だったりします。日本語ネイティブ対応は、自分で作るなら絶対に外せないポイントでした。

5日間で作り上げた｜個人開発の開発スピード

着手から今の状態まで、約5日間でした。「5日でRead-it-laterアプリ？」と思うかもしれませんが、これまでの個人開発で培ったCloudflare + Hono + Reactの構成をそのまま流用できたのが大きいです。

使い慣れた技術スタックがあれば、アイデアを形にするスピードは格段に上がります。

技術スタック｜Cloudflare Workers + Hono + React 19

「エッジで動く」「低コスト」「型安全性」を重視した構成です。

全体構成

flowchart LR
    subgraph Client["📱 Client"]
        R[React 19]
        TQ[TanStack Query]
        R --> TQ
    end

    subgraph Edge["⚡ Cloudflare Edge"]
        W[Workers]
        H[Hono]
        D1[(D1 SQLite)]
        V[(Vectorize)]
        W --> H --> D1
        H --> V
    end

    TQ <-->|"低レイテンシ"| W

なぜCloudflare？

個人開発で一番気になるのはコストです。

個人開発レベルであれば維持費ほぼ0円で運用できます。

AI機能の実装｜要約とセマンティック検索

Tuckの核となる機能は、AI要約とセマンティック検索です。

記事の自動要約

記事を保存すると、バックグラウンドでAIが要約を生成します。

• gpt-4o-mini採用（低コストで高性能）
• 日本語記事は日本語で、英語記事は英語で要約
• 要約は3段階（一行サマリー、概要、詳細）
• 生成結果はD1にキャッシュ

セマンティック検索

「あのReactの記事どこだっけ...」

タイトルを正確に覚えていないと見つからない。これが従来のRead-it-laterアプリの限界でした。TuckではCloudflare Vectorizeを活用しています。

1. 記事保存時にEmbedding APIで埋め込みベクトルを生成
2. Vectorizeに保存
3. 検索時はクエリをベクトル化し、コサイン類似度で関連記事を取得

「最近保存したAIに関する長めの記事」——こんな曖昧な検索でも、目的の記事にたどり着けます。

競合との比較｜Pocket・Raindrop・CuraQとの違い

正直に書くと、機能だけで見ればPocketやRaindropも優秀です。ただ、AI機能と日本語対応では差別化できていると思います。

CuraQは同じコンセプトのサービスで、機能的に似ている部分も多いです。Tuckはスマート通知やハイライト共有など、読書を「習慣化」するための機能に力を入れています。

学んだこと｜Cloudflare D1とVectorizeの実運用Tips

Cloudflare D1の実運用Tips

D1は個人開発レベルでは十分実用的でした。

• Drizzle ORMとの相性が良い
• マイグレーションはwrangler d1 migrations applyで管理
• ローカル開発時は--localフラグを忘れずに

Vectorizeの導入は意外と簡単

セマンティック検索の実装は思ったより簡単でした。OpenAIのEmbedding APIで埋め込みを生成し、Vectorizeに保存するだけ。検索のUXが劇的に向上しました。

Claude Code + hookifyで開発効率アップ

Claude Codeでの開発にはhookifyプラグインを活用しました。特定のパターンを検出してルールを強制できるので、コーディング規約の統一やミス防止に役立ちます。

• lint/format の自動実行により、コード変更時に自動でチェックされる
• コミットメッセージは Conventional Commits に準拠するよう規約強制
• 禁止パターンの検出として、console.log の消し忘れなどを拾う

AIにコードを書かせるとき、hookifyでガードレールを設けておくと品質が安定します。

開発コスト｜初期投資$120で維持費ほぼ0円

個人開発でかかった費用を正直に公開します。

初期投資: 約$120（ドメイン + Apple Developer + OpenAI）

Cloudflareの無料枠が優秀なので、ランニングコストはほぼ0円。スケールしても安心です。

現状の数字｜Product Huntローンチ前のリアル

2026/01/14時点

正直、まだほぼ自分用のアプリです。でも、だからこそ自分が本当に欲しい機能だけを実装できました。

Product Huntローンチ後にやりたいこと

• モバイルアプリ（React Native）の開発
• ブラウザ拡張機能の改善
• ユーザーフィードバックを元にした機能改善

まとめ

Tuckは「あとで読む」を「あとで読めた」に変えるためのアプリです。

個人開発のポイント:

• 自分の課題を解決する - 既存サービスへの不満から始める
• Cloudflareで低コスト運用 - 無料枠を活かして維持費ほぼ0円
• AI活用で差別化 - 要約とセマンティック検索でUX向上
• 使い慣れた技術スタック - 5日間で形にできた

「あとで読む」に記事が溜まりすぎて困っている方は、ぜひ試してみてください。

Tuck - Curate. Focus. Remember.gettuck.app

使ってみて良いと思ったら、Product Huntでのサポートもいただけると嬉しいです！

Just a moment...www.producthunt.com

質問があれば X (@paveg_) までお気軽にどうぞ。

関連記事

• Cloudflare D1 + Hono + Reactでサプリ管理PWAを個人開発した話【維持費ほぼ0円】
• 個人開発アプリをEdge構成で構築した技術スタック - Cloudflare/Hono/Expo

AI要約サービスで robots.txt を尊重する実装パターンzenn.dev