Belajar Observability dengan LGTM Stack - Grafana Fundamentals - Visualization & Dashboards

#Pendahuluan

Dari episode 4, stack lokal kalian sudah berjalan. Kini saatnya mempelajari komponen yang menjadi pusat interaksi: Grafana. Grafana adalah platform visualisasi yang menyatukan metrik dari Mimir, log dari Loki, dan trace dari Tempo dalam satu antarmuka.

Episode ini membahas arsitektur Grafana, navigasi UI, pembuatan dashboard dan panel pertama, variabel dan templating, jenis-jenis panel, serta perbedaan tiga query editor: PromQL, LogQL, dan TraceQL. Setelah episode ini, kalian akan merasa nyaman menjelajah Grafana sendiri.

#Arsitektur Grafana

Grafana berjalan sebagai server web sederhana yang memuat plugin data source dan panel. Strukturnya:

• Server architecture: satu proses Grafana melayani UI, API, dan autentikasi. Data disimpan di database internal (bawaan: SQLite) untuk menyimpan dashboard dan pengguna.
• Data source plugins: setiap backend — Mimir, Loki, Tempo — terhubung lewat plugin. Plugin ini yang menjembatani query dari UI ke bahasa query masing-masing backend.
• Panel types: setiap panel di dashboard dirender oleh plugin panel, misalnya time series, stat, gauge, table, heatmap, logs, traces, dan node graph.
• Dashboard JSON model: seluruh dashboard sebenarnya adalah dokumen JSON. Ini penting karena memungkinkan dashboard disimpan sebagai kode — dibahas di episode 30.
• Authentication dan authorization: Grafana mendukung autentikasi bawaan, OAuth, dan LDAP, serta peran Admin, Editor, dan Viewer — detailnya di episode 25.

curl -s http://localhost:3000/api/health

Endpoint api/health mengembalikan status server beserta versi Grafana — kebiasaan memvalidasi via API akan sangat membantu saat debugging.

#Getting Started

#Navigasi UI

Setelah login, struktur utama Grafana terdiri dari:

• Home: beranda dengan daftar dashboard favorit.
• Dashboards: kelola dan buat dashboard.
• Explore: mode query bebas tanpa harus menyimpan ke dashboard.
• Alerting: kelola rule alert dan contact points.
• Connections: kelola data source dan plugin.

#Membuat Dashboard Pertama

Klik Dashboards → New → New dashboard, lalu Add visualization. Pilih data source Mimir, dan Grafana akan membuka editor query dengan contoh query. Untuk memastikan Mimir punya data, mulai dengan query kosong dan pilih metrik apa pun yang tersedia via dropdown.

up
mimir_ingester_ingested_samples_total

Kedua nama metrik di atas adalah contoh nyata; up akan selalu ada karena dihasilkan oleh mekanisme scrape.

#Panel Types

Grafana menyediakan banyak jenis panel. Yang paling sering dipakai:

• Time series graphs: grafik garis untuk metrik berbasis waktu — jenis panel paling dasar.
• Stat panels: satu angka besar, cocok untuk menampilkan nilai terbaru.
• Gauge dan bar gauges: nilai dengan batas visual, seperti dashboard mobil.
• Tables: menampilkan data dalam bentuk tabel.
• Heatmaps: distribusi nilai terhadap waktu, bagus untuk melihat pola latency.
• Logs panels: menampilkan baris log dengan fitur highlight level.
• Traces panels: visualisasi waterfall dari trace Tempo.
• Node graphs: peta relasi antar service, dihasilkan dari service graph metrics Tempo.

type: timeseries
fieldConfig:
  defaults:
    unit: ops
  overrides: []
options:
  legend:
    displayMode: list
  tooltip:
    mode: multi

Penggunaan fieldConfig dan options adalah dua blok utama di model JSON setiap panel. Memahami keduanya memudahkan kalian mengedit dashboard sebagai kode di episode 30.

#Query Editors

#Perbedaan Tiga Editor

• PromQL editor (Mimir): menulis query metrik seperti rate(http_requests_total[5m]). PromQL dibahas tuntas di episode 7.
• LogQL editor (Loki): menulis query log seperti {job="checkout"} |= "error". LogQL dibahas di episode 10.
• TraceQL editor (Tempo): menulis query trace seperti { span.http.status_code >= 500 }. TraceQL dibahas di episode 15.

#Query Transformations dan Inspector

Fitur Transformations memungkinkan kalian mengubah hasil query di dalam panel tanpa mengubah data source — misalnya menggabungkan dua query atau menghitung rasio. Sedangkan Query inspector memperlihatkan permintaan mentah yang dikirim ke backend, berguna saat query berperilaku tidak sesuai dugaan.

#Variabel dan Templating

Variabel membuat satu dashboard bisa dipakai ulang untuk banyak konteks. Definisi variabel dilakukan di Dashboard settings → Variables. Contoh variabel service yang mengisi dropdown dari label metrik:

name: service
type: query
query: label_values(up, job)

Dengan variabel ini, query panel menjadi rate(http_requests_total{job="$service"}[5m]), dan kalian bisa berpindah service hanya dengan mengganti pilihan dropdown. Pola {job="$service"} akan sangat sering kalian lihat di dashboard production.

#Penutup

Di episode 5 ini kalian memahami arsitektur Grafana berbasis plugin data source dan panel, berhasil membuat dashboard dan panel pertama, mengenal delapan jenis panel yang paling berguna, memahami perbedaan query editor PromQL, LogQL, dan TraceQL, serta memakai variabel untuk dashboard yang dinamis.

Inti yang harus dibawa pulang:

• Grafana adalah server yang memuat plugin data source dan panel.
• Dashboard adalah dokumen JSON sehingga bisa dikelola sebagai kode.
• Panel time series, stat, gauge, logs, traces, dan node graph melayani kebutuhan berbeda.
• Tiga query editor: PromQL untuk Mimir, LogQL untuk Loki, TraceQL untuk Tempo.
• Variabel membuat satu dashboard melayani banyak service.
• Query inspector adalah alat debugging pertama saat query aneh.

Di episode 6 selanjutnya kita akan membahas metrics dengan Mimir — arsitektur komponen distributor, ingester, querier, dan store-gateway, perbandingan dengan Prometheus, serta tipe-tipe metrik dan pertimbangan cardinality. Dashboard kosong kalian akan segera terisi data sungguhan.