Iman Sugirman

Laravel baru-baru ini sudah mengeluarkan First Partynya untuk Implementasi **Authentication** dengan **Sanctum**  package dari First party Laravel Juga. Berikut adalah Sedikit penjelasan Sanctum :

**Laravel Sanctum :**

Laravel Sanctum menyediakan sistem otentikasi kelas bulu untuk SPA (aplikasi satu halaman), aplikasi seluler, dan API berbasis token sederhana. Sanctum memungkinkan setiap pengguna aplikasi Anda menghasilkan beberapa token API untuk akun mereka. Token ini dapat diberikan kemampuan / cakupan yang menentukan tindakan mana yang diizinkan untuk dilakukan oleh token.

**Laravel Breeze :**

Laravel Breeze adalah implementasi minimal dan sederhana dari semua fitur otentikasi Laravel, termasuk login, registrasi, reset kata sandi, verifikasi email, dan konfirmasi kata sandi. Lapisan tampilan default Laravel Breeze terdiri dari template Blade sederhana yang ditata dengan Tailwind CSS.

Laravel Breeze akan kita gunakan sebagai backend Api dan nanti akan kita gunakan Nextjs untuk Front end. Nah mari kita mulai sekarang untuk menginstall dan menjajal `Laravel Breeze` dan `Laravel Sanctum Beraksi`

