Laravel 6 Social Login Tutorial - Login with Github

Laravel 6 Social Login Tutorial - Login with Github

In this laravel 6 social login tutorial – We would like to share with you, How can we implement GitHub social login in your Laravel based project using the laravel 6 socialite package. And also work with laravel 5.8 version. Github login also works with laravel 6,5.8,5.7 etc.

Originally published at https://w3path.com

We will discuss how to add a Github social button in your Laravel 6 projects and how to simple authenticate (log in) users using the Github Login button in our Laravel app also we learn GitHub register. We will show you each thing step by step.

Contents

  • Install Laravel App
  • Setup Database
  • Download Socialite Package
  • Get Secrets from Github
  • Make Route
  • Create Controller & Methods
  • Create Blade View
  • Start Development Server
  • Conclusion

Install Laravel App

Now, we need to download Laravel the latest fresh setup. Use the below command and download fresh new Laravel setup :

composer create-project --prefer-dist laravel/laravel blog

Setup Database

After successfully install Laravel 6 Application, Go to your project .env file and set up database credential :

 DB_CONNECTION=mysql 
 DB_HOST=127.0.0.1 
 DB_PORT=3306 
 DB_DATABASE=here your database name here
 DB_USERNAME=here database username here
 DB_PASSWORD=here database password here

Download Socialite Package

In this step, we will install the socialite package using the below command :

composer require laravel/socialite

After successfully install socialite package, we need to configure the aliese and provider in config/app.php :

'providers' => [
     // Other service providers…
 Laravel\Socialite\SocialiteServiceProvider::class,
],

'aliases' => [ // Other aliases… 'Socialite' => Laravel\Socialite\Facades\Socialite::class, ],

Get Secrets from Github

First of all, We need to required the CLIENT ID and CLIENT SECRET to add a social Github login button in the Laravel based project, let’s go to https://github.com/settings/developers and create a new app. We have put app name, description, website name, and callback URL on this page :

You will see your dashboard. Now get the following CLIENT ID and CLIENT SECRET.

After successfully create an app in Github and get credentials from Github dashboard, Set client id and client secret config/service.php file :

 'github' => [
    'client_id' => 'xxxx',
    'client_secret' => 'xxx',
    'redirect' => 'http://127.0.0.1:8000/callback/github',
  ], 

Go to app/User.php and set fillable property put the below code here :

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

Next step, Go to app/database/createuserstable.php and put the below code here :

<?php
 
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
 
class CreateUsersTable extends Migration
{
    /*
      Run the migrations.
     *
     * @return void
     /
    public function up()
    {
        Schema::create('users', function (Blueprint $table) {
            $table->increments('id');
            $table->string('name');
            $table->string('email')->unique()->nullable();
            $table->string('provider');
            $table->string('provider_id');
            $table->timestamp('email_verified_at')->nullable();
            $table->string('password')->nullable();
            $table->rememberToken()->nullable();
            $table->timestamps();
        });
    }
 
    /**
      Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('users');
    }
}

We need to create authentication using below command :

php artisan make:auth

Before we run PHP artisan migrate command go to app/providers/AppServiceProvider.php and put the below code : 

...
use Illuminate\Support\Facades\Schema;
 
....
function boot()
{
    Schema::defaultStringLength(191);
}
... 

 Next, migrate the table using the below command :

php artisan migrate

Make Route

We will create two routes in the web.php file. Go to app/routes/web.php file and create two below routes here :

 Route::get('/auth/redirect/{provider}', '[email protected]');
 Route::get('/callback/{provider}', '[email protected]');

Create Controller

We need to create a controller name SocialController. Use the below command and create Controller :

php artisan make:controller SocialController

After successfully create controller go to app/controllers/SocialController.php and put the below code : 

<?php
 
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
use Validator,Redirect,Response,File;
use Socialite;
use App\User;
class SocialController extends Controller
{
    public function redirect($provider)
    {
        return Socialite::driver($provider)->redirect();
    }
 
    public function callback($provider)
    {
               
        $getInfo = Socialite::driver($provider)->user();
         
        $user = $this->createUser($getInfo,$provider);
 
        auth()->login($user);
 
        return redirect()->to('/home');
 
    }
   function createUser($getInfo,$provider){
 
     $user = User::where('provider_id', $getInfo->id)->first();
 
     if (!$user) {
         $user = User::create([
            'name'     => $getInfo->name,
            'email'    => $getInfo->email,
            'provider' => $provider,
            'provider_id' => $getInfo->id
        ]);
      }
      return $user;
   }
}
Add social Github buttons in login and register blade view

In Resources/Views/Auth/register.blade.php and add a Github social login button :

<hr>
<div class="form-group row mb-0">
     <div class="col-md-8 offset-md-4">
        <a href="{{ url('/auth/redirect/github') }}" class="btn btn-primary"><i class="fa fa-github"></i> Github</a>
    </div>
</div>

In Resources/Views/Auth/login.blade.php and add a GitHub social login button :

<hr>
<div class="form-group row mb-0">
     <div class="col-md-8 offset-md-4">
       <a href="{{ url('/auth/redirect/github') }}" class="btn btn-primary"><i class="fa fa-github"></i> Github</a>
    </div>
</div>

Start Development Server

We need to start the development server. Use the PHP artisan serve command and start your server :

 php artisan serve

Now we are ready to run our GitHub login Laravel 6 examples so run bellow command to quick run.

 http://127.0.0.1:8000/login
 Or direct hit in your browser
 http://localhost/blog/public/login

Conclusion

In this tutorial, We have successfully login using the github button in the Laravel 6 based application. our examples run quickly.

Live Demo

laravel 6 GitHub login example looks like this :

Laravel Github login screen :

Github Authentication Screen :

Github Register Screen Laravel :

If you have any questions or thoughts to share, use the comment form below to reach us. 

Thanks for reading

If you liked this post, share it with all of your programming buddies!

Follow me on Facebook | Twitter

Further reading

Laravel 5.8 Tutorial for Beginners

What’s New in Laravel 6.0

Laravel 6 Tutorial - How to make Auth in Laravel 6

Laravel 6 Authentication Tutorial: Login/Register/Password Reset UI




Angular 9 Tutorial: Learn to Build a CRUD Angular App Quickly

What's new in Bootstrap 5 and when Bootstrap 5 release date?

Brave, Chrome, Firefox, Opera or Edge: Which is Better and Faster?

How to Build Progressive Web Apps (PWA) using Angular 9

What is new features in Javascript ES2020 ECMAScript 2020

PHP Web Application Development Company

As a top **PHP Web Application Development Company in USA**[https://www.dataeximit.com/php-development-services/](https://www.dataeximit.com/php-development-services/ "https://www.dataeximit.com/php-development-services/"), we at Data EximIT have...

Advantages of Hiring PHP Developer for your Website Project

PHP - Hypertext pre-processor, a scripting language used by many people in developing web pages, but most of us are unaware even of the full form. To train someone and make them learn this whole language is as difficult and time-consuming as it is...

Hire PHP Developer and Web Developer for your Online Business

PHP is widely used open-source scripting language it helps in making dynamically easy your websites and web application. Mobiweb Technology is your best technical partner and offering you solution for any kind of website and application...