DEV Community

Cover image for Building Generative AI Applications with Gemma 4 and Google AI Studio
Agbo, Daniel Onuoha
Agbo, Daniel Onuoha

Posted on

Building Generative AI Applications with Gemma 4 and Google AI Studio

Gemma 4 isn't limited to local self-hosting — Google AI Studio gives you a zero-setup way to prototype, test, and export working code before you ever touch a GPU. This article covers both sides: building real generative AI applications with Gemma 4, and using AI Studio as your fastest path from idea to working integration.

Building Generative AI Applications with Gemma 4

Gemma 4's combination of multimodal input, long context, and native function calling means it can act as the reasoning layer inside real backend systems, not just a chatbot.

Agentic Backend Services

Wire Gemma 4's function-calling directly into your API routes so the model decides which internal endpoint to call — checking a balance, triggering a bill payment, or looking up a shipment — instead of parsing free-text intent with regex or keyword matching. One developer demonstrated this end-to-end by feeding Gemma 4 a batch of 105 server logs with a single prompt: it wrote a Python script, hit an error, read the traceback, fixed the code, and re-ran it autonomously, entirely offline.

Sample: Node.js backend route using function-calling to check a balance

import { GoogleGenAI } from "@google/genai";

const client = new GoogleGenAI({ apiKey: process.env.GEMINI_API_KEY });

const checkBalance = async (accountId) => {
  return { accountId, balance: 42500.00, currency: "NGN" };
};

const tools = [{
  functionDeclarations: [{
    name: "check_balance",
    description: "Use ONLY when the user explicitly requests an account balance check.",
    parameters: {
      type: "OBJECT",
      properties: { accountId: { type: "STRING", description: "e.g. ACC-10293" } },
      required: ["accountId"]
    }
  }]
}];

app.post("/agent/chat", async (req, res) => {
  const response = await client.models.generateContent({
    model: "gemma-4-31b-it",
    contents: req.body.message,
    config: { tools }
  });

  const call = response.functionCalls?.[0];
  if (call?.name === "check_balance") {
    const result = await checkBalance(call.args.accountId);
    return res.json(result);
  }
  res.json({ reply: response.text });
});
Enter fullscreen mode Exit fullscreen mode

Document and Multimodal Processing

Gemma 4 accepts text, images, and audio as input across most variants, making it well suited for OCR-style pipelines that read scanned invoices, receipts, or ID documents and return structured data. Combined with its 128K-256K token context window, you can pass an entire document set or codebase in a single call rather than chunking manually.

Sample: Extracting structured data from a receipt image

from google import genai
from PIL import Image
import json

client = genai.Client(api_key="YOUR_API_KEY")
image = Image.open("receipt.jpg")

response = client.models.generate_content(
    model="gemma-4-31b-it",
    contents=[
        image,
        """Extract this receipt as JSON with fields:
        merchant, date, total_amount, currency.
        Return ONLY valid JSON, no explanation."""
    ]
)

data = json.loads(response.text)
print(data)
# {'merchant': 'Shoprite', 'date': '2026-07-01', 'total_amount': 15400, 'currency': 'NGN'}
Enter fullscreen mode Exit fullscreen mode

Local and Cloud RAG Pipelines

