Lewati ke konten utama
TANGGAL RILIS01-08-2026
WAKTU BACA2 Menit
KATEGORIWeb App

Nuxt-GSheet

Jadikan Google Sheets sebagai CMS atau basis data praktis dengan server-side proxy aman, stampede-proof caching, 5 mode autentikasi, dan tab inspeksi Nuxt DevTools.

#module #nuxt #open-source
Nuxt-GSheet

Masalah & Risiko Keamanan Frontend

Google Sheets sering dimanfaatkan sebagai basis data atau CMS praktis untuk prototipe, katalog produk, dan formulir pendaftaran. Sayangnya, integrasi konvensional kerap mengekspos API Key langsung di browser pengguna, membocorkan kredensial rahasia, serta rentan terbentur batas kuota Google API saat pengunjung melonjak bersamaan.

Nuxt-GSheet menjawab kendala tersebut dengan menghadirkan lapisan server proxy Nitro yang aman, mekanisme caching cerdas, dan pengetikan TypeScript otomatis.

Arsitektur & Keunggulan Teknis

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

  • 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 pengembangan (development).

Dengan mengaktifkan opsi cache, pembacaan data Google Sheets berlangsung sangat cepat (~5ms) karena disajikan langsung dari memori cache server atau KV storage.

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.