Phenquestions
Komunikasi dan transfer data antara front end dan backend aplikasi apapun terjadi melalui API (Application Programming Interface). Ada banyak jenis API yang digunakan untuk berkomunikasi antara aplikasi front-end dan back-end seperti RESTful API, SOAP API, GraphQL API, dll. GraphQL API adalah teknologi yang relatif baru, dan jauh lebih cepat daripada jenis API lain yang tersedia. Mengambil data dari database menggunakan api GraphQL jauh lebih cepat daripada REST API. Saat menggunakan GraphQL API, klien memiliki kontrol untuk mengambil hanya data yang diperlukan alih-alih mendapatkan semua detail; itulah sebabnya GraphQL API bekerja lebih cepat daripada REST API.
Menginstal Paket
Kami akan membangun sebuah simpul.js menggunakan GraphQL API, jadi kita perlu menginstal node.js dan npm untuk ini sebelum memulai proyek.
[dilindungi email]:~$ sudo apt-get update -y[dilindungi email]:~$ sudo apt-get install nodejs
[dilindungi email]:~$ sudo apt-get install npm
Menyiapkan Proyek
Kami akan menggunakan kerangka kerja 'ekspres' dari node.js untuk membangun aplikasi kita. Buat direktori bernama 'graphql' dan mulai proyek.
[dilindungi email]:~$ mkdir graphql[dilindungi email]:~$ cd graphql/
[dilindungi email]:~$ npm init -y
Pengaturan MongoDB
Dalam proyek GraphQL kami, kami akan menggunakan MongoDB sebagai database kami. MongoDB adalah database tanpa skema dan menyimpan data dalam bentuk pasangan kunci. Untuk menginstal mongoDB, ikuti langkah-langkah yang diberikan.
Impor kunci GPG publik untuk MongoDB.
[dilindungi email]:~$ wget -qO - https://www.mongodb.org/static/pgp/server-4.4.asc | sudo apt-key add -
Buat file daftar untuk mongodb.
Perbarui repositori lokal.
[dilindungi email]:~$ sudo apt-get update -yInstal paket mongodb.
[dilindungi email]:~$ sudo apt-get install -y mongodb-orgMulai dan aktifkan mongod.layanan.
[dilindungi email]:~$ sudo systemctl start mongod.layanan[dilindungi email]:~$ sudo systemctl aktifkan mongod.layanan
Memasang Modul npm
Untuk aplikasi GraphQL kami, kami perlu menginstal beberapa paket npm. Kami akan memasang cors, express, body-parser, luwak, dll.
[dilindungi email]:~$ cd graphql/[dilindungi email]:~$ npm install cors express body-parser luwak --save
Untuk membuat api GraphQL, kita perlu menginstal paket npm tambahan bernama 'apollo-server-express.' Paket npm ini digunakan untuk menjalankan server graphQL dengan semua Node.Kerangka kerja HTTP js seperti 'ekspres.'
[dilindungi email]:~$ npm install apollo-server-express --saveMendefinisikan Skema MongoDB
Sekarang kami telah mengatur lingkungan kami untuk aplikasi GraphQL kami di Node.js, dan sekarang saatnya untuk mendefinisikan skema untuk aplikasi kita. Buat file 'model/siswa.js' di direktori root proyek.
// mendefinisikan skema siswaconst luwak = membutuhkan('luwak');
const studentSchema = luwak baru.Skema(
nama:
jenis: Tali,
diperlukan: benar
,
kelas:
jenis: Nomor,
diperlukan: benar
,
jurusan:
jenis: Tali,
diperlukan: benar
,
stempel waktu: benar
);
const Siswa = luwak.model('Siswa', skema siswa);
modul.ekspor = Siswa, skema siswa
Dalam skema yang ditentukan di atas, setiap siswa harus memiliki nama, kelas, dan jurusan.
Membangun GraphQL API
Setelah membuat skema Siswa, sekarang kita akan membangun API GraphQL. Buat 'skema.js' untuk menulis parameter GraphQL. Ada dua parameter, 'types' dan 'resolver', yang digunakan di GraphQL API. Dalam 'jenis', kami akan menentukan skema kami, kueri (mis.g., Membuat permintaan GET), dan mutasi (mis.g., Membuat permintaan UPDATE atau DELETE) ke skema yang ditentukan. Kami akan menulis metode berbeda yang didefinisikan dalam 'tipe' untuk menautkan kueri dan mutasi dengan database di 'resolver.'
// mengimpor skema dan modulconst gql = membutuhkan('apollo-server-express');
const Siswa = membutuhkan('./model/siswa').Siswa;
// Mendefinisikan Skema, Query, dan Jenis Mutasi
const typeDefs = gql '
tipe Siswa
aku melakukannya!,
nama: String!,
kelas: Int!,
jurusan: String!
ketik Permintaan
getStudents: [Mahasiswa],
getStudentById(id: ID!): Siswa
jenis Mutasi
addStudent (nama: String!, kelas: Int!, jurusan: String! ): Siswa
updateStudent (nama: String!, kelas: Int!, jurusan: String! ): Siswa
deleteStudent( id: ID! ): Siswa
'
// Mendefinisikan Resolver
const resolver =
Permintaan:
getStudents: (orang tua, argumen) =>
kembalikan Mahasiswa.Temukan();
,
getStudentById: (induk, argumen) =>
kembalikan Mahasiswa.findById(args.Indo);
,
Mutasi:
addStudent: (induk, argumen) =>
misalkan siswa = Siswa baru(
nama: args.nama,
kelas: args.kelas,
jurusan: args.utama
);
siswa kembali.menyimpan();
,
updateStudent: (induk, argumen) =>
jika(!argumen.identitas) kembali;
kembalikan Mahasiswa.findOneAndUpdate(
_id: args.Indo
,
$set:
nama: args.nama,
kelas: args.kelas,
jurusan: args.utama
,
baru: benar , (err, Mahasiswa) =>
jika (salah)
menghibur.log(err);
lain ;
)
modul.ekspor =
typeDefs,
pemecah masalah
Membuat Server API GraphQL
Sekarang kita hampir selesai membuat Aplikasi GraphQL. Satu-satunya langkah yang tersisa adalah membuat server. Buat file bernama 'aplikasi.js' untuk mengonfigurasi parameter server.
// mengimpor paket yang diperlukanconst ekspres = membutuhkan('ekspres');
const luwak = membutuhkan('luwak');
const bodyParser = membutuhkan('body-parser');
const cors = membutuhkan('cors');
const ApolloServer = membutuhkan('apollo-server-express');
// mengimpor skema
const typeDefs, resolver = membutuhkan('./skema');
// menghubungkan ke MongoDB
const url = “mongodb://127.0.0.1:27017/siswa”;
const connect = luwak.connect(url, useNewUrlParser: true );
Menghubung.lalu((db) =>
menghibur.log('Koneksi Berhasil');
, (keliru) =>
menghibur.log(err);
);
// membuat server
const server = new ApolloServer(
typeDefs: typeDefs,
resolver: penyelesai
);
aplikasi const = ekspres();
aplikasi.gunakan (bodyParser.json());
aplikasi.gunakan('*', cor());
server.applyMiddleware( aplikasi );
aplikasi.dengarkan( 8000, () =>
menghibur.log('mendengarkan 8000');
)
Menguji API GraphQL
Kami memiliki server graphQL kami dan berjalan pada port 8000, dan sekarang saatnya untuk menguji GraphQL API. Buka halaman web GraphQL di browser dengan mengunjungi url berikut.
http://localhost:8000/graphql
Dan itu akan membuka halaman web berikut.
Tambahkan siswa ke database menggunakan graphQL API.
Demikian pula, tambahkan lebih banyak siswa, dan setelah menambahkan siswa, dapatkan semua siswa menggunakan GraphQL API.
Catat ID salah satu Siswa dan dapatkan siswa tertentu menggunakan id-nya.
Kesimpulan
Mengambil data dari database menggunakan REST API standar membuat kueri menjadi lambat karena terkadang kami mendapatkan lebih banyak data daripada yang dibutuhkan. Menggunakan GraphQL, kita dapat mengambil data yang dibutuhkan dengan tepat yang membuat GraphQL API lebih cepat. Dalam proyek demo ini, kami hanya memiliki satu skema, jadi kami telah membuat GraphQL API untuk skema tunggal itu. Juga, kami telah mendefinisikan tiga hingga empat metode untuk skema. Anda dapat membuat lebih dari satu kueri atau mutasi sesuai dengan aplikasi Anda.
