公司導入 Laravel 分享 - 6. 基礎實作 - 文章

1. 建立 Route

路徑：routes/web.php

Route::resource('post', 'PostController');

2. 建立 Model、Controller 和 Migration

artisan command

php artisan make:model Post -m -r

3. 撰寫資料庫 schema

路徑：database/migrations/2017_05_08_080254_create_posts_table.php

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

4. 執行 migrate 建立資料表

artisan command

php artisan migrate

5. create

5.1. 製作 create 頁的 controller

路徑：app/Http/Controllers/PostController.php

public function create()
{
    return view('post.create');
}

5.2. 製作 create 頁的 view

路徑：resources/views/post/create.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="page-header">
        <h1>新增文章</h1>
    </div>
    <form class="form-horizontal" action="{{ route('post.store') }}" method="post">
        {{ csrf_field() }}
        <div class="form-group">
            <label for="title" class="col-sm-2 control-label">標題</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" id="title" name="title">
            </div>
        </div>
        <div class="form-group">
            <label for="content" class="col-sm-2 control-label">內容</label>
            <div class="col-sm-10">
                <textarea class="form-control" id="content" name="content"></textarea>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-primary">新增</button>
            </div>
        </div>
    </form>
</div>
@endsection

5.3. 製作 store

路徑：app/Http/Controllers/PostController.php

public function store(Request $request)
{
    $post = new Post();

    $post->title = $request->title;
    $post->content = $request->content;

    $post->save();

    return redirect()->route('post.index');
}

6. index

6.1. 製作 index 頁的 controller

路徑：app/Http/Controllers/PostController.php

public function index()
{
    $posts = Post::all();

    return view('post.index', compact('posts'));
}

6.2. 製作 index 頁的 view

路徑：resources/views/post/index.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="page-header">
        <h1>文章</h1>
    </div>
    <a class="btn btn-primary" href="{{ route('post.create') }}">新增</a>
    <div class="table-responsive">
        <table class="table table-hover">
            <thead>
                <tr>
                    <th>標題</th>
                    <th>內容</th>
                    <th colspan="2">操作</th>
                </tr>
            </thead>
            <tbody>
                @foreach($posts as $post)
                    <tr>
                        <td><a href="{{ route('post.show', $post->id) }}">{{ $post->title }}</a></td>
                        <td>{{ $post->content }}</td>
                        <td>
                            <a class="btn btn-primary" href="{{ route('post.edit', $post->id) }}">編輯</a>
                        </td>
                        <td>
                            <form action="{{ route('post.destroy', $post->id) }}" method="POST">
                                {{ csrf_field() }}
                                {{ method_field('DELETE') }}
                                <input class="btn btn-danger" type="submit" name="submit" value="刪除">
                            </form>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endsection

7. show

7.1. 製作 show 頁的 controller

路徑：app/Http/Controllers/PostController.php

public function show(Post $post)
{
    return view('post.show', compact('post'));
}

7.2. 製作 show 頁的 view

路徑：resources/views/post/show.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="page-header">
        <h1>{{ $post->title }}</h1>
    </div>
    <p>
        {{ $post->content }}
    </p>
</div>
@endsection

8. edit

8.1. 製作 edit 頁的 controller

路徑：app/Http/Controllers/PostController.php

public function edit(Post $post)
{
    return view('post.edit', compact('post'));
}

8.2. 製作 edit 頁的 view

路徑：resources/views/post/edit.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="page-header">
        <h1>編輯文章</h1>
    </div>
    <form class="form-horizontal" action="{{ route('post.update', $post->id) }}" method="post">
        {{ csrf_field() }}
        {{ method_field('PUT') }}
        <div class="form-group">
            <label for="title" class="col-sm-2 control-label">標題</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" id="title" name="title" value="{{ $post->title }}">
            </div>
        </div>
        <div class="form-group">
            <label for="content" class="col-sm-2 control-label">內容</label>
            <div class="col-sm-10">
                <textarea class="form-control" id="content" name="content">{{ $post->content }}</textarea>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-primary">更新</button>
            </div>
        </div>
    </form>
</div>
@endsection

8.3. 製作 update

路徑：app/Http/Controllers/PostController.php

public function update(Request $request, Post $post)
{
    $post->title = $request->title;
    $post->content = $request->content;

    $post->save();

    return redirect()->route('post.index');
}

9. 製作 destroy

路徑：app/Http/Controllers/PostController.php

public function destroy(Post $post)
{
    $post->delete();

    return redirect()->route('post.index');
}

目前為止真的寫到程式的只有 migration、route、controller、view。