13
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

AI時代にこそ必要なFull Stack Template -LINE Bot + LIFFの統合アプリのテンプレートコード-

Last updated at Posted at 2025-10-09

CookForYou のコア部分を抽出したtemplate code.

私が開発しているCookForYouは、LINE BotとLIFF Webアプリで使った料理をとおして、幸せをコンセプトに作られたアプリです。

一度以下のボタンまたはQRコードから友達追加していただき、Lineを通したアプリを体験してみてください。
友だち追加はこちらから!
無題のプレゼンテーション (2).png

公開したテンプレート repositoryを用いることで、LineBot, Liffの開発をスムーズに進められると思います。

AI時代にTemplate codeが求められる理由

「AIがコードを書いてくれる時代に、なぜFull Stack Templateが重要なのか?」

この問いに対する私の考えは どんなに美しい葉っぱ(AIが生成した個別機能)も、しっかりとした幹(整理されたアーキテクチャ)がなければ、健全な木(プロダクト)にはならないからです。

AIは「MVP」は作れるが「複雑なシステム」は設計できない

最近、Cursor、GitHub Copilot、Claude等のAIアシスタントの登場により「それっぽく動くプロトタイプ」を作る難易度はかなり下がりました。
しかし、各機能はAIで実装できても、それらを構造的にまとめ上げる幹がなければ、コードがスパゲッティ化し、中長期的な開発が困難になります。
Line Presentation Part 3.jpg
そのため、幹となる整理されたアーキテクチャが必要となります。

幹は自然にできない

幹が必要なのはわかりますが、この幹はしっかりと意識して、取り組まないと作られません。
また、最初にAIに幹の部分を書かせるのも一つの考えだと思います。

しかし、ある程度一般的なアプリケーション(Liff, lineBotのアプリなど)用の実装では、毎回AIに幹を作らせるのは再現性の観点や、コストの観点から、おすすめできません。
そのため、すでに構築されたtemplate code利用し、それを幹として利用することでAIを利用した中長期的な開発ができます。

Line Presentation Part 3 (1).jpg

特に簡単は機能のアプリはすぐに作れるようになった時代だからこそ、しっかりした幹を持ってアプリを開発することで多機能で多角的にvisionを達成できるような、他と差別化ができるアプリを作ることができるようになります。

🌟 Full Stackテンプレートで何ができるのか?

このテンプレート repository は、フロントエンドからバックエンド、データベース、LLM統合までを含みます。
lineBotで会話した内容がLIFFにも反映されることで、BotとLIFFの連携を体験する、ミニマムアプリです。

スクリーンショット 2025-10-08 23.15.04.png
スクリーンショット 2025-10-27 13.45.28.png

スタック一覧

Backend Layer (Golang)

  • 🔐 認証API(LINE OAuth → Supabase Auth連携)
  • 💬 会話API(Gemini LLM統合)
  • 📝 共通パッケージ(LLMクライアント、リポジトリ層)

Frontend Layer (Next.js + TypeScript)

  • 🌐 LIFF Webアプリ(チャットUI)
  • 🎨 モダンなUI(Tailwind CSS + shadcn/ui)
  • 🔄 リアルタイム同期(Supabase Realtimeを導入することで)

Database Layer (Supabase)

  • 🗄️ PostgreSQL(マイグレーション完備)
  • 🔒 Row Level Security(RLS)
  • 👤 認証システム(Supabase Auth)

LINE Integration Layer

  • 🤖 LINE Bot Service(Webhook処理)
  • 📱 LIFF統合(LINE Front-end Framework)
  • ✅ 署名検証(セキュリティ)

Infrastructure Layer

  • 🐳 Docker対応(Backend、LINE Bot)
  • 📝 デプロイ準備完了(.env.example、Dockerfile完備)
  • 🔧 インフラ非依存設計(任意のクラウドに対応可能)

なぜこの構成なのか?

モノレポ(Go Workspace): common/パッケージが両サービスに組み込まれ、コード重複を完全排除
型安全: Golang + TypeScriptで堅牢性確保
マイクロサービス: 各サービスが独立してスケール
インフラ非依存: Dockerコンテナで任意のクラウドに対応
セキュリティファースト: 署名検証、JWT認証、RLS

使い回せるセキュリティ実装

Liff ✕ Supabase ✕ Next.jsの認証は本当に複雑で面倒です。詳細はこちら
一方、認証周りは非常にセンシティブに実装する必要があり、毎回ゼロから実装するべきではありません。このテンプレートには、私が以前Qiitaで公開したLINE + Supabase + Next.js認証フローが組み込まれています。

この実装は本番環境で実績があり、そのままテンプレートに含まれています。

なぜPythonではなくGolangなのか?

多くのLLM統合プロジェクトはPythonで書かれていますが、私があえてGolangを選んだ理由は2つ:

① 型安全性による堅牢性

// Golangでの例
type Conversation struct {
    ID      string    `json:"id"`
    UserID  string    `json:"user_id"`
    Role    string    `json:"role"`
    Content string    `json:"content"`
}

// コンパイル時に型チェック
func ProcessMessage(conv *Conversation) error {
    // ここで型の不整合があればコンパイルエラー
}

