IHS Strategic
Tüm Blog Yazıları
HowTo13 Eylül 2026•2 dk okuma

Web Uygulamalarında Hata İzleme: Adım Adım Sentry Entegrasyon Rehberi

Modern web uygulamalarında proaktif hata izleme stratejilerini uygulayın. Sentry kurulumu, context yönetimi ve performans izleme adımlarını içeren kapsamlı rehber.

S

Sistem Yöneticisi

Kıdemli Yazılım Mimarı

Web Uygulamalarında Hata İzleme (Error Tracking) Nedir?

Hata izleme (Error Tracking), production ortamında çalışan web uygulamalarında meydana gelen istisnaları (runtime exceptions), çökmeleri ve performans darboğazlarını gerçek zamanlı yakalama, gruplama ve analiz etme sürecidir. Log kayıtlarını manuel taramak yerine merkezi hata izleme araçları kullanmak, modern dijital strateji süreçlerinin ayrılmaz parçasıdır.

Kullanıcı bildirmeden hatayı tespit etmek, Mean Time to Resolution (MTTR) süresini doğrudan düşürür.

Modern Hata Yönetimi Trendleri

Dağıtık mimariler ve single-page application (SPA) yapılarının yaygınlaşmasıyla hata izleme pratiklerinde öne çıkan trendler:

  • Gerçek Zamanlı Telemetri: Hataların anlık Slack/PagerDuty entegrasyonlarıyla bildirilmesi.
  • Session Replay: Hatadan hemen önceki kullanıcı etkileşimlerini DOM bazlı video formatında izleme.
  • Tracing & Performance Monitoring: API gecikmeleri ile client hatalarını aynı trace ID altında birleştirme.
  • Release Tracking: Hatanın tam olarak hangi commit/deployment ile tetiklendiğini otomatik eşleme.

Adım Adım Sentry Kurulumu ve Entegrasyonu

Adım 1: Sentry Projesi Oluşturma

Sentry panelinde yeni proje oluşturup platformu (Browser JavaScript, React, Node.js vb.) seçin. Size özel üretilen DSN (Data Source Name) anahtarını kaydedin.

Adım 2: SDK Kurulumu ve Başlatma

Tarayıcı veya Node.js ortamına göre resmi SDK paketini projeye dahil edin:

npm install --save @sentry/browser

Uygulama giriş noktasına (index.js / main.ts) SDK 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: 0.2,
  environment: process.env.NODE_ENV,
  release: "app@1.0.0"
});

Adım 3: Context ve Kullanıcı Bilgisi Ekleme

Hata analizi sırasında hangi kullanıcının etkilendiğini anlamak için context verilerini SDK oturumuna bağlayın:

// Auth sonrasi calisir
Sentry.setUser({
  id: "usr_8492",
  email: "dev@firma.com"
});

// Ozel etiket ekleme
Sentry.setTag("subscription_plan", "enterprise");

Adım 4: Manuel Hata Yakalama (Try/Catch)

Kritik iş akışlarında beklenmeyen durumları yakalayıp Sentry'ye iletin:

try {
  processPayment(payload);
} catch (error) {
  Sentry.captureException(error, {
    extra: { orderId: payload.orderId }
  });
}

Adım 5: Source Maps Yükleme

Minify edilmiş production bundle dosyalarındaki hataları orijinal kod satırlarıyla eşleştirmek için build pipeline'ına Source Map yükleme adımını ekleyin. @sentry/webpack-plugin veya @sentry/vite-plugin kullanın.

En İyi Uygulamalar (Best Practices)

  • PII Maskeleme: Kredi kartı, şifre ve kişisel verilerin Sentry sunucularına gitmesini engellemek için beforeSend kancasını kullanın.
  • Sampling Oranları: Yüksek trafikli uygulamalarda işlem maliyetlerini düşürmek için transaction örnekleme oranını (tracesSampleRate) %10-%20 aralığında tutun.
  • Noise Filtering: Reklam engelleyiciler veya tarayıcı eklentilerinden kaynaklanan anlamsız hataları ignoreErrors listesiyle filtreleyin.