Lewati ke konten utama
Kembali ke Semua Projek
Web App #module #nuxt #open-source

Nuxt-GSheet

Gunakan Google Sheets sebagai CMS ringan atau database dengan keamanan server-side proxy, stampede-proof caching, 5 mode autentikasi, dan tab khusus Nuxt DevTools.

01-08-2026
2 menit baca
Galeri Pratinjau & Tangkapan Layar1 Gambar • Klik untuk perbesar
Nuxt-GSheet
Tampilan UtamaBuka Pratinjau

Masalah & Risiko Keamanan Frontend

Google Sheets sering dijadikan database atau CMS sederhana untuk prototipe, katalog produk, atau formulir pendaftaran. Namun, metode integrasi biasa sering mengekspos API Key langsung di sisi browser (client-side), membocorkan kredensial, dan rentan mengalami kegagalan saat ribuan pengunjung mengakses situs secara bersamaan akibat batas kuota request Google API.

Nuxt-GSheet memecahkan masalah ini dengan menyediakan lapisan proxy server Nitro yang aman, sistem caching cerdas, serta pengetikan TypeScript otomatis.

Arsitektur & Keunggulan Teknis

Modul ini bekerja di tingkat server Nuxt (Nitro Engine) untuk mengamankan data dan mempercepat respon:

  • Server-Side Security Proxy: Kredensial Google API dan Service Account tersimpan aman di server, tidak pernah bocor ke browser pengguna.
  • Stampede-Proof Caching: Mekanisme penguncian cache (cache locking) yang mencegah lonjakan permintaan bersamaan ke Google API saat cache kedaluwarsa.
  • 5 Mode Autentikasi: Mendukung Public Sheet, API Key, Service Account, OAuth2, dan Service Account Key File.
  • Integrasi Nuxt DevTools: Menyediakan tab inspeksi khusus di Nuxt DevTools untuk melihat data sheet dan status cache secara langsung saat development.

Dengan mengaktifkan opsi cache di modul ini, respon pembacaan data Google Sheets menjadi instan (~5ms) karena disajikan langsung dari memori server/KV.

Contoh Konfigurasi Cepat

nuxt.config.tsts
export default defineNuxtConfig({
  modules: ['nuxt-gsheet'],

  gsheet: {
    sheets: {
      products: '1BxiMVs0XRA5nFMd****************************'
    },
    cache: {
      enabled: true,
      maxAge: 300 // Simpan cache selama 5 menit
    }
  }
})

Fitur Utama

  • Type-Safe Composables: Composable bawaan useGSheet dengan dukungan TypeScript penuh untuk data tabel Anda.
  • Dukungan AI Agent & MCP: Dilengkapi integrasi model context protocol untuk eksplorasi data berbasis agen AI.
  • Multi-Cloud Ready: Kompatibel dengan deployment Node.js, Vercel, dan Cloudflare Workers.