Cara menggunakan GraphQL Query Builder
- Buka Schema (SDL) dan tempel schema kamu, atau pakai contoh yang tersedia.
- Pilih Query, Mutation, atau Subscription.
- Centang field di pohon; buka objek untuk memilih field bersarang dan isi argumennya.
- Salin query yang dihasilkan, JSON variabel, atau pemanggilan
fetch()yang siap pakai.
Cara kerja builder
Schema diurai dengan graphql-js lalu diubah menjadi pohon yang dimulai dari root type operation yang kamu pilih. Mencentang field akan menambahkannya ke selection; mencentang field objek akan membukanya sehingga kamu bisa memilih sub-field-nya. Argumen yang kamu isi otomatis menjadi variabel dengan tipe GraphQL yang tepat ($id: ID!), sehingga query bisa dipakai ulang dan aman dari injection, dan JSON variabel dibuat di sebelahnya.
Tips
- Field bertipe interface atau union akan menampilkan implementasinya sebagai inline fragment (
... on Book). - Argumen wajib ditandai dengan
!; kosongkan argumen opsional agar tidak ikut dikirim. - Gunakan kotak filter untuk mencari field di schema yang besar.
Format atau cek query yang sudah ada dengan GraphQL formatter & validator, dan periksa respons JSON di JSON viewer.
Juga dicari sebagai: generator query graphql, cara membuat query graphql, graphql explorer, graphql mutation builder, alternatif graphql playground, buat query graphql online.
Tool yang cocok dipakai bersama GraphQL Query Builder
- cURL ke Code — Tempel perintah curl dari dokumentasi API atau “Copy as cURL” di DevTools browser, lalu dapatkan kode siap pakai untuk enam bahasa, dengan header, body, dan autentikasi yang ikut terbawa.
- Validator OpenAPI / Swagger — Tempel spesifikasi API untuk memeriksanya terhadap skema OpenAPI resmi, menemukan referensi yang rusak dan parameter path yang tidak konsisten, serta melihat semua endpoint sekaligus.
- JSON ke Types — Tempel respons API dan dapatkan model siap pakai dalam 8 bahasa: TypeScript, Python (dataclass, TypedDict, atau Pydantic), Go, Java, C#, Kotlin, Swift, dan Rust.
- Validator JSON Schema — Tempel schema dan JSON untuk melihat nilai mana yang melanggar aturan, atau buat schema awal dari data contoh.
Pertanyaan yang sering diajukan
Dari mana saya mendapatkan SDL schema?
Banyak server menyediakannya di
/graphql/schema atau di repository (schema.graphql). Kamu juga bisa mengekspornya dengan rover graph introspect atau npx get-graphql-schema https://api.example.com/graphql.Apakah query dikirim ke API saya?
Tidak. Builder hanya membuat teks di browser kamu. Salin snippet fetch untuk menjalankannya sendiri.
Apakah fragment didukung?
Field interface dan union akan membuat inline fragment untuk setiap tipe yang mungkin. Named fragment bisa ditambahkan manual dan dicek dengan GraphQL formatter.
Bisakah saya memasang GraphQL Query Builder sebagai aplikasi web dan memakainya offline?
Bisa. GraphQL Query Builder adalah aplikasi web (PWA) yang bisa dipasang. Pemasangannya lewat browser kamu, bukan diunduh dari toko aplikasi. Klik Pasang aplikasi di bagian atas halaman ini di Chrome atau Edge (Windows, macOS, Linux, ChromeOS) atau di Android. Di iPhone dan iPad, gunakan Bagikan → Tambahkan ke Layar Utama, dan di Safari 17+ pada Mac, gunakan File → Tambahkan ke Dock. Setelah itu, aplikasi akan terbuka di jendelanya sendiri dengan ikonnya sendiri. Karena berjalan sepenuhnya di browser kamu, aplikasi ini tetap bisa dipakai offline. Firefox di desktop tidak bisa memasang aplikasi web. Cara memasang aplikasi.