Bygge apper med Gemini 3.1 Pro: Utviklerveiledning for API, koding og Vibe Coding (2026)
← Tilbake til nyheter

Bygge apper med Gemini 3.1 Pro: Utviklerveiledning for API, koding og Vibe Coding (2026)

N

NxCode Team

11 min read

Bygge apper med Gemini 3.1 Pro: Utviklerveiledning for API, koding og Vibe Coding

19. februar 2026 — Gemini 3.1 Pro har nettopp blitt lansert, og det er en av de sterkeste kodingsmodellene som er tilgjengelige: 80,6 % på SWE-Bench Verified, 2887 Elo på LiveCodeBench, og et kontekstvindu på 1 million tokens til $2 per million input-tokens. Det er koding på toppnivå til en brøkdel av kostnaden.

Denne guiden er for utviklere som ønsker å begynne å bygge med den i dag. Vi dekker API-oppsett, kodeeksempler i Python og Node.js, tenkenivåer, kontekst-caching for kostnadsoptimalisering, og hvordan Gemini 3.1 Pro passer inn i arbeidsflyter for vibe coding.


Komme i gang

Alternativ 1: Google AI Studio (Gratis, ingen oppsett)

Den raskeste måten å prøve Gemini 3.1 Pro på:

  1. Gå til aistudio.google.com
  2. Logg inn med din Google-konto
  3. Velg Gemini 3.1 Pro Preview fra nedtrekksmenyen for modeller
  4. Begynn å skrive ledetekster

AI Studio er gratis med hastighetsbegrensninger — bra for prototyping og eksperimentering.

Alternativ 2: API-nøkkel (For å bygge apper)

  1. I AI Studio, gå til Get API KeyCreate API Key
  2. Lagre nøkkelen sikkert (aldri send den til kildekontroll)
  3. Installer SDK:
# Python
pip install google-genai

# Node.js
npm install @google/genai

Ditt første API-kall

Python

from google import genai

client = genai.Client(api_key="YOUR_API_KEY")

response = client.models.generate_content(
    model="gemini-3.1-pro-preview",
    contents="Write a Python function that finds the longest common subsequence of two strings. Include type hints and docstring."
)

print(response.text)

Node.js

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

const ai = new GoogleGenAI({ apiKey: "YOUR_API_KEY" });

const response = await ai.models.generateContent({
  model: "gemini-3.1-pro-preview",
  contents: "Write a TypeScript Express middleware that validates JWT tokens and extracts user info.",
});

console.log(response.text);

Med tenkenivåer

# Høy tenking for kompleks feilsøking
response = client.models.generate_content(
    model="gemini-3.1-pro-preview",
    contents="""
    This Go server has a race condition that causes intermittent 500 errors
    under load. Here's the relevant code:

    [paste your code here]

    Find the race condition and explain the fix.
    """,
    config={
        "thinking_config": {"thinking_level": "HIGH"}
    }
)

Koding med Gemini 3.1 Pro

Benchmark-kontekst

Før vi dykker ned i funksjonene, her er hvor Gemini 3.1 Pro står blant kodingsmodeller:

BenchmarkGemini 3.1 ProGPT-5.3-CodexClaude Opus 4.6
SWE-Bench Verified80,6 %76,2 %72,6 %
Terminal-Bench 2.068,5 %77,3 %
LiveCodeBench Pro2887 Elo

Det er en forbedring på 15 % over de beste Gemini 3 Pro Preview-kjøringene, ved å bruke færre output-tokens for å produsere bedre resultater.

Kodegenerering

Gemini 3.1 Pro genererer kode av produksjonskvalitet på tvers av språk. Kontekstvinduet på 1 million tokens betyr at du kan inkludere din eksisterende kodebase for kontekstbevisst generering:

# Last inn konteksten fra din kodebase
with open("codebase_context.txt", "r") as f:
    codebase = f.read()

response = client.models.generate_content(
    model="gemini-3.1-pro-preview",
    contents=f"""
    Here is my current codebase:

    {codebase}

    Add a new API endpoint POST /api/users/bulk-import that:
    - Accepts a CSV file upload
    - Validates each row against the User schema
    - Inserts valid records in batches of 100
    - Returns a summary of successes and failures
    - Follow the existing patterns and coding style
    """,
    config={
        "thinking_config": {"thinking_level": "MEDIUM"}
    }
)

Feilsøking

Send inn feillogger, stack-tracer og kildekode sammen. Det høye tenkenivået er verdt den ekstra kostnaden for komplekse feil:

response = client.models.generate_content(
    model="gemini-3.1-pro-preview",
    contents="""
    Error: Connection pool exhausted after 30 seconds
    Stack trace:
    [paste stack trace]

    Relevant source files:
    [paste db.py, connection_pool.py, api_handler.py]

    This only happens under concurrent requests (>50 rps).
    Find the root cause.
    """,
    config={
        "thinking_config": {"thinking_level": "HIGH"}
    }
)

Kodegjennomgang (Code Review)

Middels tenkenivå gir balanserte gjennomganger uten å overanalysere triviell kode:

