Web Uygulamalarında Hata İzleme (Error Tracking) Neden Önemli?

Kullanıcıların karşılaştığı JavaScript hatalarını konsol yerine merkezi bir sistemde toplamak, kesinti süresini ve müşteri kaybını minimuma indirir. Güçlü bir dijital strateji, sadece yeni özellik geliştirmeyi değil, mevcut sistemin kararlılığını canlı ortamda sürekli izlemeyi gerektirir.

Hata Yönetiminde Güncel Trendler

Session Replay: Hatadan hemen önceki kullanıcı etkileşimlerini video benzeri bir simülasyonla inceleme.
Distributed Tracing: Frontend ve backend servisleri arasındaki istek zincirini uçtan uca takip etme.
Otomatik Alert Gruplama: Aynı kök nedene bağlı alarmları yapay zeka ile tek başlıkta birleştirme.

Adım Adım Sentry Kurulum ve Entegrasyon Rehberi

Adım 1: Sentry Projesi ve DSN Tanımlama

Sentry hesabı açın. Yeni proje (Browser JS, React, Node.js vb.) oluşturun. Size verilen DSN (Data Source Name) anahtarını kaydedin.

Adım 2: SDK Kurulumu

Frontend projenize resmi SDK paketini ekleyin:

npm install --save @sentry/browser

Adım 3: Başlatma (Initialization)

Uygulamanızın giriş noktasına (örneğin index.js veya main.ts) başlatma kodunu ekleyin:

import * as Sentry from "@sentry/browser";

Sentry.init({
  dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",
  integrations: [new Sentry.BrowserTracing()],
  tracesSampleRate: 1.0,
  environment: process.env.NODE_ENV
});

Adım 4: Özel Hata ve Context Tanımlama

Kritik try-catch bloklarında manuel hata fırlatabilir veya kullanıcı bağlamı ekleyebilirsiniz:

try {
  criticalDatabaseOperation();
} catch (error) {
  Sentry.captureException(error);
}

// Kullanıcı bağlamı atama
Sentry.setUser({ id: "1234", email: "dev@example.com" });

Adım 5: Source Maps Yapılandırması

Minify edilmiş üretim (production) kodundaki yığın izlerini (stack trace) okunabilir kılmak için source map dosyalarını Sentry CLI veya Webpack/Vite eklentisi ile derleme anında Sentry sunucularına yükleyin.

Uygulama İçin Pratik İpuçları

Hassas kullanıcı verilerini (şifre, kredi kartı, PII) Sentry'ye göndermemek için beforeSend kancasını (hook) kullanarak verileri maskeleyin.

Sample Rate Ayarı: Yüksek trafikli uygulamalarda işlemci ve kota tasarrufu için tracesSampleRate değerini optimize edin (örn: 0.1 - %10).
Alert Kuralları: Slack veya e-posta bildirimlerini yalnızca yeni veya sıklığı artan hatalar için tetiklenecek şekilde filtreleyin.