Penggunaan CDN

Instal dan gunakan @transx402/client melalui script tag CDN — tanpa proses build, cocok untuk WordPress, situs statis, dan halaman HTML apa pun.

Ringkasan

Build CDN dari @transx402/client memungkinkan Anda menambahkan pembayaran IDRX ke halaman HTML apa pun hanya dengan satu script tag — tanpa npm, tanpa bundler, tanpa proses build. Build ini mengekspos objek global TransX402 dengan API yang sama seperti package npm.

Gunakan CDN ketika:

Anda menggunakan HTML statis, WordPress, atau CMS tanpa build pipeline
Anda ingin cara tercepat untuk mencoba TransX402 di sandbox
Anda tidak memerlukan tree-shaking atau build yang di-bundle

Gunakan package npm jika Anda membangun aplikasi yang di-bundle (Next.js, Vite, webpack, dll.) di mana tree-shaking dan tipe TypeScript penting.

Menambahkan Script Tag

<script src="https://cdn.transx402.com/v1/transx402.min.js"></script>

Letakkan ini di <head> atau sebelum tag penutup </body>. Setelah dimuat, objek global TransX402 tersedia untuk <script> inline atau berikutnya di halaman tersebut.

Inisialisasi Client

<script src="https://cdn.transx402.com/v1/transx402.min.js"></script>
<script>
  const client = TransX402.create({
    apiKey: 'ipk_sandbox_abc123def456...',
  });
</script>

Prefix ipk_sandbox_ / ipk_live_ pada API key Anda secara otomatis menentukan apakah client mengarah ke sandbox.transx402.com (IDRX test gratis) atau api.transx402.com (Base mainnet) — tidak perlu konfigurasi lain. Lihat Sandbox untuk detail environment sandbox.

Menambahkan Paywall

Bundle CDN sudah menyertakan komponen paywall secara langsung:

<!DOCTYPE html>
<html>
<head>
  <title>Blog Saya</title>
  <script src="https://cdn.transx402.com/v1/transx402.min.js"></script>
</head>
<body>
  <h1>Panduan Investasi Crypto 2026</h1>
 
  <p>Berikut adalah preview artikel...</p>
 
  <div id="konten-premium">
    <p>Ini adalah konten premium yang akan terbuka setelah pembayaran.</p>
    <!-- Konten lengkap di sini -->
  </div>
 
  <script>
    const client = TransX402.create({
      apiKey: 'ipk_sandbox_abc123def456...',
    });
 
    TransX402.paywall({
      selector: '#konten-premium',
      price: 5000,
      currency: 'IDR',
      title: 'Konten Premium',
      description: 'Bayar Rp 5.000 untuk membaca artikel lengkap',
    });
  </script>
</body>
</html>

Ini secara otomatis melindungi elemen #konten-premium dengan overlay "Pay with IDRX", yang menangani koneksi wallet, approval Permit2 satu kali, dan konfirmasi pembayaran.

Ukuran Bundle

Varian	Target
CDN full bundle	< 60 KB gzipped

Bundle CDN menyertakan UI paywall dan wallet connectors, sehingga ukurannya lebih besar dari package npm inti — trade-off ini membuat integrasi tanpa-build tetap sederhana.

Langkah Selanjutnya

Library JavaScript — Referensi API lengkap (bekerja sama baik via CDN atau npm)
Plugin WordPress — Wrapper tanpa-kode yang dibangun di atas script CDN yang sama
Quickstart — Panduan lengkap dari registrasi hingga pembayaran pertama