Firebase Studio: Agent Mode, MCP ve Gemini CLI

# Firebase Studio: Agent Mode, MCP ve Gemini CLI

Google, Project IDX olarak başlayan bulut tabanlı geliştirme ortamını 2025'te Firebase Studio olarak yeniden markalaştırdı ve kapsamını dramatik şekilde genişletti. Artık sadece bir cloud IDE değil — AI agent mode ile otonom kod yazabilen, MCP (Model Context Protocol) server'ları ile harici araçlara bağlanabilen ve Gemini CLI ile terminal'den AI gücünü kullanabilen tam teşekküllü bir geliştirme platformu. Firebase Studio'nun tüm yeteneklerini, agent mode'un nasıl çalıştığını, MCP entegrasyonunu ve Gemini CLI'ın production workflow'larına entegrasyonunu derinlemesine ele alıyoruz.

💡 Not: Firebase Studio, Google I/O 2025'te duyuruldu ve sürekli güncelleniyor. Bu yazı Şubat 2026 itibarıyla güncel. Erişim: firebase.studio. Resmi dokümantasyon: Firebase Docs, MCP standartı: MCP Spec.

İçindekiler

• IDX'ten Firebase Studio'ya
• Cloud Workspace Mimarisi
• Agent Mode: Otonom Geliştirme
• MCP Server Entegrasyonu
• Gemini CLI
• App Prototyping
• Firebase Entegrasyonu
• Production Workflow'ları
• Sonuç ve Öneriler

IDX'ten Firebase Studio'ya

Project IDX, Google'ın 2023'te başlattığı bulut tabanlı geliştirme ortamıydı. 2025'te Firebase ailesine katılarak çok daha güçlü bir platforma dönüştü.

Evrim Zaman Çizelgesi

IDE vs Firebase Studio

Cloud Workspace Mimarisi

Firebase Studio, Nix tabanlı tekrarlanabilir geliştirme ortamları kullanır. Ekipteki herkes aynı environment'ta çalışır — "benim makinemde çalışıyor" problemi ortadan kalkar.

Firebase Studio Temel Yapılandırması

