Accept only Gmail ID while registering in Livewire

Do you want to apply to Accept only Gmail ID while registering in the Livewire application?

This step-by-step tutorial helps you learn how to validate whether an email ID is from Gmail or not in Livewire in the Laravel application with the help of the Livewire Laravel Validation Rule.

Why you should Allow Only Gmail users to sign up for Livewire

In the Laravel or livewire application, we work with login or sign or forms, sometimes users use dummy or fake emails like: abc@yopmail.com, abc@mailtrap.com, etc.

So we allow only the Gmail IDs to validate the user email ID using the default Laravel validation rules.

How to Allow only Valid Gmail users to sign up

We will use Laravel Livewire Real-time validation rules, If you still want to accept “gmail.com” addresses only, then we can use, Laravel ends-with validator:  ’email’ => [‘ends_with:gmail.com‘] Let’s understand this validation with the help of a simple livewire example below.

Create a Livewire Compoenent :-

php artisan make:livewire Auth/Register

routes\web.php

<?php

use Illuminate\Support\Facades\Route;
use App\Http\Livewire\Auth\Register;


Route::get('/user-register',Register::class);

app\Models\User.php

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;
use Laravel\Sanctum\HasApiTokens;
use Illuminate\Database\Eloquent\SoftDeletes;

class User extends Authenticatable
{
    use HasApiTokens, HasFactory, Notifiable, SoftDeletes;

    /**
     * The attributes that are mass assignable.
     *
     * @var array<int, string>
     */
    protected $guarded = [];

    protected $fillable = [
        'name',
        'email',
        'phone',
        'password',
    ];

    /**
     * The attributes that should be hidden for serialization.
     *
     * @var array<int, string>
     */
    protected $hidden = [
        'password',
        'remember_token',
    ];

    /**
     * The attributes that should be cast.
     *
     * @var array<string, string>
     */
    protected $casts = [
        'email_verified_at' => 'datetime',
    ];
}

app\Http\Livewire\Auth\Register.php

<?php

namespace App\Http\Livewire\Auth;

use Livewire\Component;
use App\Models\User;
use DB;
use Illuminate\Support\Facades\Hash;

class Register extends Component
{
    public $name;
    public $email;
    public $phone;
    public $password;
    public $confirm_password; 
 
    protected $rules = [
        
        'name'  => 'required|max:40',
        'email' => ['email','ends_with:gmail.com','unique:users','max:120'],
        'phone'  => 'required|max:12',
        'password' => ['required','string','min:6'],
        'confirm_password' => ['required','same:password','min:6'],

   ];

    public function updated($propertyName)
    {
        $this->validateOnly($propertyName);
    }

    public function handleUserRegister(){
        try{
            DB::beginTransaction();
        $validatedData = $this->validate();
        $validatedData['password'] = bcrypt($this->confirm_password);
        User::create($validatedData);
        DB::commit();
        }
        catch(\Exception $e){
        DB::rollback();
        throw $e;
        }
        $this->reset();
    }

    public function render()
    {
        return view('livewire.auth.register')->extends('layouts.frontend.app');
    }
}

resources\views\livewire\auth\register.blade.php

<div>
<form method="post" wire:submit.prevent="handleUserRegister">
   <div class="form-row">
      <div>
         <label>Name</label>
         <input wire:model.lazy="name" type="text">
         @if ($errors->has('name'))
         <span>{{ $errors->first('name') }}</span>
         @endif
      </div>
   </div>
   <div class="form-row">
      <div>
         <label>Email</label>
         <input wire:model.lazy="email" type="email">
         @if ($errors->has('email'))
         <span>{{ $errors->first('email') }}</span>
         @endif
      </div>
   </div>
   <div class="form-row">
      <div>
         <label>Phone</label>
         <input wire:model.lazy="phone" type="text">
         @if ($errors->has('phone'))
         <span>{{ $errors->first('phone') }}</span>
         @endif
      </div>
   </div>
   <div class="form-row">
      <div>
         <label>Password</label>
         <input wire:model.lazy="password" type="password">
         @if ($errors->has('password'))
         <span>{{ $errors->first('password') }}</span>
         @endif
      </div>
   </div>
   <div class="form-row">
      <div>
         <label">Confirm Password</label>
         <input wire:model.lazy="confirm_password" type="password">
         @if ($errors->has('confirm_password'))
         <span>{{ $errors->first('confirm_password') }}</span>
         @endif
      </div>
   </div>
   </div>
   <button type="submit">Sign up</button>
</form>
</div>

In this article, we learned “Accept Only Gmail ID While Registering In Livewire”, I hope this article will help you with your Livewire Laravel application Project.

Read also:- Update Status Using The Toggle Switch In Livewire.