Getting Started with GraphQL

Kita akan membuat kasus tentang Buku saja, sederhana.

Sesederhana kita membuat definisinya sebagai berikut:

type Buku {
  id: ID!
  judul: String!
  penulis: String!
  tahunTerbit: Int!
  genre: String
}

Nah lho, apa artinya tanda seru (!) di sana? Artinya kolom atau field tersebut harus disertakan saat klien memanggil atau server memberikan respons.

Terlihat di sana, selain field genre, seluruhnya wajib disertakan oleh client maupun server dalam request atau response-nya.

Selanjutnya kita buat Query-nya seperti ini:

type Query {
  semuaBuku: [Buku!]!
}

Maka jika diubah pada file server.js sebelumnya menjadi seperti ini:

const typeDefs = `
  type Buku {
    id: ID!
    judul: String!
    penulis: String!
    tahunTerbit: Int!
    genre: String
  }

  type Query {
    semuaBuku: [Buku!]!
  }
`;

Lalu kita ubah juga sisi resolver-nya menjadi begini:

let bukuDatabase = [
  { id: "1", judul: "Buku Satu", penulis: "Penulis A", tahunTerbit: 2024, genre: "Fiksi" },
  { id: "2", judul: "Buku Dua", penulis: "Penulis B", tahunTerbit: 2025, genre: "Non-Fiksi" },
];

const resolvers = {
  Query: {
    semuaBuku: () => bukuDatabase,
  },
};

Jika digabungkan, maka keseluruhan file server.js kali ini adalah sebagai berikut:

import { ApolloServer } from "@apollo/server";
import { startStandaloneServer } from "@apollo/server/standalone";

const typeDefs = `
  type Buku {
    id: ID!
    judul: String!
    penulis: String!
    tahunTerbit: Int!
    genre: String
  }

  type Query {
    semuaBuku: [Buku!]!
  }
`;

let bukuDatabase = [
  { id: "1", judul: "Buku Satu", penulis: "Penulis A", tahunTerbit: 2024, genre: "Fiksi" },
  { id: "2", judul: "Buku Dua", penulis: "Penulis B", tahunTerbit: 2025, genre: "Non-Fiksi" },
];

const resolvers = {
  Query: {
    semuaBuku: () => bukuDatabase,
  },
};

const server = new ApolloServer({ typeDefs, resolvers });
const { url } = await startStandaloneServer(server, { listen: { port: 9000 } });
console.log(`Server running at ${url}`);

Sekarang restart perintah node server.js di terminalnya dan refresh lagi halaman Apollo Servernya, lalu jalankan query berikut:

query  {
  semuaBuku {
    id
    judul
    penulis
    tahunTerbit
    genre
  }
}

Nah demikianlah Getting Started with GraphQL ini. Kalau diperhatikan, ini baru konsep “R” dalam “CRUD”. Juga kita baru sampai di folder server, belum ke folder client.

Apakah artikel ini harus dilanjutkan lagi? Jawab di kolom komentar ya!