Solana Tracker Pro — DApp (Decentralized Application)

Aplikasi Web3 modern untuk memantau saldo, mengirim transaksi, dan berinteraksi dengan smart contract di jaringan Solana Mainnet. Dirancang dengan estetika premium yang mengambil API Phantom Wallet.

Fitur Utama

• Phantom Theme UI: Tampilan bersih dan modern dengan aksen ungu khas Phantom.
• Dark & Light Mode: Dukungan penuh untuk tema gelap dan terang yang tersimpan otomatis.
• Mainnet Tracker: Menggunakan RPC PublicNode yang stabil untuk memantau saldo SOL asli di Mainnet.
• Real-Time Balance: Baca saldo SOL secara instan langsung dari blockchain.
• Secure Transfer: Kirim SOL ke alamat lain dengan konfirmasi transaksi yang transparan.
• Smart Contract Interaction: Berinteraksi dengan program Counter (Anchor) secara on-chain.
• Responsive Layout: Tampilan grid 2-kolom yang optimal di desktop dan mobile.

---

Prasyarat

• Node.js >= 18 atau Bun
• Phantom Wallet terinstall di browser
• Saldo SOL di jaringan Mainnet (untuk melakukan transaksi)

---

Setup & Instalasi

1. Clone & Install:

   npm install

2. Konfigurasi Environment: Salalin file .env.example menjadi .env dan pastikan RPC URL mengarah ke Mainnet:

   NEXT_PUBLIC_SOLANA_RPC_URL=https://solana-rpc.publicnode.com

3. Jalankan Aplikasi:

   npm run dev

Buka http://localhost:3000 di browser Anda.

---

Integrasi Smart Contract (Anchor)

Aplikasi ini menggunakan IDL (Interface Definition Language) untuk berkomunikasi dengan program Counter on-chain.

Konsep yang Digunakan:

Komsep	Penjelasan
IDL	Deskripsi struktur program dalam format JSON.
AnchorProvider	Jembatan antara koneksi RPC dan wallet user untuk tanda tangan transaksi.
PDA	Alamat akun deterministik (["counter", authority]) yang dikontrol oleh program.
Methods	Memanggil instruksi initialize, increment, decrement, dan reset pada kontrak.

---

Struktur Proyek

src/
  app/
    layout.tsx          — Root layout & metadata
    page.tsx            — Entry point dengan layout Grid 2-kolom
  components/
    SolanaProviders.tsx — Wrapper Provider (Connection, Wallet, Modal)
    WalletConnect.tsx   — Koneksi wallet Phantom (Dynamic Import - No SSR)
    BalanceDisplay.tsx  — Pemantau saldo SOL Mainnet
    TransferForm.tsx    — Form pengiriman SOL
    ThemeToggle.tsx     — Switcher Mode Terang/Gelap
    ProgramInteraction.tsx — Dasbor interaksi Smart Contract
    TransactionStatus.tsx — Pelacak status transaksi & Link Explorer
  styles/
    index.css           — Phantom-themed styling (Responsive Grid)
  idl/
    counter.json        — Definisi program Anchor

---

Catatan Penting (Mainnet)

Aplikasi ini dikonfigurasi secara default untuk Solana Mainnet-Beta. Pastikan:

1. Dompet Phantom Anda tidak berada dalam "Mainnet Mode/RPC".
2. Transaksi yang dilakukan di sini menggunakan dana asli (Real SOL).
3. Jika saldo gagal dimuat (Error 403/429), cobalah menggunakan VPN atau hotspot seluler karena beberapa ISP sering memblokir RPC publik.