6. Аутентификация и сборка фронтенда

Ссылка на нужны раздел документации - https://laravel.su/docs/5.4/mix

В ранних версиях инициализировать базовые элементы фронта можно было запустив php artisan make:auth. В поздних версиях это не работает.

Делаем следующее:

1. Устанавливаем аутентификацию для laravel. Вводим команду в терминал

   composer require laravel/ui

2. Необходимо установить NPM и Node.js если их еще нет. Node.js устанавливаем вручную. Для NPM вводим команды:

   npm install
   npm run dev

3. Далее устанавливаем фронт по желанию: 

   php artisan ui bootstrap
   php artisan ui vue
   php artisan ui bootstrap --auth
   php artisan ui vue --auth

После установки, например, бутстрапа, должны появиться директории css и js в директории public.

После установки laravel/ui добавилось и много файлов, полный список можно посмотреть в local changes редактора PHPStorm.

Смотрим список маршрутов php artisan route:list и видим, что там добавилось много маршрутов:

1. home;
2. login;
3. logout;
4. register;
5. и другие, связанные с password.

Также, в файл маршрутов web.php должны добавиться строки:

Auth::routes();//Данная команда зарегистрирует несколько маршрутов

Route::get('/home', 'HomeController@index')->name('home');//Это маршрут для авторизации. Куда нас будут перенаправлять после авторизации

Можно опробовать маршруты. Прописываем project.loc/home, например. Смотрим результат.

Далее смотрим в HomeController.php, который появился в директории контроллеров. Очень важный момент: вот эта конструкция $this->middleware('auth'); позволяет защитить контролер аутентификацией т.е. если не пройдена аутентификация то пользователь будет перенаправлен на страницу авторизации.

Дале смотрим директорию resources. Тут много чего создалось, основной файл с layouts в директории views/layouts/app.blade.php. В нем можно посмотреть базовые конструкции шаблонизатора. С ними будет дальнейшая работа.

Пример. Тут в блоке guest будет показан инфа для неавторизованного пользователя, иначе для авторизованного

@guest
    <li class="nav-item">
        <a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
    </li>
    @if (Route::has('register'))
        <li class="nav-item">
            <a class="nav-link" href="{{ route('register') }}">{{ __('Register') }}</a>
        </li>
    @endif
@else
    <li class="nav-item dropdown">
        <a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre>
            {{ Auth::user()->name }} <span class="caret"></span>
        </a>

        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
            <a class="dropdown-item" href="{{ route('logout') }}"
               onclick="event.preventDefault();
                             document.getElementById('logout-form').submit();">
                {{ __('Logout') }}
            </a>

            <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                @csrf
            </form>
        </div>
    </li>
@endguest

В laravel есть такая фича как наследование шаблонов, благодаря этому, мы можем унаследовать шаблон layouts.app и разметить область, которая попадет в layouts.app в зону content. Подробнее об этом будет в отдельном разделе. Открываем шаблон из resources/views/blog/posts/index.blade.php. Модернизируем код из этог офайла до такого вида:

@extends('layouts.app')

@section('content')
    <table>
        @foreach($items as $item)
            <tr>
                <td>{{ $item->id }}</td>
                <td>{{ $item->title }}</td>
                <td>{{ $item->created_at }}</td>
            </tr>
        @endforeach;
    </table>
@endsection

Теперь заходим по адресу blog/posts предварительно убрав dd() из файла PostController и видим что страница со списком статей имеет шапку и бустстраповские стили.