DEV Community: Hilmi

Whatsapp Chat Link Generator

Hilmi — Thu, 06 Feb 2025 13:08:01 +0000

Looking for an easy way to create WhatsApp chat links? Meet Wazap, an open-source WhatsApp Chat Link Generator that simplifies how users connect via WhatsApp.

Wazap is perfect for individuals, businesses, or developers looking to:

Generate custom WhatsApp chat links effortlessly.
Create QR codes for seamless scanning and interaction.
Shorten URLs for clean, shareable links on social media or websites.

With Wazap, you can save time and focus on engaging your audience. Plus, it's completely open source!

💡 Features:

Custom WhatsApp Links: Tailor chat links with specific messages.
QR Code Generator: Easy for users to scan and connect instantly.
Custom Short URLs: Perfect for branding and social sharing.
No Registration Required: A hassle-free tool for quick use.

👩‍💻 Contribution Opportunity

Wazap is open for collaboration! If you're a developer passionate about open-source projects, visit our GitHub repository to contribute and enhance the tool:
👉 GitHub Repository - Wazap

Let’s make WhatsApp communication more seamless and effective together!

How to Implement Laravel Permission Package for Advanced User Roles

Hilmi — Thu, 06 Feb 2025 13:06:34 +0000

Laravel Permission - Managing user roles and permissions is a crucial aspect of building secure and scalable web applications. Whether you're developing an e-commerce platform, a content management system, or a SaaS solution, defining what users can and cannot do ensures both functionality and security. Laravel, known for its elegant syntax and robust ecosystem, provides excellent tools to streamline this process.

One such tool is the Laravel Permission package, a flexible and powerful solution that simplifies handling user roles and permissions. This package allows developers to implement granular access control, offering the ability to assign roles, define permissions, and enforce them across various parts of the application with ease.

In this blog, we’ll guide you step-by-step on how to set up and use the Laravel Permission package to create advanced user role hierarchies. From installation to best practices, you'll learn how to harness its capabilities to build a secure, efficient, and well-structured application. Let’s dive in and elevate your Laravel projects with sophisticated permission management!

Getting Started

In this article, I will try to explain everything in as much detail as possible, from installing Laravel and the required packages to implementing permissions using blade directives and middleware.

Install Fresh Laravel Project

Ok, let's start by installing a fresh Laravel project.

laravel new laravel-permission

Please install Laravel using the Laravel Installer as per the command above, or you can also use other methods as explained in the Laravel documentation.

cd laravel-permission

If the installation process is successful, let's enter the project directory using the command as in the example above.

Install Laravel UI

In this tutorial, we will need an authentication system. I will use the Laravel UI package to create a simple authentication system using Bootstrap.

composer require laravel/ui
php artisan ui bootstrap --auth
npm install && npm run dev

It's very easy to install the Laravel UI package. Please run the commands above sequentially on your terminal.

User Management

Okay, we already have an authentication system in our Laravel project. Next, let's create an admin user using Seeder.

php artisan make:seeder UserSeeder

Run the artisan command as above to create the UserSeeder class.

<?php

namespace Database\Seeders;

use App\Models\User;
use Illuminate\Database\Console\Seeds\WithoutModelEvents;
use Illuminate\Database\Seeder;

class UserSeeder extends Seeder
{
    /**
     * Run the database seeds.
     */
    public function run(): void
    {
        $user = User::create([
            'name'     => 'Admin',
            'email'    => 'admin@gmail.com',
            'password' => bcrypt('password')
        ]);
    }
}

If the UserSeeder class has been successfully created, open the file and add the script as above. So, with this class, we will create an Admin user.

php artisan db:seed --class=UserSeeder

Run the command as above to execute the UserSeeder class. If so, then we have an Admin user account for this project.

Okay, next, let's create user management. This will allow us to create and update user details such as name, email, and role.

php artisan make:controller UserController

Please run the artisan command as above to create a UserController file.

routes/web.php

Route::resource('users', App\Http\Controllers\UserController::class);

Open the routes/web.php file, then add route resources that we direct to the UserController.

Let's create a UserRequest class to handle validation on UserController.

php artisan make:request UserRequest

Please run the artisan command as above to create the Request file.

UserRequest.php

<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

class UserRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     */
    public function authorize(): bool
    {
        return true;
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array<string, \Illuminate\Contracts\Validation\ValidationRule|array<mixed>|string>
     */
    public function rules(): array
    {
        return [
            'name'     => 'required',
            'email'    => 'required|email|unique:users,email,' . $this->user->id,
        ];
    }
}

Open the UserRequest file we successfully generated earlier. Then, add variables like the example above to the function rules. Here, we will only validate the name and email input.

Okay, next, let's work on the UserController.

UserController.php

<?php

namespace App\Http\Controllers;

use App\Models\User;
use Illuminate\Http\Request;
use App\Http\Requests\UserRequest;

class UserController extends Controller
{
    public function index()
    {
        return view('users.index',[
            'users' => User::paginate(10)->withQueryString()
        ]);
    }

    public function create()
    {
        return view('users.form',[
            'user'   => new User(),
            'submit' => 'Create',
            'action' => route('users.store'),
            'method' => 'POST',
            'title'  => 'Create User'
        ]);
    }

    public function store(UserRequest $request)
    {
        $user = User::create([
            'name'     => $request->name,
            'email'    => $request->email,
            'password' => bcrypt('password')
        ]);

        return to_route('users.index')->with('success', 'User created successfully');
    }

    public function edit(User $user)
    {
        return view('users.form',[
            'user'   => $user,
            'submit' => 'Update',
            'action' => route('users.update', $user),
            'method' => 'PUT',
            'title'  => 'Edit User'
        ]);
    }

    public function update(UserRequest $request, User $user)
    {
        $user->update([
            'name'     => $request->name,
            'email'    => $request->email,
        ]);

        return to_route('users.index')->with('success', 'User updated successfully');
    }
}

I will convey this step's very basic information. Here, we will create an index method to return data from the User model and direct it to the users/index.blade.php view. I will also explain the use of reusable forms for our case study this time. We will only use one and the same view file for the create and edit forms.

Create Dynamic Title

Before we create a view for user management, let's make a dynamic title.

layouts/app.blade.php

Open the app.blade.php file, look for the code as below.

<title>{{ config('app.name', 'Laravel') }}</title>

Please change it to be like the code below.

<title>
    @hasSection('title')
        @yield('title') - {{ config('app.name', 'Laravel') }}
    @else
        {{ config('app.name', 'Laravel') }}
    @endif
</title>

With the code above, if we add @section('title') to the rendered view, the title that will be displayed is the section's value.

<!-- Left Side Of Navbar -->
<ul class="navbar-nav me-auto">

</ul>

And next, let's add the Users menu. Find the code as above, then add a new menu like the example code below.

<!-- Left Side Of Navbar -->
<ul class="navbar-nav me-auto">
    <li class="nav-item">
        <a class="nav-link" href="{{ route('users.index') }}">{{ __('Users') }}</a>
    </li>
</ul>

That way, we will have a new menu on the navbar.

Okay, next, let's create a new folder inside the resources/views folder named users and create an index.blade.php file inside that folder.

users/index.blade.php

@extends('layouts.app')
@section('title', 'Users')
@section('content')
<div class="container">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header d-flex justify-content-between">
                    <h1 class="fs-5">Users</h1>
                    <a href="{{ route('users.create') }}" class="btn btn-sm btn-primary">Create</a>
                </div>
                <div class="card-body">
                    @if (session('success'))
                    <div class="alert alert-success" role="alert">
                        {{ session('success') }}
                    </div>
                    @endif
                    <table class="table">
                        <thead>
                            <tr>
                                <th scope="col">#</th>
                                <th scope="col">Name</th>
                                <th scope="col">Email</th>
                                <th scope="col">Roles</th>
                                <th scope="col" class="text-end">Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse ($users as $user)
                            <tr>
                                <th scope="row">{{ $user->id }}</th>
                                <td>{{ $user->name }}</td>
                                <td>{{ $user->email }}</td>
                                <td>-</td>
                                <td class="text-end">
                                    <a href="{{ route('users.edit', $user->id) }}" class="btn btn-sm btn-primary">Edit</a>
                                </td>
                                @empty
                                <td colspan="5">No users found</td>
                                @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

Add the above code to the index.blade.php file we just created. This is a simple view, containing a users table and a create button to create a new user.

users/form.blade.php

@extends('layouts.app')
@section('title',"{$title}")
@section('content')
<div class="container">
    <div class="row d-flex justify-content-center">
        <div class="col-md-6">
            <div class="card">
                <div class="card-body">
                    <form action="{{ $action }}" method="post">
                        @if($method == 'PUT')
                        @method('PUT')
                        @endif
                        @csrf
                        <div class="mb-3">
                            <label for="name" class="form-label">Name</label>
                            <input type="text" class="form-control @error('name') is-invalid @enderror" id="name" name="name" value="{{ old('name') ?? $user->name }}">
                            @error('name')
                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>
                            @enderror
                        </div>
                        <div class="mb-3">
                            <label for="email" class="form-label">Email</label>
                            <input type="email" class="form-control @error('email') is-invalid @enderror" id="email" name="email" value="{{ old('email') ?? $user->email }}">
                            @error('email')
                            <div class="invalid-feedback">
                                {{ $message }}
                            </div>
                            @enderror
                        </div>
                        <button type="submit" class="btn btn-primary">
                        {{ $submit }}
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

Next, create a form.blade.php file inside the users folder and add the code above. In this form, we still only have the name and email input fields. We will add the role input field later.

Let's try the user management. Run the project with the php artisan server command, then login using the account we created using the seeder earlier.

The following is the user management view that we have created.

OK, up to this stage, we have successfully created user management.

Roles and Permission Management

We have arrived at the core explanation. At this stage, I will explain everything from installing the Laravel permissions package to creating role management and using Laravel permissions in basic usage.

Install and Setup Laravel Permissions Package

composer require spatie/laravel-permission
php artisan vendor:publish --provider="Spatie\Permission\PermissionServiceProvider"
php artisan migrate

Please install Laravel permissions package using the command as above in sequence.

models/User.php

use Spatie\Permission\Traits\HasRoles;
...
...
use HasRoles;

Open the User model file and add the HasRoles trait as in the example above.

php artisan make:seeder RoleSeeder
php artisan make:seeder PermissionSeeder

Create RoleSeeder and PermissionSeeder files by running the artisan commands as above.

RoleSeeder

<?php

namespace Database\Seeders;

use App\Models\User;
use Illuminate\Database\Seeder;
use Illuminate\Support\Facades\DB;
use Illuminate\Database\Console\Seeds\WithoutModelEvents;

class RoleSeeder extends Seeder
{
    /**
     * Run the database seeds.
     */
    public function run(): void
    {
        $roles = [
            [
                'name' => 'admin',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'editor',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ]
        ];

        DB::table('roles')->insert($roles);

        $admin = User::where('email', 'admin@gmail.com')->first();

        if ($admin) {
            $admin->assignRole('admin');
        }
    }
}

Open the RoleSeeder.php file and change the code in it to be like the example above. Here, we will create admin and editor roles and apply the admin role to the admin user.

php artisan db:seed --class=RoleSeeder

Execute the RoleSeeder file by running the seeder command as above.

PermissionSeeder.php

<?php

namespace Database\Seeders;

use Illuminate\Database\Seeder;
use Illuminate\Support\Facades\DB;
use Illuminate\Database\Console\Seeds\WithoutModelEvents;
use Spatie\Permission\Models\Role;

class PermissionSeeder extends Seeder
{
    /**
     * Run the database seeds.
     */
    public function run(): void
    {
        $permissions = [
            [
                'name' => 'user table',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'create user',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'edit user',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'delete user',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'post table',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'create post',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'edit post',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'delete post',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'role table',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ],
            [
                'name' => 'edit role',
                'guard_name' => 'web',
                'created_at' => now(),
                'updated_at' => now()
            ]
        ];

        DB::table('permissions')->insert($permissions);

        $adminRole = Role::where('name', 'admin')->first();

        if ($adminRole) {
            $permissions = DB::table('permissions')->pluck('id')->toArray();
            $adminRole->syncPermissions($permissions);
        }
    }
}