Pair Gemma 4 with a vector store (or the Gemini API's built-in Google Search grounding) to build retrieval-augmented assistants over your own documentation, transaction history, or knowledge base — either fully self-hosted for data sovereignty, or via the Gemini API when you want managed infrastructure without giving up Gemma's open-weight model.

Sample: Minimal RAG with a local vector store (Chroma) and self-hosted Gemma via Ollama

import ollama
import chromadb

chroma_client = chromadb.Client()
collection = chroma_client.create_collection("docs")

collection.add(
    documents=["Bill payments are processed within 24 hours.",
               "Account verification requires a valid ID and proof of address."],
    ids=["doc1", "doc2"]
)

def rag_answer(question):
    results = collection.query(query_texts=[question], n_results=2)
    context = "\n".join(results["documents"][0])
    prompt = f"<context>{context}</context>\nQuestion: {question}"
    response = ollama.chat(model="gemma4:e4b", messages=[{"role": "user", "content": prompt}])
    return response["message"]["content"]

print(rag_answer("How long does a bill payment take to process?"))
Enter fullscreen mode Exit fullscreen mode

Multilingual and Voice Interfaces

With native support for 140+ languages and audio input on the E2B/E4B models, Gemma 4 can power customer support or field-agent voice interfaces in local languages without a separate translation or speech-to-text layer bolted on.

Sample: Multilingual support reply generation

response = client.models.generate_content(
    model="gemma-4-26b-a4b-it",
    config={"system_instruction": "Reply in the same language the user writes in."},
    contents="Wetin dey happen to my transfer wey no show for account?"
)
print(response.text)
# Responds naturally in Nigerian Pidgin, matching the user's input language
Enter fullscreen mode Exit fullscreen mode

Coding Assistants

Tools like OpenCode can connect directly to Gemma 4 — either self-hosted via llama.cpp or through the Gemini API using an AI Studio-issued key — turning it into an offline or low-cost pair programmer for sensitive codebases.

Using Gemma 4 in Google AI Studio

Google AI Studio is the fastest way to try Gemma 4 with zero installation — no API key, no code, and no local hardware required for your first test.

Getting Started

  1. Go to aistudio.google.com and open the model picker
  2. Select gemma-4-26b-a4b-it or gemma-4-31b-it from the available models
  3. Type a prompt directly in the browser and start chatting
  4. Adjust system instructions, temperature, and other parameters through the same panel used for Gemini models
  5. Upload an image or audio clip to test Gemma 4's multimodal understanding directly in the chat interface

No credit card or API key is needed just to test prompts in the browser interface.

Exporting Code from a Conversation

Once you've refined a prompt in the chat interface, click Get Code to export a ready-to-run snippet in Python, JavaScript, or cURL — carrying over your exact system instructions, temperature, and message history into working code. This turns AI Studio into a prototyping step that feeds directly into your actual application, rather than a throwaway sandbox.

Using Gemma 4 via the Gemini API

To move beyond the browser, generate an API key from AI Studio's API Keys panel, then install the SDK:

pip install google-genai
Enter fullscreen mode Exit fullscreen mode
import os
from google import genai

client = genai.Client(api_key=os.environ["GEMINI_API_KEY"])

response = client.models.generate_content(
    model="gemma-4-31b-it",
    contents="Summarize this transaction log into 3 bullet points."
)

print(response.text)
Enter fullscreen mode Exit fullscreen mode

Setting a system instruction:

response = client.models.generate_content(
    model="gemma-4-31b-it",
    config={"system_instruction": "You are a concise fintech support assistant."},
    contents="Why was my last transfer declined?"
)
Enter fullscreen mode Exit fullscreen mode

Multi-turn conversations (the SDK tracks history automatically):

chat = client.chats.create(model="gemma-4-26b-a4b-it")
reply1 = chat.send_message("What documents do I need to verify my account?")
reply2 = chat.send_message("And how long does verification usually take?")
Enter fullscreen mode Exit fullscreen mode

Image understanding:

from PIL import Image

image = Image.open("receipt.jpg")
response = client.models.generate_content(
    model="gemma-4-31b-it",
    contents=[image, "Extract the total amount and date from this receipt."]
)
Enter fullscreen mode Exit fullscreen mode

Function calling works the same way as local transformers usage — define tools as function declarations, and the model decides when to call them based on the conversation.

Rate Limits to Know

The free tier through AI Studio's Gemini API currently allows around 15 requests per minute and up to 1,500 requests per day for Gemma 4 models — enough for prototyping and light production traffic, but plan to move to a paid tier or self-hosted deployment before scaling past that.

Choosing Between AI Studio and Self-Hosting

Factor Google AI Studio (Gemini API) Self-Hosted (Ollama/vLLM)
Setup time Minutes, no GPU needed Requires model download and runtime setup
Data control Sent to Google's API Fully local, no data leaves your infrastructure
Cost Free tier with rate limits, then usage-based Your own compute cost, no per-request billing
Best for Prototyping, quick integration, low-volume apps Regulated fintech data, high-volume production, offline use
Model sizes available gemma-4-26b-a4b-it, gemma-4-31b-it All sizes including E2B/E4B for edge

For a complex workflow like fintech, AI Studio is the fastest way to validate a prompt or agent design before committing to self-hosted infrastructure on EC2 — prototype the logic in the browser, export the code, then decide whether it stays on the Gemini API or gets ported to a self-hosted Gemma deployment for data sovereignty.

Top comments (0)