Bootstrap CRUD

Views

Add Bootstrap classes to article form

nano resources/views/articles/form.blade.php

<div class="form-group">
    {!! Form::label('title', 'Title:') !!}
    {!! Form::text('title', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
    {!! Form::label('content', 'Content:') !!}
    {!! Form::textArea('content', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
    {!! Form::label('author_id', 'Author:') !!}
    {!! Form::select('author_id', $authors, $article->author_id, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
    {!! Form::submit($submitButtonText, ['class' => 'btn btn-primary']) !!}
</div>

Add Bootstrap classes to author form

nano resources/views/authors/form.blade.php

<div class="form-group">
    {!! Form::label('name', 'Name:') !!}
    {!! Form::text('name', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
    {!! Form::label('email', 'E-mail:') !!}
    {!! Form::text('email', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
    {!! Form::submit($submitButtonText, ['class' => 'btn btn-primary']) !!}
</div>

Add Bootstrap classes to articles index

nano resources/views/articles/index.blade.php

@extends($layout)

@section('content')
    <h1>Articles</h1>
    {!! link_to_route('articles.create', 'New Article', null, ['class' => 'btn btn-primary btn-lg']) !!}
    <table class="table">
        <tr>
            <th>Edit</th>
            <th>Delete</th>
            <th>Title</th>
            <th>Author</th>
        </tr>
        @foreach ($articles as $article)
            <tr>
                <td>{!! link_to_route('articles.edit', 'Edit', $article->id, ['class' => 'btn btn-default']) !!}</td>
                <td>
                    {!! Form::open(['method' => 'DELETE', 'route' => ['articles.destroy', $article->id]]) !!}
                        <button type="submit" class="btn btn-warning">Delete</button>
                    {!! Form::close() !!}
                </td>
                <td>{!! link_to_route('articles.show', $article->title, $article->id) !!}</td>
                <td>{!! $article->author->name !!}</td>
            </tr>
        @endforeach
    </table>
@endsection

Add Bootstrap classes to authors index

nano resources/views/authors/index.blade.php

@extends($layout)

@section('content')
    <h1>Authors</h1>
    {!! link_to_route('authors.create', 'New Author', null, ['class' => 'btn btn-primary btn-lg']) !!}
    <table class="table">
        <tr>
            <th>Edit</th>
            <th>Delete</th>
            <th>Name</th>
        </tr>
        @foreach ($authors as $author)
            <tr>
                <td>{!! link_to_route('authors.edit', 'Edit', $author->id, ['class'=> 'btn btn-default']) !!}</td>
                <td>
                    {!! Form::open(['method' => 'DELETE', 'route' => ['authors.destroy', $author->id]]) !!}
                        <button type="submit" class="btn btn-warning">Delete</button>
                    {!! Form::close() !!}
                </td>
                <td>{!! link_to_route('authors.show', $author->name, $author->id) !!}</td>
            </tr>
        @endforeach
    </table>
@endsection

Run the server

php artisan serve

Open some pages in the browser to check the results

open http://localhost:8000/articles

open http://localhost:8000/articles/create

Add Bootstrap for CRUD views to Git

git add .
git commit -m "Add Bootstrap to CRUD views"

Next step: Alerts