Next, open the PermissionSeeder file and change its code to be like the example above. Here, we will create permissions and apply all of those permissions to the admin role.

php artisan db:seed --class=PermissionSeeder

Execute the PermissionSeeder file using the artisan command as in the example above.

Let's update the users/index.blade.php view file.

Open users/index.blade.php, look for the code as below.

<td>-</td>

Then, change it to be like below.

<td>
    @forelse($user->roles as $role)
    <span class="badge bg-dark">{{ $role->name }}</span>
    @empty
    -
    @endforelse
</td>

With the code above, we will display the roles owned by the user.

Next, let's adjust the code we created in UserController. Change the code below.

public function create()
{
    return view('users.form',[
        'user'   => new User(),
        'submit' => 'Create',
        'action' => route('users.store'),
        'method' => 'POST',
        'title'  => 'Create User'
    ]);
}

Please change it to something like the one below.

public function create()
{
    return view('users.form',[
        'user'   => new User(),
        'submit' => 'Create',
        'action' => route('users.store'),
        'method' => 'POST',
        'title'  => 'Create User',
        'roles'  => Role::get()
    ]);
}

Here, we add the roles variable to get roles data from the Role model.

public function store(UserRequest $request)
{
    $user = User::create([
        'name'     => $request->name,
        'email'    => $request->email,
        'password' => bcrypt('password')
    ]);

    return to_route('users.index')->with('success', 'User created successfully');
}

Then, move on to the other method. Change the store method to the one below.

public function store(UserRequest $request)
{
    $user = User::create([
        'name'     => $request->name,
        'email'    => $request->email,
        'password' => bcrypt('password')
    ]);

    $user->assignRole($request->role);

    return to_route('users.index')->with('success', 'User created successfully');
}

Here we add the script $user->assignRole($request->role); to save the role that the user has selected.

public function edit(User $user)
{
    return view('users.form',[
        'user'   => $user,
        'submit' => 'Update',
        'action' => route('users.update', $user),
        'method' => 'PUT',
        'title'  => 'Edit User'
    ]);
}

Then, in the edit method, change it to something like below.

public function edit(User $user)
{
    return view('users.form',[
        'user'   => $user,
        'submit' => 'Update',
        'action' => route('users.update', $user),
        'method' => 'PUT',
        'title'  => 'Edit User',
        'roles'  => Role::get()
    ]);
}

The edit method is the same. Here, we add the roles variable to get role data from the Role model.

public function update(UserRequest $request, User $user)
{
    $user->update([
        'name'     => $request->name,
        'email'    => $request->email,
    ]);

    return to_route('users.index')->with('success', 'User updated successfully');
}

Next, adjust the update method to be as below.

public function update(UserRequest $request, User $user)
{
    $user->update([
        'name'     => $request->name,
        'email'    => $request->email,
    ]);

    $user->syncRoles($request->role);

    return to_route('users.index')->with('success', 'User updated successfully');
}

Here, we add $user->syncRoles($request->role); to synchronize the roles on that user.

use Spatie\Permission\Models\Role;

Don't forget to import the Role model in UserController.php

users/form.blade.php

<div class="mb-3">
    <label for="role" class="form-label">Role</label>
    <select class="form-select @error('role') is-invalid @enderror" id="role" name="role">
        <option value="">-- Select Role --</option>
        @foreach($roles as $role)
        <option value="{{ $role->name }}" {{ in_array($role->name, $user->roles->pluck('name')->toArray()) ? 'selected' : '' }}>{{ $role->name }}</option>
        @endforeach
    </select>
    @error('role')
    <div class="invalid-feedback">
        {{ $message }}
    </div>
    @enderror
</div>

Next, open the users/form.blade.php file, then add a select field like the code above.

Role Management

Ok, we will create role management to manage the permissions of each role.

php artisan make:controller RoleController

Let's create a RoleController. Please run the command as above to create a RoleController file.

RoleController

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Spatie\Permission\Models\Role;
use Spatie\Permission\Models\Permission;

class RoleController extends Controller
{
    public function index()
    {
        return view('roles.index',[
            'roles' => Role::paginate(10)->withQueryString()
        ]);
    }

    public function edit(Role $role)
    {
        return view('roles.form',[
            'role'        => $role,
            'permissions' => Permission::get(),
        ]);
    }

    public function update(Request $request, Role $role)
    {
        $role->syncPermissions($request->permissions);

        return to_route('roles.index')->with('success', 'Role updated successfully');
    }
}

Open the RoleController file that we just created, then adjust the code in it to be like the code above.

routes/web.php

Route::prefix('roles')->group(function () {
    Route::get('/', [App\Http\Controllers\RoleController::class, 'index'])->name('roles.index');
    Route::get('/{role}/edit', [App\Http\Controllers\RoleController::class, 'edit'])->name('roles.edit');
    Route::put('/{role}', [App\Http\Controllers\RoleController::class, 'update'])->name('roles.update');
});

Open routes/web.php, add a new route like the code above into the web.php file.

roles/index.blade.php

@extends('layouts.app')
@section('title', 'Roles')
@section('content')
<div class="container">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header d-flex justify-content-between">
                    <h1 class="fs-5">Roles</h1>
                </div>
                <div class="card-body">
                    @if (session('success'))
                    <div class="alert alert-success" role="alert">
                        {{ session('success') }}
                    </div>
                    @endif
                    <table class="table">
                        <thead>
                            <tr>
                                <th scope="col">#</th>
                                <th scope="col">Name</th>
                                <th scope="col">Permissions</th>
                                <th scope="col" class="text-end">Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse ($roles as $key => $role)
                            <tr>
                                <th scope="row">{{ ++$key }}</th>
                                <td>{{ $role->name }}</td>
                                <td>
                                    @forelse($role->permissions as $permission)
                                    <span class="badge bg-dark me-1">{{ $permission->name }}</span>
                                    @empty
                                    -
                                    @endforelse
                                </td>
                                <td class="text-end">
                                    <a href="{{ route('roles.edit', $role->id) }}" class="btn btn-sm btn-primary">Edit</a>
                                </td>
                            </tr>
                            @empty
                            <tr>
                                <td colspan="4">No roles found</td>
                            </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

Create a new folder inside the resources/views folder named roles and create an index.blade.php file inside the roles folder. Please copy the code above and paste it into the new file (index.blade.php).

roles/form.blade.php

