• Banjarbaru, Kalimantan Selatan
UwrgwVLhFwa10Ki2ppAdfYiU5dse24rSI4sNZlNo.png
2 years ago

Tutorial GraphQL pada Laravel 9 CRUD

GraphQL, mungkin tidak asing kalian denger. Jadi apa itu GraphQL, GraphQL adalah bahasa query untuk API yang bertujuan untuk mendapatkan sebuah API yang lebih fleksibel dan efisien. Berbeda dengan REST API, dengan GraphQL kita hanya menggunakan satu buah endpoint saja untuk mengambil data tertentu yang diperlukan dan bahkan bisa juga melakukan CRUD(Create Read Update Delete) dengan endpoint tersebut. Sederhananya bisa kalian lihat pada gambar berikut

 

Pada gambar diatas dapat dilihat dengan REST API respon server sudah ditentukan, sedangkan dengan GraphQL client bisa mengatur sendiri data mana yang ingin ditampilkan. Keren bukan dengan GraphQL. Jadi diposting kali ini saya akan memberikan tutorial bagaimana menggunakan GraphQL pada Laravel simak berikut ya…

 

Membuat Project Laravel

Pertama kita bikin dulu project Laravel, cara silahkan buka terminal/cmd lalu ketik perintah berikut

composer create-project laravel/laravel graphql-laravel-9

Kalau sudah silahkan buka project tersebut pada code editor kesukaan kalian

 

Install GraphQL Library

Selanjutnya kita install pada project kita library GraphQL (rebing/graphql-laravel), caranya silahkan ketik perintah berikut pada terminal

composer require rebing/graphql-laravel

Setelah selesai kita lanjut ketik perintah berikut

php artisan vendor:publish --provider="Rebing\GraphQL\GraphQLServiceProvider"

Kalau sudah maka secara otomatis akan ada file dengan nama graphql.php pada folder config

 

Membuat Database dan Setting .env

Oke, sekarang kita bikin dulu database dengan nama laravel_graphql

Dan silahkan atur file .env database jadi berikut ini

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel_graphql
DB_USERNAME=root
DB_PASSWORD=

 

Mengatur Seeder dan Migration

Sekarang kita atur data users yang nantinya kita akan gunakan untuk prses GraphQL. Silahkan masuk ke folder database\seeders\DatabaseSeeder.php lalu pada method run sesuaikan jadi berikut

public function run()
    {
        \App\Models\User::factory(10)->create();
    }

Kalau sudah, kita migrate databasenya, caranya dengan mengetikan perintah berikut ini

php artisan migrate –seed

 

Struktur GraphQL Laravel

Disini kita buat folder GraphQL di folder app dan buat tiga subfolder baru yaitu:

  1. Mutations, di folder ini akan kita gunakan untuk proses insert, update, dan delete
  2. Queries, di folder ini akan digunakan untuk Read data atau get data yang diperlukan client
  3. Types, types adalah objek yang mewakili banyak jenis data yang dapat diakses dari database. Dan di sinilah class UserType akan disimpan.

 

User Type

Pada folder app/GraphQL/Types silahakan bikin file dengan nama UserType.php dan sesuaikan isinya dengan kode berikut

<?php

namespace App\GraphQL\Types;

use App\Models\User;
use GraphQL\Type\Definition\Type;
use Rebing\GraphQL\Support\Type as GraphQLType;

class UserType extends GraphQLType
{
    protected $attributes = [
        "name" => "User",
        "description" => "A user",
        "model" => User::class,
    ];

    public function fields(): array
    {
        return [
            "id" => [
                "type" => Type::nonNull(Type::int()),
                "description" => "The id of the user",
            ],
            "name" => [
                "type" => Type::string(),
                "description" => "The name of user",
            ],
            "email" => [
                "type" => Type::string(),
                "description" => "The email of user",
            ],
            "email_verified_at" => [
                "type" => Type::string(),
                "description" => "The email_verified_at of user",
            ],
            "created_at" => [
                "type" => Type::string(),
                "description" => "The created_at of user",
            ],
            "updated_at" => [
                "type" => Type::string(),
                "description" => "The updated_at of user",
            ],
        ];
    }
}

 

