Cara Cepat Build GraphQL dengan Hasura.io (Part 1)

Sumber: https://ng.linkedin.com/company/hasura

Zaman RESTfull berjaya adalah ketika mampu memberikan performa yang optimal dibandingkan XMLRPC atau WSDL (mungkin Anda yang sudah berumur lebih tahu 😆). RESTFull dengan output JSON memiliki keunggulan data yang di-delivery menjadi lebih reliable dan dengan ukuran yang lebih kecil dibandingkan WSDL atau XMLRPC. Format yang dibaca pun lebih mudah dimengerti.

Sumber: https://www.datapopulator.com/documentation/

Seiring berjalannya waktu, format JSON mulai dirasa kurang efektif. Hal ini karena biasanya untuk front-end (baik mobile maupun web), hanya consume objek yang dibutuhkan untuk menampilkan data sesuai desain. Selain itu, juga karena behaviour mobile dan web atau desktop berbeda dan ini mengharuskan JSON Object yang dikirim pun berbeda untuk kebutuhan performance. Dan back-end akhirnya membuat beberapa endpoint untuk optimasi performa front-end.

source : http://slides.com/swcarlosrj/vue-graphql-clients-vue-hong-kong-1/fullscreen#/1/4

Sedangkan back-end biasanya tidak membuat return JSON yang berbeda-beda di masing-masing platform dan umumnya mengirimkan banyak objek sekaligus meskipun objek tersebut tidak terpakai oleh front-end dengan dalih jaga-jaga suatu saat akan digunakan.

GraphQL

GraphQL adalah tools dari Facebook yang memudahkan developer back-end untuk membuat return JSON yang lebih dinamis dan ditampilkan sesuai kebutuhan front-end dengan cara pencarian query. Sama seperti RDBMS, ketika developer back-end ingin menampilkan data dari database, tidak semua data perlu untuk ditampilkan dan hanya beberapa kolom yang kita tampilkan.

Di GraphQL, dengan membuat scheme, front-end sudah dapat menampilkan data yang dibutuhkan saja.

source : https://developers.refersion.com/graphql-api/overview/

Alhasil, front-end mendapatkan objek JSON yang dibutuhkan saja, dan lebih efesien karena ukuran JSON jadi lebih kecil, dan objek yang tidak diperlukan tidak ditampilkan. Performance front-end pun menjadi lebih baik ketika me-load data dari back-end.

Hasura.io

Hasura.io (gratis dan open source) adalah GraphQL yang digabungkan dengan PosgreSQL. Sehingga, untuk membuat API tidak perlu lagi banyak setup dan banyak kode. Cukup menggunakan Hasura.io, kita sudah bisa delivery API menggunakan GraphQL. Yang diperlukan pertama kali adalah membuat basisdata yang bagus.

Hasura.io sudah support empat komponen dasar:

1. Queries. Dengan membuat scheme, kita bisa langsung melakukan query ke database, beserta dengan relasi-relasinya. Ini akan menghemat kita karena menampilkan query-query dasar. Namun, jika butuh query complex, kita juga bisa memanfaatkan function di PosgreSQL, dan function tersebut bisa dipanggil oleh graphql.
2. Insert Mutations, Update Mutations, dan Delete Mutations.
   Mutation memudahkan kita untuk insert aktivitas CRUD di database postgresql via graphql.

Sumber: https://hasura.io/all-features

Realtime dengan Subscriptions & Live-queries

Hasura.io juga support realtime subscription & live-query. Artinya, setiap perubahan data atau action akan diproses secara realtime.

Terus, bagaimana jika ada integrasi ke GraphQL lain?

Hasura sudah support untuk event Remote Scheme. Remote Scheme sendiri adalah fitur di Hasura yang memungkinkan untuk memanggil GraphQL lain.

Sumber: https://hasura.io/

Instalasi

Ada banyak cara untuk instalasi Hasura.io. Berikut salah satu tutorial instalasi menggunakan Docker Compose.

Langkah 1: Unduh docker-compose.yaml Hasura

# in a new directory
wget https://raw.githubusercontent.com/hasura/graphql-engine/master/install-manifests/docker-compose/docker-compose.yaml

Langkah 2: Jalankan docker-compose untuk Hasura.io dan PostgreSQL

$ docker-compose up -d

Langkah 3: Cek jika docker sudah berjalan baik

$ docker ps

CONTAINER ID IMAGE                 ... CREATED STATUS PORTS          ...
097f58433a2b hasura/graphql-engine ... 1m ago  Up 1m  8080->8080/tcp ...
b0b1aac0508d postgres              ... 1m ago  Up 1m  5432/tcp       ...

Langkah 3: Cek URL untuk akses Hasura.io

Kesimpulan

1. GraphQL adalah tools dari Facebook yang memudahkan developer untuk melakukan query dari return JSON yang akan di-consume oleh front-end.
2. Hasura.io (gratis dan opensource) adalah GraphQL yang di-combine dengan PosgreSQL dan tanpa perlu banyak kode back-end, kita sudah membuat API yang siap di-consume oleh front-end.

Selanjutnya?

Kita akan membuat query, mutation, dan call function postgresql di Hasura.io menggunakan GraphQL tools dari Hasura.io.

Referensi

GraphQL: A query language for APIs.

Vue GraphQL Clients - Vue Hong Kong #1

Quickstart with Docker | Hasura 1.0 documentation

GraphQL Tutorials for Frontend Developers | learn.hasura.io

Sudaryatno adalah Chief of Technology di GITS Indonesia. Seorang developer senior yang sedang membawa para programmer GITS terus level up, tak hanya kemampuan coding-nya, tapi juga dalam membagikan ilmu kepada orang banyak.

Tulisan ini juga bisa dibaca di https://gits.id/blog/cara-cepat-build-graphql-dengan-hasura-io-part-1/ .