response = client.models.generate_content(
    model="gemini-3.1-pro-preview",
    contents=f"""
    Review this pull request diff for:
    1. Bugs or logic errors
    2. Security vulnerabilities (SQL injection, XSS, etc.)
    3. Performance issues
    4. Adherence to project conventions

    Diff:
    {diff_content}
    """,
    config={
        "thinking_config": {"thinking_level": "MEDIUM"}
    }
)

Fordelen med 1 million tokens kontekst

Gemini 3.1 Pros kontekstvindu på 1 million tokens endrer hvordan du samhandler med kode. I stedet for å mate den med små utsnitt, kan du laste inn hele prosjekter.

Referanse for kontekststørrelse

Hva du kan laste innOmtrentlig antall tokens
Enkeltfil (500 linjer)~2K tokens
Lite prosjekt (50 filer)~100K tokens
Mellomstort prosjekt (200 filer)~400K tokens
Stort prosjekt (500 filer)~1M tokens

Analyse av hele kodebasen

import os

def load_codebase(root_dir, extensions=('.py', '.js', '.ts', '.jsx', '.tsx')):
    """Load all source files into a single context string."""
    files = []
    for dirpath, _, filenames in os.walk(root_dir):
        for filename in filenames:
            if any(filename.endswith(ext) for ext in extensions):
                filepath = os.path.join(dirpath, filename)
                with open(filepath, 'r', errors='ignore') as f:
                    content = f.read()
                files.append(f"=== {filepath} ===\n{content}\n")
    return "\n".join(files)

codebase = load_codebase("./src")

response = client.models.generate_content(
    model="gemini-3.1-pro-preview",
    contents=f"""
    Analyze this entire codebase and identify:
    1. Architectural issues or anti-patterns
    2. Dead code that can be removed
    3. Functions that should be refactored
    4. Missing error handling at system boundaries

    Codebase:
    {codebase}
    """
)

Dette er noe du rett og slett ikke kan gjøre med modeller som har 200K kontekst uten å dele opp koden og miste kontekst på tvers av filer.


Tenkenivåer: Lav, Middels, Høy

Tenkenivåer lar deg kontrollere avveiningen mellom kostnad og kvalitet per forespørsel.

NivåBruksområderToken-tilleggKostnadspåvirkning
LavAutofullføring, enkle oppslag, formatering, klassifiseringMinimalt~1x
MiddelsKodegjennomgang, oppsummering, moderat analyse, innholdsgenereringModerat~2-3x
HøyKompleks feilsøking, flertrinns resonnering, arkitekturbeslutningerBetydelig~5-10x

Praktiske retningslinjer

  • Lav: "Konverter denne JSON-filen til et TypeScript-grensesnitt" — ingen dyp resonnering nødvendig.
  • Middels: "Se gjennom denne PR-en for feil og sikkerhetsproblemer" — krever analyse, men ikke uttømmende.
  • Høy: "Dette distribuerte systemet har en periodisk konsistensfeil under belastning. Her er 15 filer..." — krever dyp resonnering over flere filer.
# Bytt tenkenivå basert på oppgavens kompleksitet
def ask_gemini(prompt, complexity="medium"):
    levels = {"low": "LOW", "medium": "MEDIUM", "high": "HIGH"}

    return client.models.generate_content(
        model="gemini-3.1-pro-preview",
        contents=prompt,
        config={
            "thinking_config": {"thinking_level": levels[complexity]}
        }
    )

Kostnadsoptimalisering

Kontekst-caching

Hvis appen din gjentatte ganger spør den samme kodebasen eller dokumentasjonen, reduserer kontekst-caching input-kostnadene med 75 %:

PrisingStandardCachet
Input (per 1M tokens)$2,00$0,50
Output (per 1M tokens)$12,00$12,00
# Opprett en cachet kontekst for din kodebase
cached_content = client.caches.create(
    model="gemini-3.1-pro-preview",
    contents=[{"role": "user", "parts": [{"text": codebase}]}],
    ttl="3600s"  # Cache i 1 time
)

# Etterfølgende spørringer bruker den cachede konteksten
response = client.models.generate_content(
    model="gemini-3.1-pro-preview",
    contents="Find all SQL injection vulnerabilities in this codebase",
    cached_content=cached_content.name
)

Kostnadssammenligning for en kodingsarbeidsflyt

Forutsatt 500K tokens med kodebasekontekst + 1K spørring, 100 spørringer per dag:

StrategiDaglig kostnad
Gemini 3.1 Pro (uten caching)~$100
Gemini 3.1 Pro (med caching)~$27
Claude Opus 4.6 (uten caching)~$750

Flere optimaliseringstips

  1. Riktig tenkenivå: Bruk Lav for 80 % av oppgavene, Middels for 15 %, Høy for 5 %.
  2. Samle lignende forespørsler: Grupper kodegjennomgangsoppgaver for å fordele kostnaden ved kontekstinnlasting.
  3. Cache aggressivt: Hvis du spør de samme dokumentene/koden mer enn 3 ganger, bruk cache.
  4. Bruk Gemini 3 Flash for enkle oppgaver som ikke trenger resonnering på Pro-nivå.