Pertama kita buat Project Laravel terlebih dahulu menggunakan [Laravel Installer](https://laravel.com/docs/9.x/installation) dan saya biasa menggunakan **Valet** :

```bash
laravel new breezebackend && cd breezebackend
```
Sekarang kita install laravel breeze 
```bash
composer require laravel/breeze --dev
```
Lalu kita publish package breeze untuk Api only :

```bash
php artisan breeze:install api
// dan masukan juga 
php artisan migrate
```
dan nanti akan menghasilkan beberapa file di `App/Http/Controllers/Auth`.

Oke Sekarang kita sudah membuat Authentication Setup Untuk Api dan sekarang kita buat Nextjs nya. 

```bash
yarn create next-app breezefrontend
cd breezefrontend
```
Install beberapa package npm :

```bash
yarn add axios swr --save
```
Buat file di folder `hooks` jika belum ada buat terlebih dahulu foldernya, dan filenya seperti ini :

```js
import useSWR from 'swr'
import axios from '@/lib/axios'
import { useEffect } from 'react'
import { useRouter } from 'next/router'

export const useAuth = ({ middleware, redirectIfAuthenticated } = {}) => {
    const router = useRouter()

    const { data: user, error, revalidate } = useSWR('/api/user', () =>
        axios
            .get('/api/user')
            .then(res => res.data)
            .catch(error => {
                if (error.response.status !== 409) throw error

                router.push('/verify-email')
            }),
    )

    const csrf = () => axios.get('/sanctum/csrf-cookie')

    const register = async ({ setErrors, ...props }) => {
        await csrf()

        setErrors([])

        axios
            .post('/register', props)
            .then(() => revalidate())
            .catch(error => {
                if (error.response.status !== 422) throw error

                setErrors(Object.values(error.response.data.errors).flat())
            })
    }

    const login = async ({ setErrors, setStatus, ...props }) => {
        await csrf()

        setErrors([])
        setStatus(null)

        axios
            .post('/login', props)
            .then(() => revalidate())
            .catch(error => {
                if (error.response.status !== 422) throw error

                setErrors(Object.values(error.response.data.errors).flat())
            })
    }

    const forgotPassword = async ({ setErrors, setStatus, email }) => {
        await csrf()

        setErrors([])
        setStatus(null)

        axios
            .post('/forgot-password', { email })
            .then(response => setStatus(response.data.status))
            .catch(error => {
                if (error.response.status !== 422) throw error

                setErrors(Object.values(error.response.data.errors).flat())
            })
    }

    const resetPassword = async ({ setErrors, setStatus, ...props }) => {
        await csrf()

        setErrors([])
        setStatus(null)

        axios
            .post('/reset-password', { token: router.query.token, ...props })
            .then(response => router.push('/login?reset=' + btoa(response.data.status)))
            .catch(error => {
                if (error.response.status != 422) throw error

                setErrors(Object.values(error.response.data.errors).flat())
            })
    }

    const resendEmailVerification = ({ setStatus }) => {
        axios
            .post('/email/verification-notification')
            .then(response => setStatus(response.data.status))
    }

    const logout = async () => {
        if (! error) {
            await axios.post('/logout')

            revalidate()
        }

        window.location.pathname = '/login'
    }

    useEffect(() => {
        if (middleware === 'guest' && redirectIfAuthenticated && user) router.push(redirectIfAuthenticated)
        if (middleware === 'auth' && error) logout()
    }, [user, error])

    return {
        user,
        register,
        login,
        forgotPassword,
        resetPassword,
        resendEmailVerification,
        logout,
    }
}
```
Jika sudah maka penggunaannya nanti di page login contohnya :

```js
import { useAuth } from '@/hooks/auth'
...
const { login } = useAuth({
        middleware: 'guest',
        redirectIfAuthenticated: '/dashboard',
})

...

// Functionnya seperti ini :
login({ email, password, setErrors, setStatus })

```

Bagian Register juga buat seperti ini :

```js
import { useAuth } from '@/hooks/auth'
...
const { register } = useAuth({
        middleware: 'guest',
        redirectIfAuthenticated: '/dashboard',
})

...

// Functionnya seperti ini :
register({ name, email, password, password_confirmation, setErrors })

```

Laravel baru-baru ini sudah mengeluarkan First Partynya untuk Implementasi Authentication dengan Sanctum package dari First party Laravel Juga

Laravel Breeze Api Untuk Nextjs

Untuk Membuat Pivot table di laravel sangat dimudahkan karna memang power Eloquent sendiri memang sangat Powerfull. dan sekarang saya akan membahas Untuk Relasi Data Pivot antara table `product` dan `tag` sekarang bisa ditambahkan table `product_tag` agar kita lebih mudah dalam memanage Relasi Pivot Table:

```bash
php artisan make:migration create_product_tag_table
```

dan sekarang sudah ada file `xxx_create_product_tag_table` dan sekarang tambahkan di schema file migration tersebut seperti ini :

```php
...
Schema::create('product_tag', function (Blueprint $table) {
    $table->id();
    // kolom product_id akan direlasikan ke table product
    $table->foreignId('product_id')->constrained('product');
    // kolom tag_id akan direlasikan ke table product
    $table->foreignId('tag_id')->constrained('tag');
    $table->timestamps();
});
...
```

Sekarang buat model untuk table tersebut agar nanti bisa kita relasikan menggunakan Table itu:

```bash
php artisan make:model ProductTag
```

Edit file `ProductTag` model menjadi seperti ini :

```php
...
use Illuminate\Database\Eloquent\Relations\Pivot;
// Di Class ganti Model Menjadi Pivot
class ProductTag extends Pivot
{
    use HasFactory;

    // Relasi Ke Model Product
    public function product(): BelongsTo
    {
        return $this->belongsTo(Product::class, 'product_id');
    }

    // Relasi Ke Model Tag

    public function tag(): BelongsTo
    {
        return $this->belongsTo(Tag::class, 'tag_id');
    }

}
...

```

Sekarang kita sudah berhasil membuat relasi dengan model baru yaitu `ProductTag` dan sekarang kita ubah dan tambahkan relasi model `Product` nya seperti ini :

```php
public function tags(): BelongsToMany
{
    return $this->belongsToMany(Tag::class, 'product_tag', 'product_id', 'tag_id')
                ->using(ProductTag::class);
}
```

### Proses Merelasikan ketika membuat Product

Sekarang kita buat proses di controller `ProductController` ini bisa juga dengan nama file yang anda buat sebelumnya di tahap proses yang diinginkan:

```php
...
// Proses Create Product
$product = Product::create(...);
// Proses Relasi ke Tags yang tadi kita buat
$product->tags()->attach($request->input('tags'));
```

### Query Relasi Laravel Pivot Table

Relasi Load di Laravel Untuk Menarik data load tags dalam product bisa berbagai cara, saya lebih menggunakan cara yang simple seperti ini :

```php
...
// Cari produk berdasarkan parameter :id
$product = Product::find($id);
// Load data tags yang berhubungan dengan product
$product->load('tags');

return view('product.show', ['product' => $product]);
```


Untuk Membuat Pivot table di laravel sangat dimudahkan karna memang power Eloquent sendiri memang sangat Powerfull. dan sekarang saya akan membahas Untuk Relasi Data Pivot

Laravel Strategy Product Tag Pivotable

Pada setiap aplikasi biasanya ada beberapa batasan untuk beberapa orang. Hal ini bisa dibatasi berdasarkan `roles` atau jabatan seseorang dalam sebuah perusahaan, atau jika jabatan tersebut ada lebih dari 1 orang dan masing-masingnya ada beberapa perbedaan maka ada juga fungsi `permission` dalam sebuah aplikasi, yang berfungsi untuk memilah dan memilih beberapa akses yang bisa disesuaikan dengan jabatan atau orang didalamnya.

Solusi untuk melakukan pembatasan `roles` dan `permission` itu menggunakan package dari **Spatie** yang memang sudah banyak dipakai oleh para developer laravel.

### Instalasi Laravel Permission dari Spatie Package
Untuk menginstal anda bisa menulis perintah :

```bash
composer require spatie/laravel-permission
```

**Opsional**: Package akan didaftarkan secara otomatis. Atau Anda dapat menambahkan di `app.php` secara manual di file `config/app.php` Anda:

```php
'providers' => [
    // ...
    Spatie\Permission\PermissionServiceProvider::class,
];
```
Setelah instalasi maka anda bisa mempublish file config dengan cara :

```bash
php artisan vendor:publish --provider="Spatie\Permission\PermissionServiceProvider"
```
Dan file `permission.php` akan ada di folder `config` anda untuk anda bisa mengkonfigurasikan pengaturan permission. Jangan lupa setelah anda mempublish anda sebaiknya mengoptimasikan dan clear cache untuk aplikasi anda.

```bash
php artisan optimize:clear
 # or
php artisan config:clear
```
Jalankan perintah migration dari console laravel anda. 

```bash
php artisan migrate
```
### Integrasikan Dengan Model User anda
Integrasikan permission dengan `User` model anda yang berada di `App\Models` :

```php
use Illuminate\Foundation\Auth\User as Authenticatable;
use Spatie\Permission\Traits\HasRoles;

class User extends Authenticatable
{
    use HasRoles;

    // ...
}
```
Untuk membuat salah satu **Role** anda bisa menggunakan `eloquent` dengan cara seperti ini :

```php
use Spatie\Permission\Models\Role;

$role = Role::create(['name' => 'writer']);
```
Maka hasilnya anda akan melihat di database tabel `roles` akan tampil `writer`. Selanjutnya anda bisa membuat `permission` dengan `eloquent` seperti ini :

```php
use Spatie\Permission\Models\Permission;

$permission = Permission::create(['name' => 'edit_articles']);
```

Lalu penggabungan dalam setiap role itu jika memiliki permission maka akan seperti ini :
```php
$role->givePermissionTo($permission);
```
yang mana artinya adalah `$role` yang bernama `writer` memiliki izin untuk `edit_articles` jika anda ingin mengedit roles tersebut maka nanti anda harus menggunakan `eloquent` di method `update` seperti ini :

```php
$role->syncPermissions($permissions);
```

### Menetapkan User Mempunyai Salah Satu Roles
Selanjutnya anda akan menetapkan salah satu **User** anda akan menggunakan kode seperti ini :

```php
// User dengan id 1
$user = User::find(1);

// User ditetapkan sebagai `writer` dan sudah terotomatis user ini mendapatkan izin permission yang berkaitan dengan roles writer
$user->assignRole('writer');

// Atau anda bisa juga menetapkan 2 roles sekaligus
$user->assignRole('writer', 'admin');

// Dan ketika anda melakukan update bisa juga menggunakan 
$user->syncRoles(['writer', 'admin']);
```
Dan anda juga bisa mencari user dengan roles tertentu menggunakan Eloquent :

```php
// User mana saja yang memiliki roles writer
$user->hasRole('writer');
```
Setelah anda men-setup dan menentukan user tersebut ditetapkan roles sebagai `writer` contohnya. Ini tidak bisa langsung anda gunakan pembatasannya di `route` laravel. Untuk lebih lengkap di laravel ada yang berfungsi sebagai `middleware` dan package ini bisa anda gunakan sebagai `middleware` dengan cara menggunakan method `can` bawaan dari **Laravel Gate** dan roles tertentu.

Dan nanti akan bisa digunakan seperti ini di file `route` anda :

```php
Route::group(['middleware' => ['can:edit_articles']], function () {
    //
});
```
Maka dari itu anda harus memasukan `middleware` bawaan dari Spatie Package dengan cara mengedit file `app/Http/Kernel.php` seperti ini :

```php
protected $routeMiddleware = [
    // ...
    'role' => \Spatie\Permission\Middlewares\RoleMiddleware::class,
    'permission' => \Spatie\Permission\Middlewares\PermissionMiddleware::class,
    'role_or_permission' => \Spatie\Permission\Middlewares\RoleOrPermissionMiddleware::class,
];
```

Anda bisa menggunakan Pembatasan `route` dengan cara seperti ini :

```php
Route::group(['middleware' => ['role:super-admin']], function () {
    //
});

Route::group(['middleware' => ['permission:publish articles']], function () {
    //
});

Route::group(['middleware' => ['role:super-admin','permission:publish articles']], function () {
    //
});

Route::group(['middleware' => ['role_or_permission:super-admin|edit articles']], function () {
    //
});

Route::group(['middleware' => ['role_or_permission:publish articles']], function () {
    //
});
```
Atau bisa juga menggunakan multi dengan cara menambahkan pipa `|` seperti ini :

```php
Route::group(['middleware' => ['role:super-admin|writer']], function () {
    //
});

Route::group(['middleware' => ['permission:publish articles|edit articles']], function () {
    //
});

Route::group(['middleware' => ['role_or_permission:super-admin|edit articles']], function () {
    //
});
```

Tidak hanya itu anda juga masih bisa membatasi di `Controller` dalam method `__construct` seperti ini :

```php
public function __construct()
{
    $this->middleware(['role:super-admin','permission:publish articles|edit articles']);
}
```
atau bisa seperti ini juga :

```php
public function __construct()
{
    $this->middleware(['role_or_permission:super-admin|edit articles']);
}
```

Jika anda ingin menggunakan Custom Exception dengan cara menambahkan di file `app/Exceptions/Handler.php` dengan cara seperti ini :

```php
public function render($request, Throwable $exception)
{
    if ($exception instanceof \Spatie\Permission\Exceptions\UnauthorizedException) {
        return response()->json([
            'responseMessage' => 'You do not have the required authorization.',
            'responseStatus'  => 403,
        ]);
    }

    return parent::render($request, $exception);
}
```
### Membatasi View Dengan Blade Directive
Jika sebelumnya anda bisa membatasi `route` di laravel dengan `middleware` anda bisa juga membatasi tampilan dengan menggunakan teknik blade directive contohnya saja ketika roles manager bisa melihat tampilan **a** dan tidak bisa melihat tampilan **b** namun seorang writer / roles lain tidak bisa melihat tampilan **a** namun bisa melihat tampilan **b** anda bisa menggunakan metode seperti ini :

```php
@role('manager')
    a
@else
    b
@endrole

// Atau bisa juga spesifik

@role('manager')
    a
@else
    b
@endrole

// Bisa juga menggunakan @hasrole

@hasrole('manager')
    I am a manager!
@else
    I am not a manager...
@endhasrole

```
Jika ingin menggunakan method `can` anda bisa menggunakan seperti ini :

```php
@can('edit_articles')
  //
@endcan
```

atau 

```php
@if(auth()->user()->can('edit articles') && $some_other_condition)
  //
@endif
```

Untuk Lebih jelasnya anda bisa melihat dokumentasi [Spatie Permission](https://spatie.be/docs/laravel-permission/v4/basic-usage/blade-directives)


Demikian tutorial tentang **Menggunakan Laravel Permission dari Spatie**

Pada setiap aplikasi biasanya ada beberapa batasan untuk beberapa orang. Hal ini bisa dibatasi berdasarkan roles atau jabatan seseorang

Menggunakan Laravel Permission dari Spatie

### Bagaimana Cara Kerja Homebrew
Pengguna Mac tingkat lanjut mungkin menghargai menggunakan manajer paket Homebrew, yang sangat menyederhanakan proses pemasangan perangkat lunak dan alat baris perintah pada Mac

#### Hello Bro :computer:

Misalnya, jika Anda ingin mudah menginstal alat baris perintah favorit di Mac seperti tong kecil, htop, wget, nmap, pohon, irssi, tautan, colordiff, atau hampir semua utilitas baris perintah unix lain yang dikenal, Anda dapat melakukannya dengan mudah perintah. Homebrew mengunduh dan membuat paket untuk Anda.

Ini jelas ditujukan untuk pengguna Mac yang lebih teknis dan cerdas yang menghabiskan banyak waktu di baris perintah. Meskipun tidak ada masalah khusus untuk pengguna pemula yang memasang Homebrew di Mac mereka, kemungkinan pemula merasa berguna adalah tipis, kecuali mereka bermaksud untuk mempelajari lingkungan baris perintah. Bandingkan itu untuk memberi kekuatan kepada pengguna yang praktis tinggal di lingkungan terminal, apakah pengguna Mac lama atau bermigrasi ke platform dari dunia Windows atau Linux, yang akan segera melihat nilai Homebrew.

### Persyaratan untuk Memasang Homebrew di Mac OS
Prasyarat untuk menginstal Homebrew pada Mac termasuk yang berikut:

  * Mac menjalankan Mac OS X 10.10 atau lebih baru, meskipun versi sebelumnya didukung
  * Menggunakan `Command Line Tools` Alat Baris Perintah harus diinstal pada Mac (baik secara mandiri atau melalui Xcode)
  * Pengetahuan tentang baris perintah dan menggunakan `bash` atau `zsh`

### Cara Memasang Homebrew di Mac OS
Cara termudah untuk menginstal Homebrew adalah melalui ruby dan curl, diselesaikan dengan satu perintah. Pendekatan ini sama untuk menginstal Homebrew di semua versi Mac OS dan Mac OS X yang didukung.

  * Buka aplikasi "Terminal", yang ditemukan di / Aplikasi / Utilitas

  * Masukkan perintah berikut ke dalam satu baris terminal:

  * Tekan Return dan Anda akan melihat serangkaian baris tentang apa yang akan dipasang skrip dan di mana, tekan Kembali lagi untuk menyetujui atau tekan Escape untuk membatalkan

  * Masukkan kata sandi administrator (diperlukan oleh eksekusi `sudo`) untuk memulai instalasi

  * Pemasangan Homebrew akan memakan waktu cukup lama tergantung pada kecepatan koneksi Mac dan internet Anda, karena setiap paket yang diperlukan diunduh dan dipasang oleh skrip.

Sekarang Anda siap memasang paket perangkat lunak melalui Homebrew, atau Anda dapat membaca dokumentasi bantuan dengan perintah berikut:

Mengingstall Homebrew :

Masukan Perintah Pada Terminal Mac anda :

```bash
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
```
Lalu, buka bantuan dengan :

```bash
brew help
```

### Menginstal Paket Perangkat Lunak melalui Homebrew di Mac
Instalasi paket dengan Homebrew sangat mudah, cukup gunakan sintaks berikut:
``` bash
brew install [package name]
```
Misalnya, untuk menginstal `wget` melalui Homebrew Anda bisa menggunakan sintaks berikut:

``` bash
brew install wget
```
Sederhana, mudah. Setelah selesai Anda dapat menjalankan wget seperti biasa.

### Kesimpulan

Homebrew bukan satu-satunya cara untuk menginstal perangkat lunak baris perintah, Anda dapat menginstal alat baris perintah pada Mac sendiri dan kemudian mengkompilasi dan membuat perangkat lunak secara mandiri.

Sebagai contoh, kami mendiskusikan menginstal wget di Mac OS tanpa Homebrew di sini dan ini menggunakan konfigurasi dan proses yang umum. Tidak ada yang salah dengan pendekatan itu (dan boleh dibilang mungkin lebih baik bagi pengguna yang menginginkan paket terbatas dan jejak yang lebih ramping) tetapi jika Anda terbiasa dengan manajer paket seperti dpkg, apt-get, atau rpm Anda hampir pasti akan menghargai dan lebih suka menggunakan `Homebrew`.

### Referensi

  * Website Resmi [Homebrew](https://brew.sh)
  * Repository Github [Github](https://github.com/Homebrew)

Pengguna Mac tingkat lanjut mungkin menghargai menggunakan manajer paket Homebrew