◉GEMINI LABJP
●ARGON — gemini-4-argon is generally available as of 10/13, aimed at complex coding, agents, math and science●DEEP RES — deep-research-pro-preview-12-2025 shuts down 10/23, 6 days left. Move to deep-research-preview-04-2026●NANO — gemini-nano-banana-2.1 is GA (10/06). gemini-3.1-flash-image is deprecated with no shutdown date yet●MCP — One write-up cut an 85,000-token tool result to 310 tokens by wrapping it in an ADK FunctionTool●FLASH — gemini-3.7-flash and 3.5-flash now route automatically to newer Flash models (10/08)●NEW — Stop Re-Reading Every Crash Report: Gre…●ARGON — gemini-4-argon is generally available as of 10/13, aimed at complex coding, agents, math and science●DEEP RES — deep-research-pro-preview-12-2025 shuts down 10/23, 6 days left. Move to deep-research-preview-04-2026●NANO — gemini-nano-banana-2.1 is GA (10/06). gemini-3.1-flash-image is deprecated with no shutdown date yet●MCP — One write-up cut an 85,000-token tool result to 310 tokens by wrapping it in an ADK FunctionTool●FLASH — gemini-3.7-flash and 3.5-flash now route automatically to newer Flash models (10/08)●NEW — Stop Re-Reading Every Crash Report: Gre…
Articles/Dev Tools
⟐ Dev Tools/2026-06-30Advanced

Building an AI-Powered Content Site with Gemini API and Astro

Combine Astro Server Endpoints and Content Collections with the Gemini API to add AI summaries, related-article recommendations, and auto-tagging.

gemini-api285astrocontent-sitessrai-content

✦ Premium Article

"I'm running my blog on Astro, but every Gemini tutorial I find assumes Next.js with app/api." This is a question I've been hearing more and more lately. Astro leans toward static-first by design, so the standard Next.js patterns for AI features don't translate cleanly, and many developers get stuck.

I run a content site on Astro myself, and pairing it with the Gemini API has been a pleasant experience. You get to keep Astro's lightness and speed while adding AI summaries, related-article suggestions, and auto-tagging without much friction. This post walks through how I do it, with working code you can actually run.

Why Astro and Gemini API Pair Well

Astro is fundamentally a static site generator, but switching output to 'server' or 'hybrid' lets you opt individual pages into server execution. AI features that need per-request generation can use this targeted SSR — only the pages that need it pay the dynamic cost, and the rest of your site stays as fast as a pure static build.

What I particularly like is how Astro's Content Collections (src/content/) give you type-safe access to Markdown/MDX metadata. Pour Gemini-generated summaries and related tags into the schema, and your existing list and category pages just keep working.

For comparison, Next.js 15 App Router with Gemini API: The Complete Full-Stack covers a similar pattern in Next.js. Reading both side by side helps clarify the framework-specific tradeoffs.

Setup: Astro 5 in Hybrid Mode

Here's the minimal project setup, assuming Astro 5.

# Create a new project
npm create astro@latest my-ai-blog -- --template minimal --typescript strict
cd my-ai-blog
 
# Add the official Gemini SDK and Node adapter
npm install @google/genai
npx astro add node

Configure astro.config.mjs like this. Choosing output: 'hybrid' gives you static-by-default with opt-in SSR per page.

// astro.config.mjs
import { defineConfig } from 'astro/config';
import node from '@astrojs/node';
 
export default defineConfig({
  output: 'hybrid',         // Static by default, SSR where needed
  adapter: node({ mode: 'standalone' }),
  server: { port: 4321 },
});

Manage the API key via .env. Astro reads it through import.meta.env, but it's important to omit the PUBLIC_ prefix so it stays server-only.

# .env
GEMINI_API_KEY=YOUR_GEMINI_API_KEY
✦

Thank you for reading this far.

Continue Reading

What follows includes implementation code, benchmarks, and practical content we hope you'll find useful. This site runs without ads — server and development costs are supported entirely by members like you. If it's been helpful, we'd be truly grateful for your support.

WHAT YOU'LL LEARN
✦A decision framework for choosing per-request SSR, prebuild static, or hybrid generation by cost and latency
✦Auto-tagging that closes the vocabulary with a responseSchema enum to stop spelling drift and duplicate tag pages
✦Incremental embeddings keyed on a body hash so CI build time stays flat as your article count grows
Secure payment via Stripe · Cancel anytime
✦

Unlock This Article

Get full access to the rest of this article. Buy once, read anytime. This site is ad-free — your support goes directly toward keeping it running.

or
Unlock all articles with Membership →
Share

Thank You for Reading

Gemini Lab is ad-free, supported entirely by members like you. We publish practical guides daily with implementation code, benchmarks, and production-ready patterns. If you've found it useful, we'd love to have you on board.

  • ✦Copy-paste ready implementation code
  • ✦New advanced guides published daily
  • ✦$5/mo or $10 for lifetime access
View Membership →

Related Articles

⟐ Dev Tools2026-08-21
Why My Length Limit Only Failed on the English Notifications, and the Width-Based Fit That Replaced It
I had Gemini write push notifications in Japanese and English, and only the English ones came out truncated on real devices. The culprit was measuring length in characters. Here are the measured widths and the post-generation fitting code that fixed it.
⟐ Dev Tools2026-08-10
Finding the questions your help docs never answer, by asking Gemini to write the quiz
When support keeps asking something your help page already covers, generate questions from that page and check whether the page alone can answer them. A two-pass audit pipeline with call design and cost math.
⟐ Dev Tools2026-04-18
Building Cross-Platform AI Desktop Apps with Gemini API and Tauri 2.0
A practical guide to building macOS, Windows, and Linux desktop AI apps using Tauri 2.0 and Gemini API. Learn secure API key management with a Rust backend, real-time streaming via Tauri's event system, and native OS integration with working production code.