@extends('layouts.app')
@section('title',"{$role->name}")
@section('content')
<div class="container">
    <div class="row d-flex justify-content-center">
        <div class="col-md-6">
            <div class="card">
                <div class="card-header">
                    <h1 class="fs-5">{{ $role->name }}</h1>
                </div>
                <div class="card-body">
                    <form action="{{ route('roles.update',$role->id) }}" method="post">
                        @method('PUT')
                        @csrf
                        <div class="row mb-2">
                            @foreach ($permissions as $permission)
                            <div class="col-md-4">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="{{ $permission->name }}" id="permission{{ $permission->id }}" name="permissions[]" {{ in_array($permission->id, $role->permissions->pluck('id')->toArray()) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="permission{{ $permission->id }}">
                                        {{ $permission->name }}
                                    </label>
                                </div>
                            </div>
                            @endforeach
                        </div>
                        <button type="submit" class="btn btn-primary">
                            Update
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

Then, create a new file named form.blade.php in the roles folder. Please copy the code above and paste it into the new file.

Next, we can add a new menu to the navbar.

<li class="nav-item">
        <a class="nav-link" href="{{ route('roles.index') }}">{{ __('Roles') }}</a>
</li>

Open the app.blade.php file, then add the code above to the app.blade.php file. Place it under the Users menu that we added earlier.

Now, let's try role management. Run the project, then open it in a browser. The table and form will display like the image below.

We have successfully created role management up to this point. In the following explanation, let's try to implement it both with a blade directive and with middleware.

Basic Usage

Okay, let's try what we've created.

Blade Directive

First, let's try using the blade directive. Please open the layouts/app.blade.php file.

<!-- Left Side Of Navbar -->
<ul class="navbar-nav me-auto">
    @can('user table')
    <li class="nav-item">
        <a class="nav-link" href="{{ route('users.index') }}">{{ __('Users') }}</a>
    </li>
    @endcan
    @can('role table')
    <li class="nav-item">
        <a class="nav-link" href="{{ route('roles.index') }}">{{ __('Roles') }}</a>
    </li>
    @endcan
    @can('post table')
    <li class="nav-item">
        <a class="nav-link" href="#">{{ __('Posts') }}</a>
    </li>
    @endcan
</ul>

In the menus section, please change it to be like the code above. With this code, it means that the Users menu can only be accessed by users or roles that have the "user table" permission. And the Roles menu can only be accessed by users or roles that have the "role table" permission. And the Posts menu, although we haven't created the management, we have created the permission, so we can try it by adding the Posts menu with the "post table" permission.

Now, you can try it by setting the permissions of each role (admin and editor). Then, try adding a user with a different role. Suppose you have set the editor role, which only has the following permissions: post table, create post, and edit post, and you add a new user with the editor role. Then, when you try to log in using the editor account, you should only see the Posts menu there.

Middleware

Okay, next, let's try using middleware. Laravel permission can be implemented using middleware in routes and controllers.

bootstrap/app.php

<?php

use Illuminate\Foundation\Application;
use Illuminate\Foundation\Configuration\Exceptions;
use Illuminate\Foundation\Configuration\Middleware;

return Application::configure(basePath: dirname(__DIR__))
    ->withRouting(
        web: __DIR__.'/../routes/web.php',
        commands: __DIR__.'/../routes/console.php',
        health: '/up',
    )
    ->withMiddleware(function (Middleware $middleware) {
        $middleware->alias([
            'role' => \Spatie\Permission\Middleware\RoleMiddleware::class,
            'permission' => \Spatie\Permission\Middleware\PermissionMiddleware::class,
            'role_or_permission' => \Spatie\Permission\Middleware\RoleOrPermissionMiddleware::class,
        ]);
    })
    ->withExceptions(function (Exceptions $exceptions) {
        //
    })->create();

Please open the bootstrap/app.php file, then adjust the withMiddleware section to be like the example above. Here, we will register the default middleware from the Laravel permission package.

Let's try to implement middleware on routes.

Open the routes/web.php file and look for the code below.

Route::prefix('roles')->group(function () {
    Route::get('/', [App\Http\Controllers\RoleController::class, 'index'])->name('roles.index');
    Route::get('/{role}/edit', [App\Http\Controllers\RoleController::class, 'edit'])->name('roles.edit');
    Route::put('/{role}', [App\Http\Controllers\RoleController::class, 'update'])->name('roles.update');
});

Then add middleware as below.

Route::prefix('roles')->group(function () {
    Route::get('/', [App\Http\Controllers\RoleController::class, 'index'])->name('roles.index')->middleware('can:role table');
    Route::get('/{role}/edit', [App\Http\Controllers\RoleController::class, 'edit'])->name('roles.edit')->middleware('can:edit role');
    Route::put('/{role}', [App\Http\Controllers\RoleController::class, 'update'])->name('roles.update')->middleware('can:edit role');
});

With the code as above, it means that to be able to access /roles, the user or role must have "role table" permission. And to access the /{role}/edit route, the user or role must have "edit role" permission.

UserController.php

public function __construct()
{
    $this->middleware(['permission:user table'])->only('index');
    $this->middleware(['permission:create user'])->only(['create', 'store']);
    $this->middleware(['permission:edit user'])->only(['edit', 'update']);
}

And finally, we can implement middleware on the controller. Please open the UserController.php file, then add the function __construct() as in the example above. The code above means that the index function can only be accessed by users or roles that have the "user table" permission. The create and store functions can only be accessed by users or roles that have the "create user" permission. The edit and update functions can only be accessed by users or roles that have the "edit user" permission.

Implementing advanced role and permission management in Laravel has never been easier, thanks to the Laravel Permission package. In this article, we’ve walked through the step-by-step process, starting with setting up a fresh Laravel project, installing the Laravel UI package for basic authentication, installing the Laravel Permission package, and finally implementing permissions using Blade directives and middleware.

By following this guide, you can ensure your application has robust access control while maintaining ease of management and scalability for future needs. A well-structured approach to roles and permissions not only enhances security but also provides flexibility to meet diverse user requirements.

We hope this tutorial helps you build more professional and secure applications. Feel free to experiment and explore the full potential of the Laravel Permission package to suit your project’s needs. Happy coding, and good luck!

Source Code: Laravel Permission

Error: unable to run private channel using Pusher in Laravel 10

Hilmi — Thu, 14 Mar 2024 14:15:58 +0000

Mar 13 '24 Comments: 1 Answers: 0

I'm creating a chat feature using pusher private channel. When someone from the same thread sends a message, other people in that thread receive the message.

I have created the code as bellow, but I get error messages:

Error: JSON returned from channel-authorization endpoint was invalid, yet status code was…

Open Full Question

Menjalankan Migration & Seeder Untuk Spesifik Class di Laravel

Hilmi — Fri, 14 Jul 2023 08:46:18 +0000

Dalam pengembangan aplikasi web menggunakan framework Laravel, migration dan seeder adalah dua fitur penting yang membantu dalam mengelola struktur database dan mengisi data awal. By default, Laravel menyediakan perintah untuk menjalankan semua migration dan seeder secara keseluruhan. Namun, terkadang kita mungkin ingin menjalankan migration atau seeder hanya untuk class tertentu. Dalam artikel ini, Kami akan membagikan cara menjalankan migration dan seeder secara spesifik untuk class di Laravel.

Menjalankan Migration untuk Spesifik Class

Migration dalam Laravel digunakan untuk mengelola struktur database. By default, Kita dapat menjalankan semua migration dengan perintah php artisan migrate. Namun, jika Kita hanya ingin menjalankan migration untuk class yang spesifik, Kita dapat menggunakan opsi --path saat menjalankan perintah migrate.

Berikut adalah langkah-langkah untuk menjalankan migration untuk spesifik class:

Buat migrasi baru menggunakan perintah Artisan berikut:

php artisan make:migration migration_name --create=table_name

Ganti "migration_name" dengan nama migration yang Kamu inginkan dan "table_name" dengan nama tabel yang ingin Kamu buat.

Setelah migrasi dibuat, buka file migrasi tersebut di direktori database/migrations. Di dalam method up(), tentukan perubahan yang ingin Kamu lakukan pada tabel yang sesuai dengan class migration ini.

   public function up()
   {
       Schema::create('table_name', function (Blueprint $table) {
           $table->increments('id');
           $table->string('column_name');
           // Tambahkan kolom lain sesuai kebutuhan Anda
           $table->timestamps();
       });
   }

Simpan dan tutup file migrasi. Sekarang, Kita dapat menjalankan migration ini untuk spesifik class dengan menggunakan opsi --path saat menjalankan perintah migrate:

php artisan migrate --path=/database/migrations/migration_file_name.php

Ganti "migration_file_name" dengan nama file migration yang baru saja Kita buat.

Dengan menggunakan opsi --path, Kita dapat menjalankan migration hanya untuk spesifik class dan menghindari migration yang tidak relevan.

Menjalankan Seeder untuk Spesifik Class

Seeder dalam Laravel digunakan untuk mengisi data awal ke dalam tabel database. By default, Kita dapat menjalankan semua seeder dengan perintah php artisan db:seed. Namun, jika Kita hanya ingin menjalankan seeder untuk spesifik class, Kita dapat menggunakan opsi --class saat menjalankan perintah db:seed.

Berikut adalah langkah-langkah untuk menjalankan seeder untuk spesifik class:

Buat seeder baru menggunakan perintah Artisan berikut:

php artisan make:seeder TableNameSeeder

Ganti "TableNameSeeder" dengan nama seeder yang Kamu inginkan.

Setelah seeder dibuat, buka file seeder tersebut di direktori database/seeders. Di dalam metode run(), tentukan logika untuk mengisi data awal ke dalam tabel yang sesuai dengan class seeder ini.

   public function run()
   {
       DB::table('table_name')->insert([
           'column1' => 'value1',
           'column2' => 'value2',
           // Tambahkan data lain sesuai kebutuhan Anda
       ]);
   }

Simpan dan tutup file seeder. Sekarang, Kita dapat menjalankan seeder ini untuk class yang spesifik dengan menggunakan opsi --class saat menjalankan perintah db:seed:

php artisan db:seed --class=TableNameSeeder

Ganti "TableNameSeeder" dengan nama seeder yang baru saja Kamu buat.

Dengan menggunakan opsi --class, Kita dapat menjalankan seeder hanya untuk class tertentu atau spesifik dan menghindari pengisian data yang tidak relevan.

Dalam pengembangan aplikasi Laravel, menjalankan migration dan seeder secara spesifik untuk class tertentu dapat memberikan fleksibilitas dan kontrol lebih dalam mengelola struktur database dan data awal Kita. Kita dapat memilih migration dan seeder yang ingin dijalankan dan menghindari yang tidak relevan, menjaga integritas dan efisiensi aplikasi Kita.

Implementasi Laravel Google Fonts Package by Spatie

Hilmi — Thu, 13 Jul 2023 23:18:33 +0000

Laravel Google Fonts - Google Font adalah koleksi font (huruf) yang disediakan secara gratis oleh Google. Google Fonts menyediakan ribuan opsi font yang dapat digunakan untuk mengubah tampilan teks di situs web, aplikasi, atau dokumen lainnya.

Salah satu keuntungan utama Google Fonts adalah aksesibilitasnya yang luas. Kita dapat mengunduh font-font tersebut dan menggunakannya secara bebas baik untuk penggunaan pribadi maupun komersial. Font-font tersebut juga dapat disematkan ke dalam situs web Kita dengan menggunakan kode HTML atau CSS yang disediakan oleh Google.

Dengan Google Fonts, Kita tidak perlu lagi mengandalkan font standar yang terbatas yang disediakan oleh sistem operasi atau perangkat Kita. Kita dapat memilih font yang sesuai dengan style dan tujuan, baik itu untuk meningkatkan daya tarik visual atau untuk meningkatkan kelegibilitas teks.

Selain itu, Google Fonts juga menyediakan fitur-fitur seperti kemampuan untuk melihat pratinjau teks dalam berbagai font, menyesuaikan berbagai parameter font seperti ukuran dan ketebalan, serta mendapatkan rekomendasi font yang sesuai dengan kebutuhan Kita.

Penggunaan Google Fonts sangat mudah, Kita hanya perlu menambahkan kode referensi ke font yang Kita pilih ke halaman web Kita, dan font tersebut akan diunduh dan ditampilkan pada pengunjung situs Kita secara otomatis.

Secara keseluruhan, Google Fonts adalah resource yang sangat berguna bagi para desainer, pengembang web, dan siapa pun yang ingin meningkatkan tampilan teks di proyek mereka dengan memanfaatkan beragam pilihan font berkualitas tinggi yang disediakan secara gratis oleh Google.

Nah, di artikel ini saya akan share cara implementasi google fonts di Laravel menggunakan laravel google fonts package dari Spatie.

Seperti yang telah saya mention di awal, Google Fonts menawarkan berbagai opsi font yang menarik, dan dengan bantuan Laravel Google Fonts Package dari Spatie, Kita dapat dengan mudah mengintegrasikan dan mengelola font-font tersebut dalam proyek Laravel Kita.

Spatie, perusahaan pengembangan perangkat lunak terkenal, menyediakan banyak Laravel Package yang sangat berguna dan memudahkan pengembang aplikasi dengan laravel, dan salah satunya adalah laravel-google-fonts. Package ini memungkinkan Kita untuk mengelola font dari Google Fonts dengan mudah, sehingga Kita dapat memperkaya tampilan teks pada situs web Kita. Mari kita bahas langkah-langkah implementasi dan manfaat menggunakan package ini. 👇 🚀

Step 1: Install Laravel Google Fonts Package
Step 2: Implementasi Laravel Google Fonts Package
Menggunakan dengan spatie/laravel-csp

Step 1: Install Laravel Google Fonts Package

Untuk installasi laravel google fonts package sangat mudah sekali, berikut ini adalah cara menerapkan laravel google fonts package. Sebelum install laravel google fonts package, silahkan buka terminal lalu masuk ke direktori laravel project kalian. Kemudian Install google fonts package via composer dengan menjalankan perintah seperti di bawah ini.

composer require spatie/laravel-google-fonts

Jika proses installasi google fonts package sudah selesai, silahkan lanjutkan langkah mem-publish file config google fonts dengan perintah di bawah ini. Dengan perintah tersebut, sekarang kita sudah mempunyai file config google fonts.

php artisan vendor:publish --provider="Spatie\GoogleFonts\GoogleFontsServiceProvider" --tag="google-fonts-config"

Buka file google-fonts.php yang berada di dalam folder config. File config/google-fonts.php akan seperti di bawah ini.

return [

    /*
     * Here you can register fonts to call from the @googlefonts Blade directive.
     * The google-fonts:fetch command will prefetch these fonts.
     */
    'fonts' => [
        'default' => 'https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,400;0,700;1,400;1,700',
    ],

    /*
     * This disk will be used to store local Google Fonts. The public disk
     * is the default because it can be served over HTTP with storage:link.
     */
    'disk' => 'public',

    /*
     * Prepend all files that are written to the selected disk with this path.
     * This allows separating the fonts from other data in the public disk.
     */
    'path' => 'fonts',

    /*
     * By default, CSS will be inlined to reduce the amount of round trips
     * browsers need to make in order to load the requested font files.
     */
    'inline' => true,

    /*
     * When something goes wrong fonts are loaded directly from Google.
     * With fallback disabled, this package will throw an exception.
     */
    'fallback' => ! env('APP_DEBUG'),

    /*
     * This user agent will be used to request the stylesheet from Google Fonts.
     * This is the Safari 14 user agent that only targets modern browsers. If
     * you want to target older browsers, use different user agent string.
     */
    'user_agent' => 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15',

];

Step 2: Implementasi Laravel Google Fonts Package

Untuk menambahkan font ke aplikasi atau laravel project kita, copy embed code dari google font, daftarkan di config seperti di bawah ini dan nantinya kita akan menggunakan @googlefonts blade directive di file blade atau view.

// config/google-fonts.php

return [
    'fonts' => [
        'default' => 'https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,400;0,700;1,400;1,700&display=swap',
        'code' => 'https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,700;1,400&display=swap',
    ],
];

{{-- resources/views/layouts/app.blade.php --}}

<head>
    {{-- Loads Inter --}}
    @googlefonts

    {{-- Loads IBM Plex Mono --}}
    @googlefonts('code')
</head>

Dengan cara seperti Ini, kita akan membuat inline CSS, sehingga browser needs to do one less round-trip. Jika Kalian lebih suka file CSS eksternal, Kalian dapat menonaktifkan inline option dalam konfigurasi package. Font disimpan dalam folder font pada disk public. Kita harus menjalankan php artisan storage:link untuk memastikan file dapat disajikan melalui HTTP. Jika Kalian ingin menyimpan font di repositori git, pastikan storage/app/public tidak di ignore.

Jika kita ingin memastikan font siap disajikan sebelum siapapun mengunjungi situs kita, kita dapat mengambilnya terlebih dahulu dengan perintah artisan seperti di bawah ini.

php artisan google-fonts:fetch

Menggunakan dengan spatie/laravel-csp

Jika kamu juga menggunakan spatie/laravel-csp untuk manage Content Security Policy, kamu bisa pass array ke blade directive dan menambahkan nonce option seperti di bawah ini.

{{-- resources/views/layouts/app.blade.php --}}

<head>
    {{-- Loads Inter --}}
    @googlefonts(['nonce' => csp_nonce()])

    {{-- Loads IBM Plex Mono --}}
    @googlefonts(['font' => 'code', 'nonce' => csp_nonce()])
</head>

Dengan menggunakan Laravel Google Fonts Package dari Spatie, Kita dapat dengan mudah mengintegrasikan dan mengelola font dari Google Fonts dalam proyek Laravel Kita. Ini memberikan fleksibilitas dan kemudahan dalam memilih font yang sesuai dengan desain situs web Kita. Dengan tampilan font yang menarik dan profesional, tentunya situs web akan semakin memukau pengunjung.

Full Documentation: Laravel Google Fonts Package

Credit: Design illustrations by Storyset

Cara Menampilkan Data Berdasarkan Parameter Dua Tanggal di Laravel

Hilmi — Thu, 13 Jul 2023 15:34:46 +0000

Dalam pengembangan aplikasi web dengan menggunakan framework Laravel, seringkali kita perlu melakukan pengambilan data dari database berdasarkan rentang tanggal tertentu. Misalnya, kita ingin menampilkan data transaksi atau kegiatan antara dua tanggal yang telah ditentukan. Dalam artikel ini, kita akan membahas cara menampilkan data berdasarkan parameter dua tanggal di Laravel.

Step 1: Generate Model dan Migrasi Tabel
Step 2: Mengatur Tabel dan Kolom Tanggal
Step 3: Generate Route & Controller
Step 4: Setup View
Step 5: Testing

Step 1: Generate Model dan Migrasi Tabel

Langkah pertama yang perlu dilakukan adalah membuat model dan migrasi tabel yang akan digunakan untuk menyimpan data. Misalkan kita ingin menampilkan data transaksi, kita dapat membuat model "Transaction" dan migrasi tabel "transactions". Kita dapat menggunakan perintah artisan berikut untuk membuat model dan migrasi:

php artisan make:model Transaction -m

Step 2: Mengatur Tabel dan Kolom Tanggal

Setelah migrasi tabel dibuat, buka file migrasi yang terletak di direktori "database/migrations" dan tambahkan kolom date yang akan digunakan sebagai parameter pencarian. Misalnya, kita ingin menambahkan kolom "date" dengan tipe data "date" pada tabel transactions. Berikut adalah contoh kode migrasi:

public function up()
{
    Schema::create('transactions', function (Blueprint $table) {
        $table->id();
        $table->date('date');
        // tambahkan kolom lainnya
        $table->timestamps();
    });
}

Setelah menambahkan kolom date, jalankan migrasi dengan perintah php artisan migrate.

Step 3: Generate Route & Controller

Selanjutnya, kita perlu membuat route untuk menampilkan data berdasarkan parameter dua tanggal. Buka file "routes/web.php" dan tambahkan route berikut:

Route::get('transactions', [TransactionController::class,'index'])->name('transactions.index');

Setelah itu, buat controller dengan perintah berikut:

php artisan make:controller TransactionController

Buka file controller yang baru dibuat dan tambahkan method "index" seperti di bawah ini:

use App\Models\Transaction;
use Illuminate\Http\Request;

public function index(Request $request)
{
    $startDate = $request->start_date;
    $endDate = $request->end_date;

    $transactions = Transaction::whereBetween('date', [$startDate, $endDate])->get();

    return view('transactions.index', compact('transactions'));
}

Step 4: Setup View

Selanjutnya, kita perlu membuat view untuk menampilkan data transaksi. Buka file "resources/views/transactions/index.blade.php" dan tambahkan kode berikut:

<form action="{{ route('transactions.index') }}" method="GET">
    <input type="date" name="start_date" required>
    <input type="date" name="end_date" required>
    <button type="submit">Filter</button>
</form>

<table>
    <thead>
        <tr>
            <th>Date</th>
            <th>Name</th>
            <!-- tambahkan kolom lainnya -->
        </tr>
    </thead>
    <tbody>
        @foreach($transactions as $transaction)
        <tr>
            <td>{{ $transaction->date}}</td>
            <td>{{ $transaction->name}}</td>
            <!-- tambahkan kolom lainnya -->
        </tr>
        @endforeach
    </tbody>
</table>

Step 5: Testing

Terakhir, kita bisa mengakses halaman "transactions" pada browser dan memasukkan tanggal awal dan tanggal akhir pada form filter. Setelah itu, klik tombol "Filter" untuk menampilkan data transaksi antara dua tanggal yang telah ditentukan.

Dalam contoh di atas, kita menggunakan metode GET untuk mengirimkan parameter tanggal ke route "transactions.index". Di controller, kita menggunakan metode "whereBetween" untuk mengambil data transaksi yang tanggalnya berada di antara rentang yang ditentukan. Data transaksi kemudian dikirimkan ke view "transactions.index" untuk ditampilkan.

Dengan mengikuti langkah-langkah di atas, Kita sekarang memiliki cara untuk menampilkan data berdasarkan parameter dua tanggal di Laravel. Kalian dapat mengkustomisasi kode tersebut sesuai kebutuhan aplikasi Kalian dan menambahkan fitur tambahan seperti validasi data input atau pengurutan hasil berdasarkan tanggal.

Credit: App illustrations by Storyset

Colega: Membawa Bisnis Anda ke Tingkat Selanjutnya dengan Website Profesional

Hilmi — Sun, 09 Jul 2023 09:38:13 +0000

Dalam era digital saat ini, memiliki kehadiran online yang kuat adalah suatu keharusan bagi setiap bisnis. Website yang menarik dan fungsional menjadi salah satu kunci kesuksesan dalam membangun citra merek yang kuat dan mencapai audiens yang lebih luas. Apakah Anda sedang mencari solusi terbaik untuk membantu membangun website yang memukau dan efektif? Jangan khawatir, Colega hadir untuk Anda.

Mengapa Memilih Colega?

Colega adalah perusahaan profesional dalam bidang pembuatan website yang berkomitmen untuk membantu bisnis Anda mencapai tingkat kesuksesan yang lebih tinggi. Kami menggabungkan kreativitas, keahlian teknis, dan pengalaman bertahun-tahun untuk memberikan solusi yang tepat dan berkualitas tinggi sesuai dengan kebutuhan unik bisnis Anda.

Keunggulan Colega:

Desain yang Menarik dan Responsif: Tim desain Colega memiliki keahlian dalam menciptakan tampilan yang menarik dan modern untuk website Anda. Kami memahami pentingnya kesan pertama yang baik, dan itulah mengapa kami menyediakan desain responsif yang memastikan website Anda tetap terlihat sempurna di semua perangkat, mulai dari desktop hingga ponsel pintar.
Fungsionalitas yang Dapat Disesuaikan: Kami percaya bahwa setiap bisnis memiliki kebutuhan yang berbeda-beda. Oleh karena itu, kami menyediakan solusi yang dapat disesuaikan sesuai dengan tujuan dan kebutuhan unik Anda. Apakah Anda membutuhkan toko online, blog, atau fitur khusus lainnya, tim pengembangan Colega akan membantu mewujudkannya.
SEO yang Ditingkatkan: Sebuah website hanya berarti jika orang dapat menemukannya. Colega memiliki pemahaman yang kuat tentang praktik optimisasi mesin pencari (SEO) dan menerapkannya dalam setiap proyek kami. Kami membantu meningkatkan peringkat website Anda di hasil pencarian, memastikan bahwa bisnis Anda terlihat oleh audiens yang relevan.
Konten yang Memikat: Konten yang kuat adalah kunci untuk menarik perhatian pengunjung dan membangun kredibilitas. Tim penulis Colega berpengalaman dalam menciptakan konten yang menarik, informatif, dan relevan dengan bisnis Anda. Kami membantu Anda mengomunikasikan pesan merek Anda dengan cara yang menarik dan efektif.
Dukungan Pelanggan yang Handal: Kami mengutamakan kepuasan pelanggan dan siap memberikan dukungan yang Anda butuhkan setelah peluncuran website. Tim dukungan pelanggan Colega selalu siap membantu menjawab pertanyaan, menyelesaikan masalah, atau memberikan pembaruan yang diperlukan.

Mulailah Memperluas Keberadaan Online Bisnis Anda Sekarang!

Jangan biarkan bisnis Anda tertinggal dalam dunia digital yang cepat berkembang. Dengan Colega sebagai mitra pembuatan website Anda, Anda dapat mengharapkan peningkatan eksposur merek, peningkatan lalu lintas, dan peluang pertumbuhan bisnis yang lebih besar.

Kunjungi situs web kami di www.colega.id sekarang juga dan temukan lebih lanjut tentang layanan kami. Jadilah bagian dari klien puas Colega yang telah mengalami manfaat dari kehadiran online yang kuat. Hubungi tim kami untuk berkonsultasi dan mulailah membangun masa depan digital bisnis Anda dengan Colega!

Implementasi Fast Paginate di Laravel 10

Hilmi — Sun, 09 Jul 2023 05:41:54 +0000

Laravel Fast Paginate - Dalam pengembangan aplikasi web, sering kali kita perlu mengatur halaman data untuk meningkatkan keteraturan dan kegunaan. Saat bekerja dengan Laravel Framework, fitur bawaan Laravel pagination memberikan kemudahan dalam mengatur data secara halaman. Namun, pada dataset yang besar, proses pengaturan halaman dapat menjadi lambat dan memengaruhi performa aplikasi. Di sinilah Laravel Fast Paginate package dari Aaron Francis muncul sebagai solusi yang mengatasi kendala ini. Dalam artikel ini, kita akan melihat apa itu Laravel Fast Paginate dan bagaimana ia dapat mempercepat pengaturan halaman dalam aplikasi Laravel.

Apa itu Laravel Fast Paginate?
Keuntungan Laravel Fast Paginate
Cara Menggunakan Laravel Fast Paginate
- Instalasi Package
- Menggunakan Fast Paginate
Kesimpulan

Apa itu Laravel Fast Paginate?

Laravel Fast Paginate adalah third party package yang memperkenalkan metode baru untuk mengatur halaman dalam aplikasi Laravel dengan cara yang lebih cepat dan efisien. Dikembangkan oleh Aaron Francis, package ini memperoleh popularitas dengan mendapatkan lebih dari seribu bintang di Github, karena kemampuannya untuk mengatasi keterlambatan saat bekerja dengan dataset besar.

Keuntungan Laravel Fast Paginate

Kecepatan yang Lebih Tinggi: Salah satu keunggulan utama Laravel Fast Paginate adalah kemampuannya untuk meningkatkan kecepatan pengaturan halaman. Dengan menggunakan teknik query yang dioptimalkan, paket ini mengurangi waktu eksekusi yang diperlukan untuk mengambil data halaman.
Skalabilitas yang Baik: Ketika menghadapi dataset besar, penggunaan metode konvensional Laravel pagination dapat mempengaruhi performa aplikasi. Dengan Laravel Fast Paginate, Kita dapat dengan mudah mengatasi kendala ini dan mempertahankan performa yang baik bahkan pada dataset yang besar.
Integrasi yang Mudah: Laravel Fast Paginate dirancang untuk mudah diintegrasikan dengan aplikasi Laravel yang ada. Anda dapat menginstal paket ini melalui Composer dan langsung mulai menggunakannya dengan sedikit konfigurasi.

Cara Menggunakan Laravel Fast Paginate

Berikut adalah langkah-langkah untuk menggunakan Laravel Fast Paginate package dalam aplikasi Laravel:

Instalasi Package

Pertama Anda perlu menginstal paket Laravel Fast Paginate melalui Composer dengan menjalankan perintah di bawah ini.

composer require hammerstone/fast-paginate

Menggunakan Fast Paginate

Setelah menginstal package, Kita dapat mengganti pemanggilan paginate() bawaan Laravel dengan fastPaginate() dalam kode aplikasi laravel. Misalnya, jika Anda memiliki model User dan ingin mengatur halaman data, Kita dapat menggunakan User::query()->fastPaginate($perPage).

Sangat simple kan?

Contoh lain penggunaannya

// Fast paginate has the same method signature
Model::query()->fastPaginate(9)

// Relationships are supported
User::first()->posts()->fastPaginate(9);

Kesimpulan

Laravel Fast Paginate adalah package yang bermanfaat untuk meningkatkan performa pengaturan halaman dalam aplikasi Laravel, terutama pada dataset yang besar. Dengan kemampuannya yang cepat dan integrasi yang mudah, package ini memungkinkan pengembang untuk mengatasi keterbatasan performa yang sering terjadi saat menggunakan metode konvensional Laravel pagination. Jika Anda menghadapi dataset besar dan ingin meningkatkan performa pengaturan halaman dalam aplikasi Laravel, Kalian dapat mempertimbangkan untuk menggunakan Laravel Fast Paginate sebagai solusi yang efektif.

Full Documentation: Laravel Fast Paginate

Credit: Web illustrations by Storyset

Kirim Email di Laravel Menggunakan Gmail SMTP

Hilmi — Mon, 26 Jun 2023 03:21:38 +0000

Laravel Gmail SMTP - Dalam pengembangan aplikasi web, mengirim email adalah fitur yang umum ditemui. Dalam Laravel Framework, mengirim email menjadi lebih mudah dengan adanya dukungan terintegrasi untuk layanan email. Salah satu cara yang populer adalah menggunakan Gmail SMTP (Simple Mail Transfer Protocol) sebagai penyedia email. Dalam artikel ini, kami akan menjelaskan langkah-langkah praktis untuk mengonfigurasi dan mengirim email di Laravel menggunakan Gmail SMTP.

Langkah 1: Konfigurasi Gmail SMTP
Langkah 2: Mengirim Email di Laravel
- Generate Notification
- Update Method Register
- Custom Mail Message
Kesimpulan

Langkah 1: Konfigurasi Gmail SMTP

Pertama, perlu dipastikan bahwa akun Gmail kalian telah dikonfigurasi dengan benar untuk mengizinkan aplikasi pihak ketiga seperti Laravel untuk mengirim email melalui SMTP. Ikuti langkah-langkah berikut:

Buka halaman Google Security Page, aktifkan 2-Step Verification.

Kedua, buat App Password. App Password ini akan kita gunakan sebagai value untuk key MAIL_PASSWORD di .env.

Isi form atau pilih seperti gambar di bawah ini, kemudian klik Generate.

Nah, seperti yang saya sebutkan tadi. Setelah kita klik generate, maka kita akan mendapatkan App Password. App Password inilah yang akan kita gunakan sebagai value untuk key MAIL_PASSWORD di .env.

Oke. Setelah selesai melakukan konfigurasi pada akun Gmail atau Google kita, selanjutnya kita berpindah ke file .env. Sesuaikan file .env seperti contoh di bawah ini.

MAIL_MAILER=smtp
MAIL_HOST=smtp.googlemail.com
MAIL_PORT=587
MAIL_USERNAME=mail@gmail.com
MAIL_PASSWORD=oryukmxsqzhbjnff
MAIL_ENCRYPTION=tls
MAIL_FROM_ADDRESS="mail@gmail.com"
MAIL_FROM_NAME="${APP_NAME}"

Langkah 2: Mengirim Email di Laravel

Setelah konfigurasi selesai, Kita dapat mulai mengirim email di Laravel menggunakan Gmail SMTP. Berikut adalah langkah-langkah dasar untuk mengirim email:

Generate Notification

Pada artikel ini saya akan memberikan contoh case, Aplikasi Laravel akan mengirimkan "Welcome Email" ke user yang baru register pada aplikasi. Kita akan mengirimkan email tersebut menggunakan Class Notification dari Laravel. Silakan jalankan artisan command seperti di bawah ini untuk membuat class WelcomeEmailNotification.

php artisan make:notification WelcomeEmailNotification

Update Method Register

Kemudian disini saya juga akan mengambil contoh dari laravel ui package. Saya akan melakukan sedikit modifikasi pada class RegisterController.

Jika kalian juga menggunakan laravel ui package, silakan buka file app/Http/Controllers/Auth/RegisterController. Modifikasi sedikit pada method create seperti di bawah ini.

use App\Notifications\WelcomeEmailNotification;

protected function create(array $data)
{
    $user = User::create([
        'name' => $data['name'],
        'email' => $data['email'],
        'password' => Hash::make($data['password']),
    ]);

    $user->notify(new WelcomeEmailNotification());

    return $user;
}

Dengan kode seperti di atas, setelah data diinsert ke table users, maka akan mengirimkan email dari class WelcomeNotification ke email user tersebut.

Jangan lupa import class WelcomeNotification.

Sampai disini, sebenarnya kita sudah bisa mencoba fitur welcome email. Tapi, bagaimana kalau kita ubah pesan email tersebut? untuk custom mail message akan dijelaskan di bawah ini. 👇

Custom Mail Message

Pertama, buka file RegisterController.php dan tambahkan variable $user didalam WelcomeEmailNotification untuk kita parsing datanya ke email.

protected function create(array $data)
{
    $user = User::create([
        'name' => $data['name'],
        'email' => $data['email'],
        'password' => Hash::make($data['password']),
    ]);

    $user->notify(new WelcomeEmailNotification($user));

    return $user;
}

Kemudian buka file WelcomeEmailNotification.php, kemudian ubah kodenya menjadi seperti di bawah ini. Dengan kode tersebut, kita menambahkan variable user yang diparsing dari file RegisterController.php untuk dapat menampilkan data user yang telah diinputkan saat register. Kemudian, kita juga mengubah text pada line pertama dan text untuk button.

public function __construct(User $user)
{
    $this->user = $user;
}

public function toMail(object $notifiable): MailMessage
{ return (new MailMessage)
            ->greeting('Hello, '.$this->user->name)
            ->line('Welcome to '.config('app.name'))
            ->action('Explore', url('/'))
            ->line('Thank you for using our application!');
}

Oke, sekarang kita coba lagi register user baru dan tentunya juga menggunakan email aktif agar dapat menerima dan melihat hasil email notificationnya. Setelah berhasil register, maka akan ada email notification masuk lagi seperti gambar di bawah ini.

Kesimpulan

Mengirim email di Laravel menggunakan Gmail SMTP merupakan proses yang cukup sederhana dengan langkah-langkah yang tepat. Dengan mengonfigurasi pengaturan SMTP Gmail di Laravel dan menggunakan sintaks yang benar untuk mengirim email, Anda dapat mengintegrasikan fitur pengiriman email yang kuat ke dalam aplikasi web Anda. Dengan demikian, Anda dapat memberikan notifikasi, mengirim email konfirmasi, dan menjaga komunikasi dengan pengguna aplikasi dengan mudah.

Credit: Internet illustrations by Storyset

Cara Mudah Menggunakan Sweet Alert di Laravel

Hilmi — Sun, 25 Jun 2023 00:53:12 +0000

Laravel Sweet Alert - Halo Sobat Dev 👋 di artikel ini saya menuliskan mengenai cara yang sangat mudah dalam mengimplementasikan Sweetalert2 library di laravel. Tujuan dari artikel ini yaitu membantu kalian yang mungkin bingung dalam mengimplementasikan Sweetalert2 library di laravel.

Sweetalert2 digunakan untuk membuat atau menampilkan berbagai type custom alert messages atau membuat custom popup seperti success messages, error messages, warning messages, confirmation modal, custom messages, dan lain-lain.

Di artikel ini, saya akan memperkenalkan laravel sweet alert package by realrashid yang akan sangat membantu kita dalam menggunakan sweetalert2 library di laravel dengan cara yang sangat mudah. 🚀 🤘

Install Laravel
Install Sweet Alert Package
Implementasi Sweet Alert di Laravel
- Membuat Fungsi Create Data
- Menambahkan Fungsi Delete dengan Confirm Alert
Cara-cara Penggunaan Sweet Alert
- Menggunakan Facade
- Menggunakan helper function
- Menggunakan Middleware

Install Laravel

Hal pertama yang akan kita lakukan disini yaitu memulainya dengan menginstall fresh laravel project menggunakan perintah seperti di bawah ini.

laravel new laravel-sweetalert

Install Sweet Alert Package

Cara mudah menggunakan sweet alert di laravel yaitu dengan menggunakan sweet alert package dari realrashid. Laravel sweet alert adalah sebuah package untuk laravel yang menyediakan cara mudah untuk menampilkan alert message dengan menggunakan Sweetalert2 library.

Untuk menginstall package tersebut, kita bisa menggunakan perintah composer seperti di bawah ini.

composer require realrashid/sweet-alert

Kemudian publish asset package tersebut dengan perintah artisan seperti di bawah ini.

php artisan sweetalert:publish

Nah, setelah itu, kita bisa menyematkan kode seperti di bawah ini pada master layout atau file view kita.

@include('sweetalert::alert')

Implementasi Sweet Alert di Laravel

Pada artikel ini saya akan memberikan contoh penerapannya untuk post management. Jadi, nanti kita buat post management sederhana untuk menampilkan data post pada table dan membuat fungsi create dan delete yang akan menampilkan sweet alert, entah itu success message, error message atau confirm alert.

Oke, untuk itu disini saya mengajak kalian untuk membuat file model Post beserta migrationnya dengan menjalankan perintah artisan seperti di bawah ini.

php artisan make:model Post -m

Buka file model Post dan tambahkan kode seperti di bawah ini agar kita bisa menggunakan mass assignment.

protected $guarded=[];

Lanjut ke migration post. Ubah method up menjadi seperti di bawah ini. Sebagai contoh, disini kita akan membuat posts table dengan field; id, title, description, created_at dan updated_at.

public function up(): void
{
    Schema::create('posts', function (Blueprint $table) {
        $table->id();
        $table->string('title');
        $table->text('description');
        $table->timestamps();
    });
}

Selanjutnya, jalankan perintah php artisan migrate. Tapi sebelumnya, pastikan kalian sudah membuat database dan mengaturnya pada file .env.

php artisan migrate

Membuat Fungsi Create Data

Oke. Kita lanjut ke Controller ya. Buatlah controller baru menggunakan perintah seperti di bawah ini.

php artisan make:controller PostController

Kemudian buka file PostController yang baru saja kita generate. Disini saya berikan contoh dengan membuat method index dan store.

Coba perhatikan pada barisan teratas. Disini kita perlu import facade Alert untuk dapat mengimplementasikan sweet alert di laravel dengan menggunakan facade. Kemudian pada method store, setelah data tersimpan kita akan menampilkan success alert.

<?php

namespace App\Http\Controllers;

use Alert;
use App\Models\Post;
use Illuminate\Http\Request;

class PostController extends Controller
{
    public function index()
    {
        $posts = Post::latest()->paginate();

        return view('welcome',compact('posts'));
    }

    public function store(Request $request)
    {
        Post::create($request->all());
        Alert::success('Hore!', 'Post Created Successfully');
        return redirect()->back();
    }
}

Kita pindah ke routes/web.php, tambahkan route baru seperti di bawah ini. Disini kita akan menambahkan dua route yaitu posts dan store.

Route::get('posts', [App\Http\Controllers\PostController::class, 'index'])->name('posts.index');
Route::post('posts/store', [App\Http\Controllers\PostController::class, 'store'])->name('posts.store');

Kemudian buka file welcome.blade.php. Ubah kode yang ada dengan kode di bawah ini. Disini kita akan membuat dua card yaitu; form create dan table yang menampilkan data-data dari table posts.

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Laravel Sweet Alert</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
    </head>
    <body>
        <div class="container py-5">
            <div class="row">
                <div class="card mb-5">
                    <div class="card-body">
                        <form action="{{ route('posts.store') }}" method="post">
                            @csrf
                            <div class="mb-3">
                                <label for="title" class="form-label">Title</label>
                                <input type="text" name="title" id="title" class="form-control">
                            </div>
                            <div class="mb-3">
                                <label for="description" class="form-label">Description</label>
                                <textarea name="description" id="description" class="form-control"></textarea>
                            </div>
                            <div class="mb-3">
                                <button type="submit" class="btn btn-primary">Create</button>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="card mb-3">
                    <div class="card-body">
                        <table class="table">
                            <thead>
                                <tr>
                                    <th scope="col">#</th>
                                    <th scope="col">Title</th>
                                    <th scope="col">Description</th>
                                    <th scope="col">Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($posts as $key => $post)
                                <tr>
                                    <th scope="row">{{ ++$key }}</th>
                                    <td>{{ $post->title }}</td>
                                    <td>{{ Str::limit($post->description, 50) }}</td>
                                    <td>#</td>
                                </tr>
                                @empty
                                <tr>
                                    <td colspan="4" class="text-center">No data found</td>
                                </tr>
                                @endforelse
                            </tbody>
                        </table>
                        {{ $posts->links() }}
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>

Oke, jika semua tahap sudah dilakukan, sekarang waktunya kita untuk menguji apakah sweet alert sudah bisa berjalan ketika kita berhasil submit data. Silakan coba jalankan laravel project kalian, dan buka pada browser. Coba isi field title dan description lalu klik button create. Jika berhasil, maka sweet alert akan tampil seperti gambar di bawah ini.

Menambahkan Fungsi Delete dengan Confirm Alert

Nice. Kita sudah berhasil mengimplementasikan sweet alert (success alert) di laravel. Sekarang saya akan mengajak kalian untuk mencoba mengimplementasikan confirm alert di laravel. Jadi ceritanya kita akan menambahkan fungsi delete atau menambahkan button delete pada table yang telah kita buat sebelumnya di file welcome.blade.php tadi. Ketika button delete tersebut diklik maka akan tampilkan confirm alert.

Silakan buka file PostController, ubah atau tambahkan kode seperti di bawah ini pada method index. Disini kita menambahkan variable title dan text yang akan tampil pada confirm alert, jadi kalian bebas mau mengisikan dengan text seperti apa.

public function index()
{
    $posts = Post::latest()->paginate();
    $title = 'Delete Data!';
    $text = "Are you sure you want to delete?";
    confirmDelete($title, $text);

    return view('welcome',compact('posts'));
}

Lanjut kita tambahkan method destroy pada PostController. Jika pada method store kita menggunakan facade, maka pada method destroy ini saya memberikan contoh penggunaan helper function. Jadi, ketika button delete diklik maka akan tampil confirm alert dan ketika diklik Yes, delete it maka data akan terhapus dan akan menampilkan success alert yang berisikan pesan Post Deleted Successfully.

public function destroy(Post $post) {
    $post->delete();
    alert()->success('Hore!','Post Deleted Successfully');
    return back();
}

Kita berpindah lagi ke routes/web.php untuk menambahkan route destroy seperti di bawah ini.

Route::delete('posts/{post}/destroy', [App\Http\Controllers\PostController::class, 'destroy'])->name('posts.destroy');

Kemudian, buka file welcome.blade.php, cari kode seperti di bawah ini.

<td>#</td>

Lalu ganti dengan seperti di bawah ini. Disini kita menambahkan link atau button delete yang mengarah ke route destroy yang baru saja kita tambahkan. Coba perhatikan juga, disini kita menambahkan attribute data-confirm-delete ke delete button untuk me-trigger confirmation popup.

<td>
    <a href="{{ route('posts.destroy', $post->id) }}" class="btn btn-danger" data-confirm-delete="true">Delete</a>
</td>

Kalian dapat menyesuaikan opsi confirmation popup dengan mengatur environment variable di file .env.

SWEET_ALERT_CONFIRM_DELETE_CONFIRM_BUTTON_TEXT='Yes, delete it!'
SWEET_ALERT_CONFIRM_DELETE_CANCEL_BUTTON_TEXT='No, cancel'
SWEET_ALERT_CONFIRM_DELETE_SHOW_CANCEL_BUTTON=true
SWEET_ALERT_CONFIRM_DELETE_SHOW_CLOSE_BUTTON=false
SWEET_ALERT_CONFIRM_DELETE_ICON='warning'
SWEET_ALERT_CONFIRM_DELETE_SHOW_LOADER_ON_CONFIRM=true

Oke, jika semua sudah dikerjakan, mari kita coba fitur delete. Buka pada browser, kemudian klik salah satu button delete, maka akan tampilkan confirm alert seperti di bawah ini.

Cara-cara Penggunaan Sweet Alert

Ada beberapa cara untuk menggunakan atau menampilkan sweet alert di laravel dengan laravel sweet alert package ini, seperti; menggunakan facade, helper function atau bisa juga menerapkannya dengan middleware.

Menggunakan Facade

Berikut ini merupakan contoh-contoh menampilkan sweet alert dengan menggunakan facade.

Alert::alert('Title', 'Message', 'Type');
Alert::success('Success Title', 'Success Message');
Alert::info('Info Title', 'Info Message');
Alert::warning('Warning Title', 'Warning Message');
Alert::error('Error Title', 'Error Message');
Alert::question('Question Title', 'Question Message');
Alert::image('Image Title!','Image Description','Image URL','Image Width','Image Height', 'Image Alt');
Alert::html('Html Title', 'Html Code', 'Type');
Alert::toast('Toast Message', 'Toast Type');

Menggunakan helper function

Selain menggunakan facade, kita juga dapat menampilkan alert menggunakan helper function.

Alert

Berikut ini merupakan contoh-contoh menampilkan sweet alert dengan berbagai type alert menggunakan helper function.

alert('Title','Lorem Lorem Lorem', 'success');
alert()->success('Title','Lorem Lorem Lorem');
alert()->info('Title','Lorem Lorem Lorem');
alert()->warning('Title','Lorem Lorem Lorem');
alert()->error('Title','Lorem Lorem Lorem');
alert()->question('Title','Lorem Lorem Lorem');
alert()->image('Image Title!','Image Description','Image URL','Image Width','Image Height', 'Image Alt');
alert()->html('<i>HTML</i> <u>example</u>'," You can use <b>bold text</b>, <a href='//github.com'>links</a> and other HTML tags ",'success');

Toast

Selain itu kita juga dapat menampilkan toast di laravel dengan package ini.

toast('Your Post as been submited!','success');

Untuk penggunaan atau menampilkan toast, bisa dilihat pada contoh di bawah ini.

public function store(Request $request)
{
    Post::create($request->all());
    toast('Your Post as been submited!','success');
    return redirect()->back();
}

Jadi, ketika data berhasil disimpan, maka akan muncul toast seperti gambar di bawah ini.

Menggunakan Middleware

Hal pertama yang harus kita lakukan jika kita mau menggunkan middleware yaitu mendaftarkan middleware ke dalam web middleware groups hanya dengan menambahkan middleware class.

\RealRashid\SweetAlert\ToSweetAlert::class,

Tambahkan kode di atas ke dalam $middlewareGroups di app/Http/Kernel.php.

Error messages auto displaying

Untuk menampilkan error message secara otomatis, kita perlu menambahkan key SWEET_ALERT_AUTO_DISPLAY_ERROR_MESSAGES pada file .env dan berikan value true. Dengan begitu, maka akan secara otomatis menampilkan validation error messages.

Error & Succes Alert

Oke, mari kita coba menambahkan validasi pada method store seperti di bawah ini. Disini, cara kita menampilkan sweet alert juga berbeda dengan apa yang sudah dijelaskan di atas. Lebih simple kan?

public function store(Request $request)
{
    //validation
    $request->validate([
        'title' => 'required|min:3',
        'description' => 'required|min:3'
    ]);
    $post = Post::create($request->all());
    return redirect('posts')->with('success', 'Post Created Successfully!');
    // OR
    return redirect('posts')->withSuccess('Post Created Successfully!');
}

Sekarang, kita coba tambahkan data dengan mengosongkan field description. Ketika kita submit, maka akan muncul error alert dengan validation message seperti gambar di bawah ini.

Cara lainnya seperti di bawah ini.

public function store(Request $request)
{
    $validator = Validator::make($request->all(), [
        'title' => 'required|min:3',
        'description' => 'required|min:3'
    ]);

    if ($validator->fails()) {
        return back()->with('errors', $validator->messages()->all()[0])->withInput();
    }
    $post = Post::create($request->all());
    return redirect('posts')->with('success', 'Post Created Successfully!');
    // OR
    return redirect('posts')->withSuccess('Post Created Successfully!');
}

Error Toast

Selain bisa menampilkan validation error message dalam bentuk alert, dengan package ini kita juga bisa menampilkannya dengan toast. Contohnya seperti di bawah ini.

public function store(Request $request)
{
    $validator = Validator::make($request->all(), [
        'title' => 'required|min:3',
        'description' => 'required|min:3'
    ]);

    if ($validator->fails()) {
        return back()->with('toast_error', $validator->messages()->all()[0])->withInput();
    }
    $post = Post::create($request->all());
    return redirect('posts')->with('success', 'Post Created Successfully!');
    // OR
    return redirect('posts')->withSuccess('Post Created Successfully!');
}

Jika kita coba lagi dengan skenario yang sama atau dengan mengosongkan field, maka ketika submit akan muncul error toast seperti gambar di bawah ini.

Succces Toast

Nah, untuk menampilkan success toast, kalian bisa menggunakan cara seperti contoh di bawah ini.

public function store(Request $request)
{
    $validator = Validator::make($request->all(), [
        'title' => 'required|min:3',
        'description' => 'required|min:3'
    ]);

    if ($validator->fails()) {
        return back()->with('toast_error', $validator->messages()->all()[0])->withInput();
    }
    $post = Post::create($request->all());
    return redirect('posts')->with('toast_success', 'Post Created Successfully!');
    // OR
    return redirect('posts')->withToastSuccess('Post Created Successfully!');
}

Kita tidak dapat menggunakan helper method dengan middleware, tapi kita bisa mengatur default value di file config/sweetalert.php. Disini saya merekomendasikan untuk menggunakan key .env yang contohnya bisa dilihat di bawah ini. Tambahkan key & value di bawah ini pada file .env.

SWEET_ALERT_MIDDLEWARE_AUTO_CLOSE=false
SWEET_ALERT_MIDDLEWARE_TOAST_POSITION='top-end'
SWEET_ALERT_MIDDLEWARE_TOAST_CLOSE_BUTTON=true
SWEET_ALERT_MIDDLEWARE_ALERT_CLOSE_TIME=5000
SWEET_ALERT_AUTO_DISPLAY_ERROR_MESSAGES=true

Sekian untuk artikel kali ini. Sampai disini saya rasa kita sudah belajar banyak tentang cara yang sangat mudah untuk menggunakan sweet alert di laravel, baik itu dalam bentuk pop up ataupun toast. Untuk dokumentasi lebih lengkap, kalian bisa mempelajari package ini di situs resmi Laravel Sweet Alert by Realrashid.

Full Documentation: Laravel Sweet Alert

Integrasi Google Analytics di Laravel dengan Laravel Analytics Package

Hilmi — Fri, 23 Jun 2023 22:44:45 +0000

Laravel Analytics - Halo sobat Dev 👋 kita jumpa lagi di seri tutorial penggunaan package di laravel. Package yang akan kita coba implementasikan kali ini yaitu Laravel Analytics dari Spatie yang berfungsi untuk membantu atau memudahkan kita dalam mendapatkan data dari google analytics dan menampilkannya pada laravel project. Pada seri artikel ini akan coba saya jelaskan step by step mulai dari membuat project di Google Cloud Platform, mengaktifkan library " Google Analytics Data API" pada project, menambahkan user pada property google analytics sampai implementasi laravel analytics package di Laravel. 🚀

Google Analytics
- Google Cloud Platform
- Mendapatkan Property ID
- Tambah User Google Analytics
Integrasi Google Analytics di Laravel
- Install Laravel
- Install Laravel Analytics Package
- Buat DashboardController
- Setup Route
- Buat View
Kesimpulan

Google Analytics

Google Analytics merupakan sebuah layanan gratis dari Google yang berfungsi untuk menampilkan statistik pengunjung pada sebuah website. Google Analytics biasa digunakan oleh pada pemilik website untuk menganalisa kinerja website berdasarkan data-data statistik yang ditampilkannya.

Google Cloud Platform

Hal pertama yang perlu kita lakukan adalah mendapatkan beberapa credential untuk menggunakan Google API. Disini saya asumsikan temen-temen sudah mempunyai akun google dan sudah masuk dengan akun google tersebut. Silakan buka situs Google API, pilih project jika kalian sudah punya project atau buat project baru jika kalian belum pernah membuat project di situs Google API. (https://console.developers.google.com/apis)

Klik New Project untuk membuat project baru.

Isi field project name , kemudian klik Create.

Selanjutnya, kita perlu menentukan API mana saja yang akan digunakan di project kita dengan masuk ke menu Library.

Cari " Google Analytics Data API", klik library seperti gambar di bawah ini.

Kemudian, klik Enable untuk mengaktifkan library Google Analytics Data API pada project kita.

Setelah kita membuat project yang memiliki akses ke API Google Analytics, sekarang saatnya mengunduh file dengan credential yang dibutuhkan. Klik menu Credentials yang ada di sidebar kemudian klik + Create Credentials dan pilih Service account.

Selanjutnya, kita perlu mengisikan field service account name seperti pada form di bawah ini. Kalian dapat menamai service account name , apapun yang kalian suka. Coba perhatikan service account id , di situ terdapat alamat email dan email tersebut akan kita gunakan dalam proses integrasi data google analytics di laravel.

Oke. Setelah service account berhasil dibuat, silakan klik detail dari service account tersebut. Klik tab " Keys", lalu klik dropdown button Add Key dan pilih Create new key.

Pilih key type " JSON" dan klik create untuk download file JSON.

Simpan file JSON yang baru saja didownload tersebut di dalam laravel project temen-temen di lokasi yang telah ditentukan dalam key service_account_credentials_json dari file config laravel analytics package ( config/analytics.php ).

Mendapatkan Property ID

Oke, selanjutnya saya juga berasumsi bahwa kalian telah membuat akun google analytics dan menggunakan property GA4 atau yang terbaru. Pertama, kita perlu mengetahui property_id dari property analytics yang digunakan. Cara mengetahuinya sangat mudah yaitu dengan masuk ke halaman Settings > Property Settings. Di halaman ini, kalian dapat menyalin value PROPERTY ID dari property analytics temen-temen. Nanti, kita akan menggunakan value PROPERTY ID ini untuk key ANALYTICS_PROPERTY_ID di file .env.

Tambah User Google Analytics

Selanjutnya, kita perlu memberikan akses ke service account yang telah kita buat di step sebelumnya. Klik menu Admin yang ada di sidebar (pojok kiri bawah), lalu buka menu "Property Access Management".

Klik icon atau tanda tambah di pojok kanan atas dan klik Add users untuk menambahkan user baru.

Di step ini, kalian dapat memberikan akses ke alamat email yang bisa ditemukan pada key client_email dari file json yang telah kita unduh di langkah sebelumnya. Pilih role Analyst dan klik Add.

Integrasi Google Analytics di Laravel

Setelah selesai dengan setup Google API, sekarang saya akan langsung mengajak temen-temen ke koding. Di tahap ini akan saya jelaskan step by step bagaimana cara mendapatkan data dari google analytics dan menampilkannya pada laravel project dengan menggunakan laravel analytics package. 🚀

Install Laravel

Langkah awal yang saya jelaskan disini, dimulai dari install fresh laravel project menggunakan laravel installer dengan perintah seperti di bawah ini.

laravel new laravel-analytics

Install Laravel Analytics Package

Sudah berhasil install laravel? kita lanjutkan dengan menginstall package yang akan kita gunakan dalam project ini yaitu laravel analytics dari Spatie. Silakan jalankan perintah seperti di bawah ini untuk menginstall laravel analytics package di laravel project kita.

composer require spatie/laravel-analytics

Kemudian kita publish analytics config file pada laravel analytics package dengan perintah di bawah ini.

php artisan vendor:publish --tag="analytics-config"

Buka file config/analytics.php. Coba perhatikan pada key di bawah ini. Key service_account_credentials_json ini merupakah path dari file json yang telah kita unduh pada step sebelumnya. Jadi, file json yang telah diunduh tadi bisa kita rename menjadi service-account-credentials.json dan letakkan pada direktori storage/app/analytics.

'service_account_credentials_json' => storage_path('app/analytics/service-account-credentials.json'),

Selanjutnya, tambahkan key ANALYTICS_PROPERTY_ID pada file .env. Copy PROPERTY ID yang terdapat pada akun google analytics (Settings > Property Settings) dan paste pada key di file .env tersebut.

ANALYTICS_PROPERTY_ID=xxxxxxxxx

Buat DashboardController

Disini saya akan memberikan contoh penggunaan laravel analytics package ini pada controller. Untuk itu, kita perlu membuat controller baru (Single Action Controllers) dengan menjalankan perintah seperti di bawah ini.

php artisan make:controller DashboardController -i

Buka file DashboardController, lalu sesuaikan kode yang ada atau ubah menjadi seperti di bawah ini. Disini kita akan menggunakan method-method yang memang telah disediakan oleh laravel analytics package ini, seperti; Visitors and page views, Total visitors and pageviews, Most visited pages, Top referrers, User Types dan Top browsers.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Spatie\Analytics\Period;
use Analytics;
class DashboardController extends Controller
{
    public function __invoke(Request $request)
    {
        $visitorsAndPageViews = Analytics::fetchVisitorsAndPageViews(Period::days(7));
        $totalVisitorsAndPageViews = Analytics::fetchTotalVisitorsAndPageViews(Period::days(7));
        $mostVisitedPages = Analytics::fetchMostVisitedPages(Period::days(7));
        $topReferrers = Analytics::fetchTopReferrers(Period::days(7));
        $userTypes = Analytics::fetchUserTypes(Period::days(7));
        $topBrowsers = Analytics::fetchTopBrowsers(Period::days(7));

        return view('welcome', compact('visitorsAndPageViews', 'totalVisitorsAndPageViews', 'mostVisitedPages', 'topReferrers', 'userTypes', 'topBrowsers'));
    }
}

Setup Route

Oke, next kita pindah ke routes/web.php. Ganti default route seperti di bawah ini.

Route::get('/', function () {
    return view('welcome');
});

Ganti default route dari laravel dengan route baru yang mengarah ke DashboardController seperti di bawah ini.

Route::get('/', App\Http\Controllers\DashboardController::class);

Buat View

Langkah terakhir yaitu setup view. Buka file welcome.blade.php, kemudian ubah menjadi seperti di bawah ini. Disini kita menggunakan class table dari bootstrap untuk menampilkan data-data yang telah diambil dari Google Analytics menggunakan laravel analytics package.

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>
            How to Integrate Google Analytics in Laravel
        </title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
    </head>
    <body>
        <div class="container py-5">
            <div class="row">
                <h2 class="fs-4 fw-bold text-center mb-5">
                    How to Integrate Google Analytics in Laravel
                </h2>
                <div class="col-md-12">
                    <div class="card mb-3">
                        <div class="card-header">
                            <h2 class="fs-5 fw-bold">
                                Visitors and Page Views
                            </h2>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th style="width: 5%">No.</th>
                                            <th style="width: 65%">Page</th>
                                            <th style="width: 15%">Active Users</th>
                                            <th style="width: 15%">Page views</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($visitorsAndPageViews as $key => $data)
                                        <tr>
                                            <td>{{ ++$key }}</td>
                                            <td>{{ $data['pageTitle'] }}</td>
                                            <td>{{ $data['activeUsers'] }}</td>
                                            <td>{{ $data['screenPageViews'] }}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="card mb-3">
                        <div class="card-header">
                            <h2 class="fs-5 fw-bold">
                                Total Visitors and Pageviews
                            </h2>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th style="width: 5%">No.</th>
                                            <th style="width: 65%">Date</th>
                                            <th style="width: 15%">Active Users</th>
                                            <th style="width: 15%">Page views</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($totalVisitorsAndPageViews as $key => $data)
                                        <tr>
                                            <td>{{ ++$key }}</td>
                                            <td>{{ $data['date'] }}</td>
                                            <td>{{ $data['activeUsers'] }}</td>
                                            <td>{{ $data['screenPageViews'] }}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="card mb-3">
                        <div class="card-header">
                            <h2 class="fs-5 fw-bold">
                                Most Visited Pages
                            </h2>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th style="width: 5%">No.</th>
                                            <th style="width: 45%">Page</th>
                                            <th style="width: 35%">URL</th>
                                            <th style="width: 15%">Page views</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($mostVisitedPages as $key => $data)
                                        <tr>
                                            <td>{{ ++$key }}</td>
                                            <td>{{ $data['pageTitle'] }}</td>
                                            <td>{{ $data['fullPageUrl'] }}</td>
                                            <td>{{ $data['screenPageViews'] }}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="card mb-3">
                        <div class="card-header">
                            <h2 class="fs-5 fw-bold">
                                Top Referrers
                            </h2>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th style="width: 5%">No.</th>
                                            <th style="width: 65%">Page Referrer</th>
                                            <th style="width: 30%">Page views</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($topReferrers as $key => $data)
                                        <tr>
                                            <td>{{ ++$key }}</td>
                                            <td>{{ $data['pageReferrer'] }}</td>
                                            <td>{{ $data['screenPageViews'] }}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="card mb-3">
                        <div class="card-header">
                            <h2 class="fs-5 fw-bold">
                                User Types
                            </h2>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th style="width: 5%">No.</th>
                                            <th style="width: 65%">Type</th>
                                            <th style="width: 30%">Active Users</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($userTypes as $key => $data)
                                        <tr>
                                            <td>{{ ++$key }}</td>
                                            <td>{{ $data['newVsReturning'] }}</td>
                                            <td>{{ $data['activeUsers'] }}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="card mb-3">
                        <div class="card-header">
                            <h2 class="fs-5 fw-bold">
                                Top Browsers
                            </h2>
                        </div>
                        <div class="card-body">
                            <div class="row">
                                <table class="table table-striped">
                                    <thead>
                                        <tr>
                                            <th style="width: 5%">No.</th>
                                            <th style="width: 65%">Browser</th>
                                            <th style="width: 30%">Page Views</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($topBrowsers as $key => $data)
                                        <tr>
                                            <td>{{ ++$key }}</td>
                                            <td>{{ $data['browser'] }}</td>
                                            <td>{{ $data['screenPageViews'] }}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>

Kesimpulan

Setelah semua langkah-langkah di atas sudah dikerjakan, maka sekarang waktunya untuk testing, apakah data-data dari google analytics sudah bisa ditampilkan di laravel app atau belum. Silakan jalankan laravel project kalian, kemudian buka pada browser.

Jika berhasil, maka tampilannya kurang lebih akan seperti gambar di atas. Gambar di atas merupakan contoh hasil dari method perbandingan total visitors dan page views. Jika kalian baru saja membuat akun google analytics, mungkin data-datanya tidak akan langsung keluar. Kalian perlu menunggunya sekitar 24 jam atau lebih.

Demikianlah artikel tentang laravel analytics package. Dari sini dapat kita simpulkan bahwa dengan adanya laravel analytics package ini dapat memudahkan kita dalam mengintegrasikan google analytics di laravel project kita, sehingga kita tidak perlu lagi membuat situs google analytics untuk mengetahui data kunjungan pada website kita. Kita bisa menganalisa website kita hanya dari dashboard website atau sistem kita sendiri.

Semoga artikel ini bisa bermanfaat dan bisa membantu teman-teman dalam mengintegrasikan google analytics di laravel project kalian. Sampai jumpa di artikel berikutnya dan Happy Coding 👋

Full Documentation: Laravel Analytics

Credit: Data illustrations by Storyset

Membuat Multiple Language Website dengan Laravel Translation Loader Package di Laravel 10

Hilmi — Sun, 19 Mar 2023 02:59:57 +0000

Laravel Translation Loader - Halo Dev 👋, pada kesempatan kali ini, saya akan membagikan artikel seputar tutorial membuat website multiple language atau multi bahasa di Laravel. Sebelumnya, saya juga sudah membagikan artikel dengan topik serupa, namun kali ini saya akan membagikannya dengan cara yang sedikit berbeda yaitu dengan menyimpan teks terjemahannya di database.

Let's Start

Oke. sebelum lanjut ke koding, saya hanya ingin memberi tahu bahwa di artikel ini saya akan mencoba menggunakan laravel 10 dengan PHP versi 8.2.4. Selain itu, di artikel ini saya juga akan menggunakan laravel translation loader package dari Spatie untuk menyimpan dan menampilkan text terjemahannya.

Step 1: Install Laravel

Baiklah, kita mulai tutorial ini dengan menginstall fresh laravel project terlebih dahulu dengan menjalankan perintah seperti ini bawah ini untuk menginstall laravel menggunakan laravel installer.

laravel new laravel-translation-loader

Step 2: Setup View

Selanjutnya, mari kita buat viewnya. Disini saya sengaja mengganti semua kode yang ada di file welcome.blade.php yang secara default menggunakan tailwind, saya ganti dengan component bootstrap seperti di bawah ini.

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>
            Laravel Translation Loader
        </title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
    </head>
    <body>
        <nav class="navbar navbar-expand-lg bg-body-tertiary">
            <div class="container">
                <a class="navbar-brand" href="#">
                {{ config('app.name') }}
                </a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarNavDropdown">
                    <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
                        <li class="nav-item">
                            <a class="nav-link active" aria-current="page" href="#">Home</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Tentang Kami</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Layanan</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Agenda</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Hubungi Kami</a>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                            ID
                            </a>
                            <ul class="dropdown-menu">
                                <li><a class="dropdown-item" href="#">English</a></li>
                                <li><a class="dropdown-item" href="#">Bahasa</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1 class="text-center mt-5">
                        Welcome to Divisidev
                    </h1>
                </div>
            </div>
        </div>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
    </body>
</html>

Disini saya sudah siapkan navigasi dan welcome message yang nantinya text-text yang ada di file ini akan dinamis atau mengikuti bahasa yang aktif.

Step 3: Install Laravel Translation Loader Package

Next, kita lanjutkan dengan menginstall laravel translation loader package dari Spatie via composer.

composer require spatie/laravel-translation-loader

Kemudian kita tambahkan Translation Service Provider ke file config/app.php.

Spatie\TranslationLoader\TranslationServiceProvider::class,

Selanjutnya kita mempublish dan menjalankan migration untuk membuat table language_lines. Silakan jalankan perintah-perintah di bawah ini secara berurutan.

php artisan vendor:publish --provider="Spatie\TranslationLoader\TranslationServiceProvider" --tag="migrations"
php artisan migrate

Kemudian, untuk step berikut ini siftanya opsional saja.. Kita bisa mempublish file config menggunakan perintah vendor:publish seperti di bawah ini.

php artisan vendor:publish --provider="Spatie\TranslationLoader\TranslationServiceProvider" --tag="config"

Step 4: Seed

Seperti yang saya sebutkan diawal bait artikel ini, bahwa kita akan menyimpan teks-teks terjemahan di dalam database. Nah, untuk menambahkan teks terjemahan ke database, kita bisa menggunakan kode seperti di bawah ini. Pada contoh ini, saya akan menambahkan teks terjemahan ke model LanguageLine menggunakan seeder.

<?php

namespace Database\Seeders;

use Illuminate\Database\Console\Seeds\WithoutModelEvents;
use Illuminate\Database\Seeder;
use Spatie\TranslationLoader\LanguageLine;

class LanguageLineSeeder extends Seeder
{
    public function run(): void
    {
        LanguageLine::create([
            'group' => 'messages',
            'key' => 'welcome',
            'text' => [
                'en' => 'Welcome to our application',
                'id' => 'Selamat datang di aplikasi kami',
            ],
        ]);
    }
}

Kalian bisa menggunakan kode create data seperti di atas pada function translation management kalian. Karena pada artikel ini saya mencoba menambahkan teks terjemahannya menggunakan seeder, maka selanjutnya saya perlu menjalankan seeder tersebut dengan perintah db:seed seperti di bawah ini.

php artisan db:seed --class="LanguageLineSeeder"

Step 5: Language Switcher

Selanjutnya, buat route baru yang mana pada route ini kita akan terapkan juga logic untuk mengubah bahasa pada aplikasi kita. Dari contoh route di bawah ini, kita perlu menambahkan parameter locale pada route ubah bahasa dan hanya menerima value en atau id. Kita dapat mengubah default language untuk single HTTP request saat runtime menggunakan method setLocale. Kemudian, value $locale yang dikirimkan akan kita simpan ke dalam session locale.

Route::get('locale/{locale}', function ($locale) {
    if (! in_array($locale, ['en', 'id'])) {
        abort(400);
    }

    app()->setLocale($locale);
    session()->put('locale', $locale);

    return redirect()->back();
})->name('locale');

Sekarang kita perlu membuat middleware untuk mengelola bahasa dinamis yang dipilih melalu dropdown ubah bahasa. Silahkan jalankan perintah php artisan make:middleware Localization untuk membuat file middleware dengan nama file Localization.

php artisan make:middleware Localization

Buka file App/Http/Middleware/Localization.php, kemudian sesuaikan kode yang ada dengan kode seperti di bawah ini.

<?php

namespace App\Http\Middleware;

use Closure;
use Illuminate\Http\Request;
use Symfony\Component\HttpFoundation\Response;

class Localization
{
    /**
     * Handle an incoming request.
     *
     * @param \Closure(\Illuminate\Http\Request): (\Symfony\Component\HttpFoundation\Response) $next
     */
    public function handle(Request $request, Closure $next): Response
    {
        if (session()->has('locale')) {
            app()->setLocale(session()->get('locale'));
        }
        return $next($request);
    }
}

Jangan lupa untuk mendaftarkan middleware yang baru saja dibuat ke kernel.php atau lebih tepatnya di dalam protected $middlewareGroups. Sehingga sekarang middlewareGroups akan nampak seperti kode di bawah ini.

protected $middlewareGroups = [
    'web' => [
        ....
        ....
        ....
        \App\Http\Middleware\Localization::class,
    ],

    'api' => [
        // \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
        'throttle:api',
        \Illuminate\Routing\Middleware\SubstituteBindings::class,
    ],
];

Step 6: Update View

Okey, berikutnya kita perlu mengubah kode untuk language switcher menjadi seperti di bawah ini bahasa yang aktif bisa dinamis dan language switchernya bisa berjalan.

<li class="nav-item dropdown">
    <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
        {{ App::currentLocale() }}
    </a>
    <ul class="dropdown-menu">
        <li>
            <a class="dropdown-item" href="{{ route('locale', 'en') }}">
                English
            </a>
        <li>
            <a class="dropdown-item" href="{{ route('locale', 'id') }}">
                Indonesia
            </a>
        </li>
    </ul>
</li>

Kemudian ubah semua teks yang ingin diterjemahkan menjadi seperti di bawah ini atau dengan menggunakan function trans('group'.'key').

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h1 class="text-center mt-5">
                {{ trans('messages.welcome') }}
            </h1>
        </div>
    </div>
</div>

Testing

Oke, setelah melalui langkah-langkah di atas, sekarang kita bisa masuk ke tahap testing. Kita akan mencoba, apakah fitur switch bahasa sudah bisa berjalan dan teks-teks terjemahannya diambil dari database.

Silakan jalankan laravel project temen-temen, kemudian coba buka laravel project temen-temen pada browser, maka kurang lebih tampilannya akan seperti gambar di atas. Jika kita klik dropdown pilih bahasa dan mengubah bahasanya maka teks yang ditampilkan akan menyesuaikan sesuai dengan bahasa yang aktif saat ini.

Sekian artikel kali ini, sampai disini kita sudah belajar sedikit mengenai cara membuat website multiple bahasa dengan menyimpan teks-teks terjemahannya di database dengan menggunakan Laravel Translation Loader package dari Spatie. Selamat mencoba dan see you on the next articles guys 👋 👨‍💻

Credit: Online illustrations by Storyset

DEV Community: Hilmi

Whatsapp Chat Link Generator

👩‍💻 Contribution Opportunity

How to Implement Laravel Permission Package for Advanced User Roles

Getting Started

Install Fresh Laravel Project

Install Laravel UI

User Management

Create Dynamic Title

Roles and Permission Management

Install and Setup Laravel Permissions Package

Role Management

Basic Usage

Blade Directive

Middleware

Error: unable to run private channel using Pusher in Laravel 10

Menjalankan Migration & Seeder Untuk Spesifik Class di Laravel

Menjalankan Migration untuk Spesifik Class

Menjalankan Seeder untuk Spesifik Class

Implementasi Laravel Google Fonts Package by Spatie

Table of Contents

Step 1: Install Laravel Google Fonts Package

Step 2: Implementasi Laravel Google Fonts Package

Menggunakan dengan spatie/laravel-csp

Cara Menampilkan Data Berdasarkan Parameter Dua Tanggal di Laravel

Table of Contents

Step 1: Generate Model dan Migrasi Tabel

Step 2: Mengatur Tabel dan Kolom Tanggal

Step 3: Generate Route & Controller

Step 4: Setup View

Step 5: Testing

Colega: Membawa Bisnis Anda ke Tingkat Selanjutnya dengan Website Profesional

Implementasi Fast Paginate di Laravel 10

Table of Contents

Apa itu Laravel Fast Paginate?

Keuntungan Laravel Fast Paginate

Cara Menggunakan Laravel Fast Paginate

Instalasi Package

Menggunakan Fast Paginate

Kesimpulan

Kirim Email di Laravel Menggunakan Gmail SMTP

Table of Contents

Langkah 1: Konfigurasi Gmail SMTP

Langkah 2: Mengirim Email di Laravel

Generate Notification

Update Method Register

Custom Mail Message

Kesimpulan

Cara Mudah Menggunakan Sweet Alert di Laravel

Table of Contents

Install Laravel

Install Sweet Alert Package

Implementasi Sweet Alert di Laravel

Membuat Fungsi Create Data

Menambahkan Fungsi Delete dengan Confirm Alert

Cara-cara Penggunaan Sweet Alert

Menggunakan Facade

Menggunakan helper function

Alert

Toast

Menggunakan Middleware

Error messages auto displaying

Error & Succes Alert

Error Toast

Succces Toast

Integrasi Google Analytics di Laravel dengan Laravel Analytics Package

Table of Contents

Google Analytics

Google Cloud Platform

Mendapatkan Property ID

Tambah User Google Analytics

Integrasi Google Analytics di Laravel

Install Laravel

Install Laravel Analytics Package

Buat DashboardController

Setup Route

Buat View

Kesimpulan

Membuat Multiple Language Website dengan Laravel Translation Loader Package di Laravel 10

Let's Start