User Query

Selanjutnya kita buat file UserQuery.php pada folder app/GraphQL/Queries . Pada file ini berisi kode untuk Get data berdasarkan ID User yang diinginkan, silahkan sesuaikan dengan kode berikut

<?php

namespace App\GraphQL\Queries;

use App\Models\User;
use GraphQL\Type\Definition\Type;
use Rebing\GraphQL\Support\Facades\GraphQL;
use Rebing\GraphQL\Support\Query;

class UserQuery extends Query
{
    protected $attributes = [
        "name" => "user",
    ];
    public function type(): Type
    {
        return GraphQL::type("User");
    }
    public function args(): array
    {
        return [
            "id" => [
                "name" => "id",
                "type" => Type::int(),
                "rules" => ["required"],
            ],
        ];
    }
    public function resolve($root, $args)
    {
        return User::findOrFail($args["id"]);
    }
}

 

Users Query

Pada file UsersQuery.php adalah kode untuk get semua data user. Sekarang bikin file tersebut pada app/GraphQL/Queries  dan sesuaikan dengan kode berikut

<?php

namespace App\graphql\Queries;

use App\Models\User;
use GraphQL\Type\Definition\Type;
use Rebing\GraphQL\Support\Facades\GraphQL;
use Rebing\GraphQL\Support\Query;

class UsersQuery extends Query
{
    protected $attributes = [
        "name" => "users",
    ];
    public function type(): Type
    {
        return Type::listOf(GraphQL::type("User"));
    }
    public function resolve($root, $args)
    {
        return User::all();
    }
}

 

Create User Mutation

Silahkan buat file CreateUserMutation.php pada app/GraphQL/Mutations. File ini berfungsi untuk insert data ke database kita. Sesuaikan dengan kode berikut ini

<?php

namespace App\graphql\Mutations;

use App\Models\User;
use Rebing\GraphQL\Support\Mutation;
use GraphQL\Type\Definition\Type;
use Rebing\GraphQL\Support\Facades\GraphQL;

class CreateUserMutation extends Mutation
{
    protected $attributes = [
        "name" => "createUser",
    ];
    public function type(): Type
    {
        return GraphQL::type("User");
    }
    public function args(): array
    {
        return [
            "name" => [
                "name" => "name",
                "type" => Type::string(),
                "rules" => ["required"],
            ],
            "email" => [
                "name" => "email",
                "type" => Type::string(),
                "rules" => ["required"],
            ],
            "password" => [
                "name" => "password",
                "type" => Type::string(),
                "rules" => ["required"],
            ],
        ];
    }
    public function resolve($root, $args)
    {
        $user = new User();
        $user->fill($args);
        $user->save();
        return $user;
    }
}

 

Update User Mutation

Untuk proses update silahkan buat file UpdateUserMutation.php pada app/GraphQL/Mutations dan sesuaikan dengan kode berikut

<?php

namespace App\graphql\Mutations;

use App\Models\User;
use GraphQL\Type\Definition\Type;
use Rebing\GraphQL\Support\Mutation;
use Rebing\GraphQL\Support\Facades\GraphQL;

class UpdateMovieMutation extends Mutation
{
    protected $attributes = [
        "name" => "updateUser",
    ];
    public function type(): Type
    {
        return GraphQL::type("User");
    }
    public function args(): array
    {
        return [
            "id" => [
                "name" => "id",
                "type" => Type::int(),
                "rules" => ["required"],
            ],
            "name" => [
                "name" => "name",
                "type" => Type::string(),
                "rules" => ["required"],
            ],
            "email" => [
                "name" => "email",
                "type" => Type::string(),
                "rules" => ["required"],
            ],
            "password" => [
                "name" => "password",
                "type" => Type::string(),
                "rules" => ["required"],
            ],
        ];
    }
    public function resolve($root, $args)
    {
        $user = User::findOrFail($args["id"]);
        $user->fill($args);
        $user->save();
        return $user;
    }
}

 

