【初投稿】万年ダイエッターがAntigravityのバイブコーディングで、チャット感覚の食事管理アプリ「Log-Eats」を個人開発した話
はじめに：ワクッカです！
はじめまして！好奇心（ワクワク）と笑顔（クオッカ）を武器に、個人開発に挑戦しているワクッカ (Wakuqqa) と申します✌️
普段は大手製造業でビッグデータ活用サービスの企画職を2年ほどしています。データやITの「企画」には関わっているものの、モダンなWebフロントエンド技術を使ってゼロからWebサービスを作り上げるのは今回が初めての挑戦となる「初心者個人開発者」です。
記念すべき初投稿となる今回は、私が初めて開発したAI食事管理アプリ**「Log-Eats（ログイーツ）」**を作った経緯と、話題の「バイブコーディング」でどうやって公開まで漕ぎ着けたのか、その裏側について紹介させてください！
開発のきっかけ：続かないダイエットと「モノづくり」への憧れ
私はこれまで、何度もダイエットに挑戦しては**リバウンドを繰り返す「万年ダイエッター」**でした。
食事管理アプリをインストールしてみるものの、「食材を検索して」「グラム数を量って入力して」という毎回の記録がとにかく面倒で、数日で挫折してしまうのがお決まりのパターン。
一方で、企画職として働く中で**「自分でも何か手触りのあるサービスを作ってみたい！」**という強い思い（好奇心）がずっとありました。
「どうせ作るなら、自分が一番欲しいものを作ろう」
「面倒な食事記録を、AIの力で極限までラクにできないか？」
そんな思いから、AIを活用した食事管理アプリの開発を決意しました。
開発手法：Antigravityによる「バイブコーディング」初挑戦
これまでAIコードエディタの「Cursor」は、業務で使用するPythonのちょっとした修正などで使うことはありました。しかし今回は、ゼロからのアプリ開発。そこで、自然言語による指示を中心にコーディングを進める**「Antigravity」を使用したバイブコーディング（Vibe Coding）に初挑戦**しました。
企画職の私にとって、モダンなフロントエンド技術は未知の領域でしたが、AIと常に対話し、思い描いたUIや機能を「言葉（バイブス）」で伝え、提案されたコードを試すというプロセスを繰り返しました。思い通りに動かず試行錯誤の連続でしたが、泥臭くAIと格闘し、なんとかアプリ公開まで漕ぎ着けることができました。
採用した技術スタック
Qiitaらしく、今回のアプリを支えている技術構成も紹介します。モダンな次世代Webフロントエンド技術とAIを組み合わせた、フルスタックのサーバーレス構成です。
| カテゴリ | 技術 / サービス |
|---|---|
| コア | Next.js (App Router) / TypeScript |
| UI / スタイリング | Tailwind CSS / daisyUI / Recharts |
| 認証 | Clerk (ソーシャルログイン対応) |
| DB / ストレージ | Vercel Postgres / Vercel Blob |
| インフラ | Vercel |
| AI (機能の核) | Google GenAI (Gemini) / OpenAI |
開発したアプリ「Log-Eats」のご紹介
こうして完成したのが、面倒な食事管理をラクに、楽しくするアプリ「Log-Eats」です。
🌟 Log-Eatsの推しポイント
-
まるでLINEのようなチャット記録UI
最新のアップデート（v1.4）で、記録画面をチャット形式に大きく進化させました。AIアシスタントと自然なやり取りをしながら記録でき、時間帯（朝・昼・夜）によってAIからの労いの言葉も変わります。 -
写真やテキストから瞬時にAI解析
手入力の面倒な栄養素検索は不要です。料理の写真をアップロードするか、「ざるそば1枚と唐揚げ2個」のようにテキストを打つだけで、AIが瞬時にカロリーとPFC（タンパク質・脂質・炭水化物）を自動計算します。 -
「ご飯は半分残した」などの柔軟な補正
あとから自然言語で「ご飯は半分しか食べていない」と修正指示を出すと、AIが空気を読んで再計算してくれます。これが個人的に一番欲しかった機能です！ -
栄養素の目標許容幅を設定可能に
カロリーやPFCの目標値に対して、「±〇〇%以内なら達成とする」という許容幅が設定できます。ぴったり合わせるのが難しい目標も、自分に合った幅で無理なく管理できるように工夫しました。
おわりに
初心者ならではの壁に何度もぶつかりながらも、バイブコーディングという新しい体験を通して自分の「欲しい」を形にできたことは、とてもワクワクする体験でした。これからも、日常の「ちょっと面倒」を解決するサービスを泥臭く作って発信していきたいと思っています。
「Log-Eats」は、ログイン不要・無料で画像解析をお試しいただけます。
「どんな精度でカロリー計算されるの？」と気になった方は、ぜひ今日のランチの写真をアップロードして遊んでみてください！👇（スマホで「ホーム画面に追加」していただくとアプリのように使えます）
個人開発者の方、AI開発手法に興味がある方、ぜひ気軽にコメントやX（Twitter）で交流してもらえると嬉しいです✌️ これからよろしくお願いします！