【初投稿】万年ダイエッターがAntigravityのバイブコーディングで、チャット感覚の食事管理アプリ「Log-Eats」を個人開発した話

はじめに：ワクッカです！

はじめまして！好奇心（ワクワク）と笑顔（クオッカ）を武器に、個人開発に挑戦しているワクッカ (Wakuqqa) と申します✌️

普段は大手製造業でビッグデータ活用サービスの企画職を2年ほどしています。データやITの「企画」には関わっているものの、モダンなWebフロントエンド技術を使ってゼロからWebサービスを作り上げるのは今回が初めての挑戦となる「初心者個人開発者」です。

記念すべき初投稿となる今回は、私が初めて開発したAI食事管理アプリ**「Log-Eats（ログイーツ）」**を作った経緯と、話題の「バイブコーディング」でどうやって公開まで漕ぎ着けたのか、その裏側について紹介させてください！

🔗 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」は、ログイン不要・無料で画像解析をお試しいただけます。
「どんな精度でカロリー計算されるの？」と気になった方は、ぜひ今日のランチの写真をアップロードして遊んでみてください！👇（スマホで「ホーム画面に追加」していただくとアプリのように使えます）

🔗 Log-Eatsを使ってみる

個人開発者の方、AI開発手法に興味がある方、ぜひ気軽にコメントやX（Twitter）で交流してもらえると嬉しいです✌️ これからよろしくお願いします！