Delete User Mutation

Terakhir kita buat file DeleteUserMutation.php in the app/GraphQL/Mutations dan sesuaikan dengan kode berikut.

<?php

namespace App\graphql\Mutations;

use App\Models\User;
use GraphQL\Type\Definition\Type;
use Rebing\GraphQL\Support\Mutation;

class DeleteUserMutation extends Mutation
{
    protected $attributes = [
        "name" => "deleteuser",
        "description" => "Delete a user",
    ];
    public function type(): Type
    {
        return Type::boolean();
    }
    public function args(): array
    {
        return [
            "id" => [
                "name" => "id",
                "type" => Type::int(),
                "rules" => ["required"],
            ],
        ];
    }
    public function resolve($root, $args)
    {
        $user = User::findOrFail($args["id"]);
        return $user->delete() ? true : false;
    }
}

 

Jika selesai maka strukturnya menjadi berikut

 

Registrasi GraphQL User

Kalau sudah proses diatas, kita lanjutkan melakukan registrasi pada file graphql.php di folder config

return [
...
'schemas' => [
	'default' => [
		'query' => [
			'user' => App\GraphQL\Queries\UserQuery::class,
			'users' => App\GraphQL\Queries\UsersQuery::class,
		],
		'mutation' => [
			// Create a user
			'createUser' => App\GraphQL\Mutations\CreateUserMutation::class,
			// update user
			'updateUser' => App\GraphQL\Mutations\UpdateUserMutation::class,
			// delete a user
			'deleteUser' => App\GraphQL\Mutations\DeleteUserMutation::class,
		],
		'middleware' => [],
		'method' => ['get', 'post'],
	],
],
'types' => [
	'User' => App\GraphQL\Types\UserType::class,
],
...
]

 

Run Project dan Tes di Postman

Saatnya kita run project GraphQL kita dengan perintah berikut 

php artisan serve

Setelah jalan, untuk testing GraphQL disini saya menggunakan Software Postman

Setelah masuk ke Postman atur endpoint dengan method POST , method POST akan digunakan untuk proses CRUD

http://127.0.0.1:8000/graphql

Dan pada tab Body pilih GraphQL

 

 

Get semua data user

Untuk mendapatkan semua data user bisa menggunakan query berikut yang dimana bagian id, name, email dapat kita hapus atau tambahkan sesuai keperluan data yang diambil

{
  users {
    id,
    name,
    email
  }
}

 

 

Get data user dari ID

{
  user(id: 10) {
    id,
    name,
    email
  }
}

 

 

Membuat user baru

mutation createUser {
createUser(
    name: "Padhilah", 
    email: "padhil@padhil.com", 
    password: "password") 
    {
        id
        name
        email
    }
}

 

 

Update data user

mutation updateUser {
updateUser(
    id: 11,
    name: "Kodee", 
    email: "kodee@padhil.com", 
    password: "password") 
    {
        id
        name
        email
    }
}

 

 

Delete data user

mutation deleteUser {
deleteUser(
    id: 11
)
}

 

 

Selesai sudah tutorial menggunakan GraphQL pada Laravel dan semoga bermanfaat.

Untuk full source code dapat kalian lihat disini dan terimakasih sudah berkunjung

https://github.com/padhilahm/GraphQL-Laravel-9

Comments (3)

client

Ilmi

2 years ago

sankyo bro

Reply
client

Teknik Informatika

1 year ago

Bagaimana cara membuat operasi CRUD (Create, Read, Update, Delete) menggunakan GraphQL pada Laravel 9? <a href="https://journals.telkomuniversity.ac.id/">Tel U</a>

Reply
client

Admin

Penulis 1 year ago

Silahkan pak ikut tutorial saya diatas, semoga membantu 🙂

Leave a Reply

Categories

Tags

Recent Post