For the New Year, New You Portfolio Challenge, I rebuilt my personal portfolio using Next.js 16, Google Gemini, and Google Cloud Run. This post walks through the design, architecture, AI features, and deployment setup behind sachi.dev, an open-source, production-ready portfolio.
This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI
About Me
Hi, I’m Sachi Goyal 👋
I’m a software developer who enjoys building functional, well-designed web applications. React and Next.js are my primary tools, and I usually reach for TailwindCSS and shadcn/ui when it comes to styling.
With this portfolio, my goal was to create something that feels personal but still production-grade. A place where I can write, showcase projects, and experiment with AI features without compromising performance, clarity, or maintainability.
Portfolio
The portfolio is deployed on Google Cloud Run and publicly accessible at:
- Cloud Run URL (challenge requirement): https://sachi-dev-809350176771.asia-southeast1.run.app
- Custom domain mapped to the same Cloud Run service: https://sachi.dev
The source code is fully open source:
https://github.com/sachigoyal/portfolio
Demo Video
Here’s a short walkthrough showing how the portfolio works, including the featured project modals and the Gemini-powered AI chat experience:
How I Built It
Tech Stack
- Framework: Next.js 16 (App Router) with React 19
- Language: TypeScript
- Runtime & Tooling: Bun
- Styling: Tailwind CSS v4, Radix UI, Framer Motion
- Content: Velite with MDX
- AI: Google Gemini API
- Deployment: Docker + Google Cloud Run (asia-southeast1)
Key Features
- Home page with intro, GitHub contribution heatmap, featured projects, and recent blogs
- Filterable and sortable projects page with categories
- Blog system with MDX, table of contents, search, filters, and year grouping
- Rich MDX components including code blocks, callouts, tabs, accordions, file trees, and math rendering
- Dynamic OpenGraph image generation and per-page metadata
- Light, dark, and system themes with persistence
- Animations across modals, tabs, and cards using Framer Motion
- Featured project modals that open on click, with built-in AI chat powered by Gemini
Google AI Usage
Google Gemini is integrated directly into the portfolio as a practical, scoped feature:
- Gemini powers a streaming AI chat inside featured project modals
- Conversations are context-aware and limited to the selected project
- Requests are rate-limited using Upstash Redis to ensure predictable usage
The goal was to make AI genuinely helpful. Visitors can ask questions about specific projects and get immediate, relevant answers without leaving the page.
Deployment on Cloud Run
The application is fully Dockerized and deployed using Cloud Build and Google Cloud Run.
A simplified deployment command looks like this:
gcloud run deploy sachi-dev \
--source . \
--region=asia-southeast1 \
--allow-unauthenticated \
--set-env-vars=GEMINI_API_KEY=...
I also configured custom domain mapping so the same Cloud Run service is accessible via both sachi.dev and www.sachi.dev. This keeps the deployment compliant with the challenge requirements while still using a personal domain.
What I'm Most Proud Of
AI that fits naturally
The Gemini integration is purposeful and contextual, not a generic chatbot.A clean and flexible content system
Velite and MDX make it easy to write, organize, and evolve content over time.Polished UI without unnecessary complexity
Search, filtering, theming, animations, and SEO all work together without feeling heavy.Production-ready infrastructure
Fully Dockerized, scalable, and running entirely on Google Cloud Run.
Thanks to the Google AI and DEV teams for organizing the challenge. Building this portfolio was a good opportunity to refine my workflow and ship something I plan to keep improving.
Top comments (1)
cool stuff 🔥