AIが生成したコードでも、型システムが守ってくれます。

② Cold Start問題の解決 = UXとコストの両立

サーバーレス環境で最小インスタンス数を0にすると、使用していない時は完全無料になります。しかし、Pythonでこれをやると:

Pythonの場合(Cold Start: 5-7秒):

ユーザー「こんにちは」
 → 5秒待機(Cold Start)
 → Loading iconが出る

これだと、UXが壊滅的に悪いため、常時起動(min instance = 1以上)が必須 → コスト増

一方Golangの場合(Cold Start: 100-300ms):

ユーザー「こんにちは」
 → 0.1秒待機(ほぼ気づかない)
 → Loading iconが出る

UXを損なわずmin instance = 0が可能 → 使用時のみ課金で大幅節約

言語 Cold Start Min Instance 月額コスト(小規模) UX
Python 5-7秒 1以上必須 $50-100 ❌ 初回が遅い
Golang 100-300ms 0でOK $0-5 ✅ 快適

Golangなら、サーバーレスの真の利点(完全従量課金)を享受しながら、優れたUXを提供できます。

※同様のモチベーションで サーバーレスでレコメンデーションシステム を作ることで、UXの工場とコストを削減を達成した事例はServerless MLレコメンデーション:LLMを活用した自身でモデルを持たない、レコメンデーションの実装を御覧ください。

ミニマルで拡張可能な設計哲学

このテンプレートは、あえて機能モリモリにしていません。理由は:

🎯 コア機能に集中
認証、会話、同期という最小限の機能のみ実装。不要な機能がないため、理解しやすく、カスタマイズしやすい。

🔧 拡張性を重視
堅牢なアーキテクチャの「幹」があれば、AIを使って機能を簡単に追加できる。画像認識、音声対応、リッチメニューなど、必要な機能を自由に拡張可能。

📦 あえて含めていないもの

このテンプレートには、意図的に以下を含めていません:

  • ❌ デプロイ設定(CI/CD、クラウド固有設定)
    → プロジェクトごとに要件が異なるため。Dockerfileがあればどこでもデプロイ可能

  • ❌ TEST (unit test, integration test, e2e test)
    → テスト戦略や使用するライブラリはプロジェクト要件に強く依存するため、テンプレートには含めていません。開発者が自身のプロジェクトに最適なテスト手法を自由に選択できるよう、あえて特定の構成を強制しない方針です。

  • ❌ サービス間の密な連携(gRPC、メッセージキュー等)
    → シンプルなREST APIで十分な場合が多い。必要なら後から追加できる

  • ❌ 過度な抽象化や複雑なデザインパターン
    → 学習コストを下げ、すぐに理解できる構造を優先

  • ❌ フロントエンドの高度なUIライブラリ
    → shadcn/uiの基本コンポーネントのみ。プロジェクトに合わせてカスタマイズ

必要なのは堅牢な幹(アーキテクチャ)と明確なルール(フォルダ構造)。あとはAIに機能を追加させればいい。

📂 プロジェクト構造

LineBot-liff-golang-nextjs-template/
├── common/              # 共通Golangパッケージ(Go Workspace)
│   ├── llm/            # Geminiクライアント
│   ├── models/         # データモデル
│   ├── repository/     # Supabaseアクセス層
│   └── mage/           # ビルドタスク
├── backend/            # Backend API
├── line_bot/           # LINE Bot Service
├── liff/               # LIFF App(Next.js)
└── supabase/           # DBマイグレーション
    └── migrations/

各サービスがDockerコンテナ化済み、任意のクラウド環境にデプロイ可能

同期の流れ:

  1. LINE Botでメッセージ受信 → LINE User IDで会話をSupabaseに保存
  2. LIFFアプリを開く → Supabase認証でLINE User ID取得 → 同じIDで会話履歴を取得
  3. 結果: 完全に同期された状態で表示

🎓 まとめ

AI時代だからこそ、整理されたFull Stack Templateが重要です。

**AIとFull Stack Templateを掛け合わせることで、テンプレートから開始 → AIで機能拡張 → 最速で本番環境へ

このテンプレートコードは、単なるサンプルコードではなく、実際のプロダクションで使える完全なシステムです。
皆さんのLINEアプリ開発を加速させることを願っています。

📚 参考リンク

💼 開発・運用サポート

このテンプレートを使った開発や、本番環境へのローンチ、運用について詳しく相談したい方へ:

フリーランスとして以下のサポートを提供しています:

  • 🛠️ カスタマイズ開発: テンプレートをベースにした独自機能の実装
  • 🚀 ローンチ支援: インフラ構築、デプロイ、本番環境セットアップ
  • 🔧 技術コンサルティング: アーキテクチャ設計、パフォーマンス最適化
  • 📊 運用サポート: モニタリング設定、障害対応、スケーリング戦略
  • 📚 技術研修: チーム向けのハンズオン研修、コードレビュー

お問い合わせ

お気軽にご相談ください!💪
(私が連絡に気が付きづらいため、複数媒体に連絡していただけると幸いです。)

プルリクエスト、Issue、スター、すべて歓迎します! 🚀
コメント・質問・プルリクエスト、はrepositoryのissueにて、お待ちしています! 🚀

13
6
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
13
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?