Vibe Coding med Gemini 3.1 Pro

Vibe coding er praksisen med å beskrive hva du vil ha i naturlig språk og la AI generere koden. Gemini 3.1 Pro er spesielt sterk her fordi den forstår designintensjon, ikke bare syntaks.

Hvordan Gemini forstår "Viben"

Hostingers team bemerket at Gemini 3.1 Pro oversetter "retning, stil og produktintensjon" til kode. Da den ble bedt om å bygge en porteføljeside med et stemningsfullt litterært tema, resonnerte den seg gjennom den atmosfæriske tonen for å designe et matchende grensesnitt.

SVG-generering

En unik funksjon: Gemini 3.1 Pro genererer animerte SVG-er direkte fra tekstbeskrivelser. Siden SVG-er er kode, forblir de skarpe i alle oppløsninger:

response = client.models.generate_content(
    model="gemini-3.1-pro-preview",
    contents="""
    Create an animated SVG logo for a tech startup called "Pulse AI".
    Design requirements:
    - Minimalist, modern style
    - Blue-to-purple gradient
    - Subtle pulse animation on the icon
    - 200x60px viewport
    - Clean, sharp edges
    """
)

# Lagre SVG-en direkte
with open("logo.svg", "w") as f:
    f.write(response.text)

Bygge komplette apper

Kombiner Gemini 3.1 Pros kodestyrke med en AI-appbygger som NxCode for å gå fra idé til distribuert app:

  1. Beskriv appen din i naturlig språk.
  2. Gemini genererer kodebasen (frontend + backend + database).
  3. Se gjennom og iterer med ledetekster for vibe coding.
  4. Distribuer direkte til produksjon.

Denne arbeidsflyten er spesielt kraftfull fordi Geminis kontekstvindu på 1 million tokens kan inneholde hele den voksende kodebasen mens du itererer.


Plattformintegrasjon

GitHub Copilot

Gemini 3.1 Pro er nå tilgjengelig i GitHub Copilot:

  1. Åpne innstillingene i GitHub Copilot.
  2. Velg Gemini 3.1 Pro fra modellvelgeren.
  3. Bruk innebygd fullføring og chat som vanlig.

Gemini CLI

For terminalbasert utvikling:

# Installer
npm install -g @anthropic-ai/gemini-cli

# Bruk
gemini --model gemini-3.1-pro-preview "Refactor this function to use async/await"

# Send kode inn via pipe
cat src/server.js | gemini --model gemini-3.1-pro-preview "Review this code"

VS Code

Tilgjengelig gjennom Copilot-utvidelsen. Velg Gemini 3.1 Pro i modellmenyen for innebygde forslag og chat.

Google Antigravity

Googles plattform for agentbasert utvikling med dyp Gemini-integrasjon. Best for å bygge komplekse AI-agenter i flere trinn som trenger verktøybruk og langvarige arbeidsflyter.


Tips og beste praksis

  1. Start med middels tenking, og eskaler bare til høy når det er nødvendig — sparer 3-5 ganger på tokens.
  2. Last inn full kontekst med en gang — Gemini håndterer 1 million tokens godt; ikke forhåndsfiltrer aggressivt.
  3. Bruk kontekst-caching for alle gjentatte analyser (kodegjennomgang, spørsmål og svar om dokumenter, testgenerering).
  4. Vær spesifikk om utdataformatet — "Returner bare koden, ingen forklaring" sparer output-tokens.
  5. Kombiner med Gemini 3 Flash for et to-lags system: Flash for enkle fullføringer, Pro for kompleks resonnering.
  6. Inkluder eksempler i ledetekstene dine — Gemini 3.1 Pro følger mønstre godt.
  7. Spesifiser språk og rammeverk eksplisitt — "Skriv i TypeScript med Next.js 15 og App Router".
  8. Se over generert kode — 80,6 % på SWE-Bench er imponerende, men ikke 100 %. Test og se alltid gjennom koden.

Konklusjon

Gemini 3.1 Pro gir utviklere kodingskapasiteter på toppnivå til budsjettvennlige priser. Kontekstvinduet på 1 million tokens er en genuin 'game-changer' for analyse på kodebasenivå, og tenkenivåene gir finkornet kontroll over kostnad og kvalitet.

For mer om hvordan AI endrer utvikling, sjekk ut vår vibe coding-guide og vår sammenligning av Cursor vs Windsurf vs Claude Code. Og for en fullstendig gjennomgang av Gemini 3.1 Pros evner utover koding, se vår komplette guide.

Tilbake til alle nyheter
Likte du denne artikkelen?

Bygg med NxCode

Gjør ideen din til en fungerende app — ingen koding nødvendig.

46 000+ utviklere bygget med NxCode denne måneden

Prøv selv

Beskriv hva du vil ha — NxCode bygger det for deg.

46 000+ utviklere bygget med NxCode denne måneden