\\\`json

{

"studio": {

"name": "my-portfolio-project",

"region": "us-central1",

"framework": "nextjs",

"nodeVersion": "20"

},

"mcpServers": {

"firebase": {

"command": "npx",

"args": ["-y", "firebase-mcp-server"],

"env": { "FIREBASE_PROJECT_ID": "my-project-id" }

},

"supabase": {

"command": "npx",

"args": ["-y", "@supabase/mcp-server"],

"env": {

"SUPABASE_URL": "https://xxx.supabase.co",

"SUPABASE_SERVICE_ROLE_KEY": "eyJ..."

}

}

},

"agentMode": {

"enabled": true,

"autoApprove": false,

"contextFiles": ["ARCHITECTURE.md", "CLAUDE.md"]

}

}

\\\`

Bu yapılandırma dosyasını \.firebase-studio/config.json\ olarak kaydet. \autoApprove: false\ ile agent'ın yaptığı her değişikliği onaylamanı gerektirir — production projelerinde kesinlikle kapalı bırak.

Workspace Yapılandırması

\\\`nix

# .idx/dev.nix

{ pkgs, ... }: {

# Dil desteği

packages = [

pkgs.nodejs_20

pkgs.nodePackages.firebase-tools

pkgs.python312

pkgs.go_1_22

pkgs.rustc

pkgs.cargo

];

# IDE ayarları

idx = {

extensions = [

"bradlc.vscode-tailwindcss"

"esbenp.prettier-vscode"

"dbaeumer.vscode-eslint"

];

# Preview yapılandırması

previews = {

enable = true;

previews = {

web = {

command = ["npm" "run" "dev" "--" "--port" "$PORT"];

manager = "web";

};

android = {

command = ["flutter" "run" "--machine" "-d" "emulator"];

manager = "flutter";

};

};

};

# Workspace açılışında çalışacak komutlar

workspace = {

onCreate = {

install = "npm install";

setup-firebase = "firebase login --no-localhost";

};

onStart = {

dev-server = "npm run dev";

};

};

};

}

\\\`

Template Galerisi

Firebase Studio, 50+ hazır template sunuyor:

• Next.js: — App Router, Tailwind, TypeScript
• Flutter: — Material 3, Firebase entegre
• Angular: — Standalone components, Signals
• React Native: — Expo, Firebase
• Python: — FastAPI, Flask, Django
• Go: — Gin, Echo
• Genkit: — AI flow template

🔍 Pro Tip: Template'den başla ama hemen \.idx/dev.nix\ dosyasını özelleştir. Ekibinin kullandığı tüm araçları (linter, formatter, CLI tool) buraya ekle. Böylece yeni katılan biri 30 saniyede tam çalışan ortama sahip olur.

Agent Mode: Otonom Geliştirme

Firebase Studio'nun en devrimsel özelliği Agent Mode. Gemini tabanlı bu agent, sadece kod tamamlama yapmaz — bağımsız olarak kod yazar, dosya oluşturur, terminal komutu çalıştırır ve test eder.

Agent Mode Yetenekleri

• Kod oluşturma: — "Bu API için CRUD endpoint'leri yaz" → 4 dosya oluşturur
• Refactoring: — "Bu fonksiyonu async/await'e çevir" → tüm çağrı zincirini günceller
• Bug fix: — Hata mesajını yapıştır → sorunu bulur ve düzeltir
• Test yazma: — "Bu servis için unit testler yaz" → test dosyası oluşturur
• Dokümantasyon: — "Bu modülü dokümante et" → JSDoc/docstring ekler
• Terminal: — Gerektiğinde npm install, build, test komutları çalıştırır

Örnek Agent Etkileşimi

\\\`text

👤 Kullanıcı: "Bu Next.js projesine dark mode desteği ekle.

Tailwind CSS kullanıyoruz. Tercih localStorage'da saklanmalı."

🤖 Agent: Analiz ediyorum...

Plan:

1. next-themes paketini kurulum → npm install next-themes
2. tailwind.config.ts → darkMode: 'class' ekle
3. ThemeProvider component oluştur → src/components/theme-provider.tsx
4. Root layout'a ThemeProvider ekle → src/app/layout.tsx
5. Theme toggle butonu oluştur → src/components/theme-toggle.tsx
6. Header'a toggle ekle → src/components/header.tsx

Onaylıyor musun?

👤 Kullanıcı: Evet, devam et

🤖 Agent: [6 dosya oluşturuyor/düzenliyor, npm install çalıştırıyor]

✅ Tamamlandı. Dark mode eklendi:

• next-themes entegre edildi
• localStorage'da 'theme' key'inde saklanıyor
• Sistem tercihini otomatik algılıyor
• Toggle butonu header'ın sağ üstünde

\\\`

Agent Mode Kullanım İpuçları

1. Net talimat ver — "Login sayfası yap" yerine "Email/şifre login + Google OAuth + şifremi unuttum"
2. Bağlam sağla — Projenin mimarisini anlat, hangi pattern kullandığını belirt
3. Adım adım ilerle — Büyük görevleri küçük parçalara böl
4. Review et — Agent'ın yazdığı kodu MUTLAKA kontrol et

MCP Server Entegrasyonu

Model Context Protocol (MCP), AI araçlarının harici veri kaynaklarına ve araçlara bağlanmasını standartlaştıran bir protokol. Firebase Studio, MCP server'larını native olarak destekliyor.

MCP Nedir?

MCP, Anthropic tarafından geliştirilen açık bir standarttır. AI model'in (client) harici bir araca (server) bağlanmasını sağlar. MCP Protokolü yazımızda bu standartı detaylıca ele almıştık, Claude Code MCP yazımızda ise Claude ile MCP entegrasyonunu incelemiştik:

• Resources: — Okuma amaçlı veri kaynakları (DB, dosya, API)
• Tools: — Aksiyon alabilen araçlar (deploy, build, query)
• Prompts: — Önceden tanımlı prompt template'leri

Firebase Studio'da MCP Yapılandırması

\\\`json

{

"mcpServers": {

"supabase": {

"command": "npx",

"args": ["-y", "@supabase/mcp-server"],

"env": {

"SUPABASE_URL": "https://xxx.supabase.co",

"SUPABASE_SERVICE_ROLE_KEY": "eyJ..."

}

},

"firebase": {

"command": "npx",

"args": ["-y", "firebase-mcp-server"],

"env": {

"FIREBASE_PROJECT_ID": "my-project"

}

},

"github": {

"command": "npx",

"args": ["-y", "@github/mcp-server"],

"env": {

"GITHUB_TOKEN": "ghp_..."

}

},

"sentry": {

"command": "npx",

"args": ["-y", "@sentry/mcp-server"],

"env": {

"SENTRY_AUTH_TOKEN": "sntrys_..."

}

}

}

}

\\\`

MCP ile Çalışma Örnekleri

\\\`text

👤 "Supabase'deki users tablosunun şemasını göster"

🤖 [MCP: supabase.getSchema('users')] →

id: uuid, email: text, name: text, created_at: timestamptz

👤 "Son 7 günde kayıt olan kullanıcı sayısı?"

🤖 [MCP: supabase.query("SELECT COUNT(*) FROM users WHERE created_at > NOW() - INTERVAL '7 days'")]

→ 342 yeni kullanıcı

👤 "Sentry'de bugün açılan critical hatalar?"

🤖 [MCP: sentry.getIssues({ level: 'critical', since: 'today' })]

→ 2 critical hata: NullPointerException (23 event), TimeoutException (8 event)

👤 "GitHub'daki açık PR'ları listele"

🤖 [MCP: github.listPullRequests({ state: 'open' })]

→ 5 açık PR: #142 dark-mode, #139 fix-auth, ...

\\\`

🔍 Pro Tip: MCP server'ları ile Agent Mode'u birleştir. "Sentry'deki en sık crash'i bul, kodu analiz et ve fix PR'ı oluştur" gibi end-to-end workflow'lar mümkün. Mobile DevOps yazımızdaki CI/CD pipeline'larını MCP ile güçlendir.

Gemini CLI

Gemini CLI, terminal'den Gemini modellerine erişim sağlayan komut satırı aracı. Firebase Studio'nun dışında da kullanabilirsin.

Kurulum ve Kullanım

\\\`bash

# Kurulum

npm install -g @google/gemini-cli

# Veya npx ile

npx @google/gemini-cli

# Temel kullanım

gemini "Bu Go kodundaki race condition'ı bul"

# Dosya ile

gemini "Bu dosyadaki bug'ı düzelt" --file src/api/handler.go

# Pipe ile

cat error.log | gemini "Bu logdaki hata nedir ve nasıl düzeltilir?"

# Interaktif mod

gemini --interactive

\\\`

Gemini CLI Komutları

CI/CD'de Gemini CLI

\\\`yaml

# .github/workflows/ai-review.yml

name: AI Code Review

on:

pull_request:

types: [opened, synchronize]

jobs:

review:

runs-on: ubuntu-latest

steps:

- uses: actions/checkout@v4

- name: Get diff

id: diff

run: |

git fetch origin ${{ github.base_ref }}

git diff origin/${{ github.base_ref }}...HEAD > diff.txt

- name: AI Review

run: |

npx @google/gemini-cli \

--file diff.txt \

"Bu kod değişikliğini incele. Potansiyel bug, performans sorunu ve güvenlik açığı var mı?" \

> review.md

- name: Comment PR

uses: actions/github-script@v7

with:

script: |

const fs = require('fs');

const review = fs.readFileSync('review.md', 'utf8');

github.rest.issues.createComment({

issue_number: context.issue.number,

owner: context.repo.owner,

repo: context.repo.repo,

body: '## 🤖 AI Code Review\n\n' + review,

});

\\\`

App Prototyping

Firebase Studio'nun App Prototyping özelliği ile doğal dil komutlarıyla tam çalışan uygulama prototipi oluşturabilirsin:

Prototip Oluşturma

\\\`text

👤 "Restoran sipariş uygulaması oluştur:

- Menü listesi (kategorili)

- Sepet yönetimi

- Sipariş takibi

- Firebase Auth ile giriş

- Firestore ile veri yönetimi

- Tailwind ile modern tasarım"

🤖 [Next.js + Firebase + Tailwind projesi oluşturuyor]

✅ 12 dosya oluşturuldu

✅ Firebase config ayarlandı

✅ Auth + Firestore entegre

✅ 4 sayfa: Menü, Sepet, Siparişlerim, Profil

✅ Responsive tasarım

✅ Preview URL: https://xxx.web.app

\\\`

Prototip'ten Production'a

1. Prototip oluştur — Doğal dil ile
2. Customize et — Agent Mode ile detayları ayarla
3. Firebase bağla — Native entegrasyon ile
4. Test et — Testing Agent ile
5. Deploy et — Firebase Hosting'e tek tık

Firebase Entegrasyonu

Firebase Studio, tüm Firebase servislerini native olarak destekler:

Native Firebase Özellikleri

• Authentication: — Kullanıcı yönetimi UI'dan
• Firestore: — Veri görüntüleme ve düzenleme
• Hosting: — Tek tık deploy
• Cloud Functions: — Inline deploy ve test
• App Check: — Yapılandırma
• Remote Config: — Değer güncelleme
• Analytics: — Dashboard görüntüleme

Emülatör Desteği

Firebase Studio içinde Firebase Emulator Suite çalıştırabilirsin. Local emülatörler yerine cloud ortamda test — aynı sonuç ama sıfır kurulum.

Production Workflow'ları

Takım Çalışması

\\\`text

Senaryo: 3 kişilik takım, aynı proje

1. Her geliştirici kendi workspace'inde çalışır (izole ortam)
2. Git ile kod paylaşımı (branch-based)
3. MCP ile paylaşılan servislere erişim (Supabase, Firebase)
4. Agent Mode ile hız, human review ile kalite
5. Preview URL ile paydaşlara demo

\\\`

Güvenlik

• Workspace'ler izole (GCP VM)
• Secret'lar encrypted storage'da
• MCP token'ları workspace-scoped
• Agent Mode değişiklikleri review'a tabi

Sonuç ve Öneriler

Firebase Studio, geleneksel IDE + Cloud + AI'ı tek bir platformda birleştiriyor. Agent Mode ile otonom kod yazma, MCP ile harici araç entegrasyonu ve Gemini CLI ile terminal AI gücü — bunlar geliştirici verimliliğini katlıyor. Firebase Advanced yazımızdaki altyapı üzerine Firebase Studio workflow'ları inşa etmek, ekip verimliliğini dramatik artırır.

Öneriler

1. Agent Mode'a güven ama doğrula — Yazdığı kodu review et
2. MCP server'larını kur — DB, monitoring, CI/CD araçlarını bağla
3. Gemini CLI'ı CI/CD'ye ekle — Otomatik code review. Cursor AI ile birlikte kullanarak verimlilik katlayabilirsin
4. Template'den başla — Boş projeden başlama
5. Nix config'i versiyon kontrol et — Ekip tutarlılığı için