Web Uygulamalarında Hata İzleme Neden Kritik?

Kullanıcı hata görür, bildirmez; sayfayı terk eder. Hataları log dosyalarından aramak zaman kaybıdır. Modern dijital strateji, hataları anında yakalamayı ve çözmeyi gerektirir. Hata izleme (Error Tracking) araçları, runtime istisnalarını, stack trace ve kullanıcı oturum bağlamıyla kaydeder.

Modern Hata İzleme Trendleri

Real-time Alerting: Hatalar anında Slack, Teams veya e-posta ile bildirilir.
Session Replay: Kullanıcının hatadan önceki hareketleri video benzeri oynatılır.
Performance Monitoring: Yavaş API çağrıları ve frontend render gecikmeleri izlenir.
Distributed Tracing: Frontend hatasının backend servislerindeki kök nedeni tespit edilir.

Adım Adım Sentry Entegrasyon Rehberi

1. Proje Oluşturma ve DSN Alma

Sentry.io üzerinden hesap açın. Yeni proje oluşturun ve platformu (React, Vue, Node.js vb.) seçin. Proje ayarlarından DSN (Data Source Name) anahtarını kopyalayın.

2. SDK Kurulumu

İlgili SDK paketini projeye ekleyin:

npm install @sentry/browser @sentry/tracing

3. Sentry Başlatma (Initialization)

Uygulama giriş noktasına (ör. index.js veya main.js) 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,
  release: "proje@1.0.0"
});

4. Manuel Hata Yakalama ve Context Ekleme

Otomatik yakalanmayan istisnaları veya kritik blokları manuel izleyin:

try {
  criticalDatabaseOperation();
} catch (error) {
  Sentry.captureException(error, {
    extra: { userId: user.id, action: "checkout" }
  });
}

En İyi Pratikler (Best Practices)

Önemli: Kullanıcı şifreleri, kredi kartı bilgileri gibi PII (Personally Identifiable Information) verilerini Sentry'ye göndermeyin. beforeSend kancasıyla hassas verileri filtreleyin.

Source Maps Yükleme: Minified kod yerine orijinal TypeScript/JS satırlarını görmek için CI/CD hattında source map yükleyin.
Release Tracking: Hangi hatanın hangi deployment ile geldiğini tespit edin.
Breadcrumbs Kullanımı: Hatadan önceki console logları ve click aksiyonlarını izleyin.