公司導入 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
  1. public function up()
  2. {
  3. Schema::create('posts', function (Blueprint $table) {
  4. $table->increments('id');
  5. $table->string('title');
  6. $table->text('content');
  7. $table->timestamps();
  8. });
  9. }

4. 執行 migrate 建立資料表

artisan command
php artisan migrate

5. create

5.1. 製作 create 頁的 controller

路徑:app/Http/Controllers/PostController.php
  1. public function create()
  2. {
  3. return view('post.create');
  4. }

5.2. 製作 create 頁的 view

路徑:resources/views/post/create.blade.php
  1. @extends('layouts.app')
  2.  
  3. @section('content')
  4. <div class="container">
  5. <div class="page-header">
  6. <h1>新增文章</h1>
  7. </div>
  8. <form class="form-horizontal" action="{{ route('post.store') }}" method="post">
  9. {{ csrf_field() }}
  10. <div class="form-group">
  11. <label for="title" class="col-sm-2 control-label">標題</label>
  12. <div class="col-sm-10">
  13. <input type="text" class="form-control" id="title" name="title">
  14. </div>
  15. </div>
  16. <div class="form-group">
  17. <label for="content" class="col-sm-2 control-label">內容</label>
  18. <div class="col-sm-10">
  19. <textarea class="form-control" id="content" name="content"></textarea>
  20. </div>
  21. </div>
  22. <div class="form-group">
  23. <div class="col-sm-offset-2 col-sm-10">
  24. <button type="submit" class="btn btn-primary">新增</button>
  25. </div>
  26. </div>
  27. </form>
  28. </div>
  29. @endsection

5.3. 製作 store

路徑:app/Http/Controllers/PostController.php
  1. public function store(Request $request)
  2. {
  3. $post = new Post();
  4.  
  5. $post->title = $request->title;
  6. $post->content = $request->content;
  7.  
  8. $post->save();
  9.  
  10. return redirect()->route('post.index');
  11. }

6. index

6.1. 製作 index 頁的 controller

路徑:app/Http/Controllers/PostController.php
  1. public function index()
  2. {
  3. $posts = Post::all();
  4.  
  5. return view('post.index', compact('posts'));
  6. }

6.2. 製作 index 頁的 view

路徑:resources/views/post/index.blade.php
  1. @extends('layouts.app')
  2.  
  3. @section('content')
  4. <div class="container">
  5. <div class="page-header">
  6. <h1>文章</h1>
  7. </div>
  8. <a class="btn btn-primary" href="{{ route('post.create') }}">新增</a>
  9. <div class="table-responsive">
  10. <table class="table table-hover">
  11. <thead>
  12. <tr>
  13. <th>標題</th>
  14. <th>內容</th>
  15. <th colspan="2">操作</th>
  16. </tr>
  17. </thead>
  18. <tbody>
  19. @foreach($posts as $post)
  20. <tr>
  21. <td><a href="{{ route('post.show', $post->id) }}">{{ $post->title }}</a></td>
  22. <td>{{ $post->content }}</td>
  23. <td>
  24. <a class="btn btn-primary" href="{{ route('post.edit', $post->id) }}">編輯</a>
  25. </td>
  26. <td>
  27. <form action="{{ route('post.destroy', $post->id) }}" method="POST">
  28. {{ csrf_field() }}
  29. {{ method_field('DELETE') }}
  30. <input class="btn btn-danger" type="submit" name="submit" value="刪除">
  31. </form>
  32. </td>
  33. </tr>
  34. @endforeach
  35. </tbody>
  36. </table>
  37. </div>
  38. </div>
  39. @endsection

7. show

7.1. 製作 show 頁的 controller

路徑:app/Http/Controllers/PostController.php
  1. public function show(Post $post)
  2. {
  3. return view('post.show', compact('post'));
  4. }

7.2. 製作 show 頁的 view

路徑:resources/views/post/show.blade.php
  1. @extends('layouts.app')
  2.  
  3. @section('content')
  4. <div class="container">
  5. <div class="page-header">
  6. <h1>{{ $post->title }}</h1>
  7. </div>
  8. <p>
  9. {{ $post->content }}
  10. </p>
  11. </div>
  12. @endsection

8. edit

8.1. 製作 edit 頁的 controller

路徑:app/Http/Controllers/PostController.php
  1. public function edit(Post $post)
  2. {
  3. return view('post.edit', compact('post'));
  4. }

8.2. 製作 edit 頁的 view

路徑:resources/views/post/edit.blade.php
  1. @extends('layouts.app')
  2.  
  3. @section('content')
  4. <div class="container">
  5. <div class="page-header">
  6. <h1>編輯文章</h1>
  7. </div>
  8. <form class="form-horizontal" action="{{ route('post.update', $post->id) }}" method="post">
  9. {{ csrf_field() }}
  10. {{ method_field('PUT') }}
  11. <div class="form-group">
  12. <label for="title" class="col-sm-2 control-label">標題</label>
  13. <div class="col-sm-10">
  14. <input type="text" class="form-control" id="title" name="title" value="{{ $post->title }}">
  15. </div>
  16. </div>
  17. <div class="form-group">
  18. <label for="content" class="col-sm-2 control-label">內容</label>
  19. <div class="col-sm-10">
  20. <textarea class="form-control" id="content" name="content">{{ $post->content }}</textarea>
  21. </div>
  22. </div>
  23. <div class="form-group">
  24. <div class="col-sm-offset-2 col-sm-10">
  25. <button type="submit" class="btn btn-primary">更新</button>
  26. </div>
  27. </div>
  28. </form>
  29. </div>
  30. @endsection

8.3. 製作 update

路徑:app/Http/Controllers/PostController.php
  1. public function update(Request $request, Post $post)
  2. {
  3. $post->title = $request->title;
  4. $post->content = $request->content;
  5.  
  6. $post->save();
  7.  
  8. return redirect()->route('post.index');
  9. }

9. 製作 destroy

路徑:app/Http/Controllers/PostController.php
  1. public function destroy(Post $post)
  2. {
  3. $post->delete();
  4.  
  5. return redirect()->route('post.index');
  6. }
目前為止真的寫到程式的只有 migration、route、controller、view。

留言