2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【個人開発】すべて無料枠でNext.js+Supabase+Gemini APIを組み合わせてKindle出版アプリを作ってみた

2
Posted at

1000003015.jpg

はじめに

こんにちは!今回は、すべて無料枠のサービス(Vercel, Supabase, Gemini API, Unsplash API)を組み合わせて、LINEでAI編集者とチャットするだけで本格的な小説の原案が完成し、Kindle出版(EPUB出力)までサポートするWebアプリ「チャットでKindle出版」を個人開発したので、そのアーキテクチャや開発の裏側を共有します。

個人開発で「いかにコストを抑えつつ、リッチな体験を作るか」に挑戦した記録です。

🚀 作ったアプリ

「チャットでKindle出版」

  • アプリURL: https://novel-writer-sigma.vercel.app/
  • LINE公式アカウントから、AIの質問に答えるだけで小説のドラフト(章ごと)を自動生成。
  • 生成された作品は、Web上の立体的で美しい3D本棚(AI図書館)に並びます。

🏗️ システム構成 / 使用テクノロジー

「ユーザーが触るフロントはLINE」「バックエンドとデータ保持はNext.js + Supabase」という構成にすることで、サーバー費用を完全に0円に抑えています。

役割 採用サービス 選定理由(すべて無料枠)
ホスティング Vercel Next.jsとの相性が最高。個人利用かつ帯域100GB/月まで無料。
データベース Supabase PostgreSQLが丸ごと1つ無料で持てる。今回は進捗保存や本棚データに使用。
LLM (AIエンジン) Gemini API 無料枠(AI Studio)のトークン制限が緩く、長文の小説生成に最適。
画像検索 Unsplash API 本のカバー画像(書影)をキーワードから自動取得するため。
インターフェース LINE公式アカウント リッチメニューとMessaging APIを使い、誰でも挫折しないUIを実現。

💡 工夫したポイントと技術的な裏側

1. ユーザーを飽きさせない「3D AI図書館(本棚UI)」

ただテキストが出力されるだけでは「AIとのチャット履歴」で終わってしまいます。モチベーションを高めるために、書き上がった作品がWeb上の立体的な本棚に並ぶビジュアル(カルーセルUI)を実装しました。
Unsplash APIをバックエンドで叩き、小説のテーマに沿った画像を自動でカバー(表紙)としてマッピングしています。

2. 「無料枠の限界」を突破するための設計

個人開発の天敵である「無料プランの制限」に対して、以下のようなアプローチで対策を施しています。

  • Gemini APIのレートリミット対策:
    大勢が一斉に叩くと429エラー(Too Many Requests)になるため、アプリ側での1日の生成上限(1日10章まで)を制限し、データベース側でアクセス頻度を制御。
  • Supabaseの自動一時停止(スリープ)対策:
    無料プランは1週間アクセスがないと自動停止してしまいます。これらを防ぐために生存確認(死活監視)の仕組みを導入。

📝 開発者として正直に伝える「AI執筆のリアル」と裏ワザ

自分でこのシステムを使い倒してみて分かったのは、「AIが書いたものをそのまま出版すればベストセラー」とはまだいかない、というリアルです。

  • 時々、話のつじつまが合わなくなる
  • 日本語の表現が少し不自然な部分がある

そこで、私が実際にクオリティを劇的に上げるために行っている**「Google AI Studio」を活用したリライト・検品ハック**がこちらです。

クオリティを爆上げするリライトプロンプト

アプリで出力したドラフト(章ごとの文章)をコピーし、開発者向けツール「Google AI Studio」の最新モデル(Gemini 1.5 Pro や Gemini 2.0 Pro Preview など)に直接以下のプロンプトを投げます。

「以下の文章はAIが書いた小説のドラフトです。プロの編集者の視点で検品し、誤字脱字の修正はもちろん、より感情に訴えかけるような、読み応えのある文章にリライトしてください。」

「構成や骨組みはLINEアプリで手軽に、最後の仕上げ(肉付け)は高性能な最新AIと自分の手で」
このハイブリッドな使い方が、現在の無料枠個人開発における最もスマートな執筆スタイルだと感じています。


1000003016.jpg

使い方

  1. LINE公式アカウントを友だち追加
  2. AIの質問(全6問)に答えてジャンルや世界観を設定(チャットは無制限)
  3. 「本を作成」で執筆開始(1日10章まで無料)
  4. 出来上がった文章をプレビューし、必要に応じて修正・リライト
  5. 完結したらEPUB出力してKindle出版へ

さいごに

AIは、人間の「書きたい」という情熱をブーストしてくれる最高のパートナーです。
完璧じゃなくてもいい、まずは自分の頭の中にある世界を形にしてみる楽しさを、このアプリを通じて体験していただけたら嬉しいです。

「ここをもっとこうすれば実装が軽くなるよ」「この構成面白いね」など、エンジニアの皆様からのフィードバックやコメントもお待ちしております!

#AI #個人開発 #Nextjs #Supabase #Gemini #Kindle出版

2
1
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
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?