Building a personal portfolio is often a web developer’s favorite continuous project. Recently, I decided to completely revamp my portfolio into a Linux terminal-style interface, complete with a floating AI chat assistant. But I didn’t do it alone—I built the entire thing pair-programming with Antigravity, an advanced agentic coding assistant.

Here is a look at the experience of building with Antigravity, alongside the stack and architecture that powers this site.

The Stack

The technology stack was chosen for performance, flexibility, and ease of deployment:

• Astro: The core framework. Astro’s island architecture and stellar performance made it the perfect choice. It allows shipping zero JavaScript by default, which is ideal for a text-heavy terminal theme, while still supporting dynamic interactive islands where needed.
• Vanilla CSS: Instead of reaching for a utility framework, I used pure, semantic Vanilla CSS. This gave me the exact control needed to recreate the authentic, retro feel of a Linux terminal—using custom CSS variables for the classic green-on-black aesthetic, typewriter animations, and monospace fonts like JetBrains Mono.
• Vercel: For the backend and hosting. The project leverages Vercel because of its built-in support for Astro’s server mode, which was needed to run the SSR-based AI chat function securely. We moved the deployment to Vercel from Firebase for this seamless integration.
• OpenRouter API: The brain behind the custom floating AI chat widget integrated directly into the site.

The Architecture: Static Meets Dynamic

The architecture bridges the gap between a lightning-fast static site and a dynamic web application.

1. Hybrid Rendering (SSG + SSR)

Most of the portfolio—the home page, the about page, and the blog—is statically generated (SSG) at build time. This ensures maximum performance and SEO. However, the site also utilizes Astro’s Server-Side Rendering (SSR) capabilities to securely handle the OpenRouter API key and process chat widget requests without exposing secrets to the client.

2. The AI Chat Widget

One of the standout features is the persistent AI assistant.

• Secure Communication: The frontend communicates with a dedicated Astro backend API route (/api/chat).
• Persistence: The chat history and rate-limiting data are managed so that refreshing the browser doesn’t wipe out the user’s session or bypass rate limits.
• UI/UX: Designed as a floating widget that stays out of the way but is always ready to answer questions, fully styled to match the terminal aesthetic.

3. Vercel Deployment Integration

By deploying to Vercel, the CI/CD pipeline is entirely automated. We moved deployment to Vercel from Firebase specifically for the chat function’s SSR need; Vercel provides excellent in-built support for Astro’s server mode. From handling dependency resolution to managing the SSR backend securely, Vercel provides a robust infrastructure that scales effortlessly.

The Antigravity Experience

Using Antigravity wasn’t just about code generation—it was true pair programming. The agent handled everything from initializing the Git repository and generating base content from my CV, to executing complex CSS architectural shifts for the terminal theme and ensuring mobile responsiveness.

When we hit roadblocks, like the ERESOLVE npm errors during initial deployments, fixing how Markdown bold tags were rendered in the chat UI, or setting up persistent rate limiting, Antigravity debugged the issues in real-time, fetching context and executing terminal commands natively.

It fundamentally shifted the development rhythm. Instead of context-switching to look up Astro SSR documentation or Vercel configuration syntax, I could direct the high-level architecture while Antigravity executed the implementation. It’s an exhilarating way to build software.