The latest articles on DEV Community by LC3045 (@lc3045). https://dev.to/lc3045 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3824963%2F1ca90ab6-df87-45b0-9e10-58dce112981c.png https://dev.to/lc3045 en LC3045 Sun, 15 Mar 2026 06:41:12 +0000 https://dev.to/lc3045/building-sgstudypal-multimodal-ai-tutoring-with-gemini-25-flash-google-cloud-run-5872 https://dev.to/lc3045/building-sgstudypal-multimodal-ai-tutoring-with-gemini-25-flash-google-cloud-run-5872 <p>For the Gemini Live Agent Challenge, I wanted to solve a real-world problem: making homework engaging and accessible for students in Singapore. The result is <strong>SgStudyPal</strong>, an AI-powered tutoring platform that utilizes both real-time voice and multimodal image recognition to act as a personalized tutor.</p> <p>Here is a breakdown of how I built the infrastructure using Google's ecosystem.</p> <h3> The Tech Stack </h3> <ul> <li> <strong>Frontend:</strong> Next.js 14 (App Router), Tailwind CSS</li> <li> <strong>Backend:</strong> Node.js, Vercel AI SDK</li> <li> <strong>AI Models:</strong> Google Gemini 2.5 Flash (Multimodal) &amp; Gemini Live (WebSockets)</li> <li> <strong>Auth &amp; DB:</strong> Firebase Authentication &amp; Firestore</li> <li> <strong>Infrastructure:</strong> Google Cloud Run (Docker)</li> </ul> <h3> Architecture &amp; Google Cloud Integration </h3> <p>To ensure a highly scalable, stateful environment, I opted out of standard serverless edge functions and built a strict <strong>Multi-Stage Docker container</strong> deployed on <strong>Google Cloud Run</strong>.</p> <ol> <li> <strong>Multimodal Homework Help:</strong> Students can upload a photo of a complex math worksheet. The Next.js backend parses the image into a binary buffer and streams it securely to the <code>gemini-2.5-flash</code> model. By utilizing strict prompt engineering, the AI bypasses standard chat pleasantries and immediately breaks down the visual math problem step-by-step.</li> <li> <strong>Real-Time Video Tutor (Gwen):</strong> Using WebSockets, the app connects directly to the Gemini Live API, allowing students to have fluid, interruptible, low-latency audio/video conversations with their AI tutor.</li> </ol> <h3> Overcoming Deployment Challenges </h3> <p>Deploying a Turborepo Next.js app to Cloud Run requires careful environment variable management. To ensure Firebase client variables (<code>NEXT_PUBLIC_</code>) were securely baked into the production bundle while keeping Gemini API keys strictly isolated as runtime secrets, I implemented a 3-stage Docker build process (<code>deps</code>, <code>builder</code>, <code>runner</code>).</p> <p>By combining the low latency of Google Cloud Run with the incredible multimodal capabilities of Gemini 2.5 Flash, SgStudyPal transforms static worksheets into interactive, real-time learning experiences.</p> ai gemini googlecloud showdev