Download as PDF, PPTX
![タスク追加時のバリデーションを追加
❖ Gist の validation.txt のコードを /task のルートにコピー
❖ name について10文字以下になるようなバリデーションをかける
❖ バリデーションに引っかかれば / にリダイレクト
❖ () 内にRequest クラスを変数として使うように記述
Route::post(‘/task’, function(Request $reauest){
$validator = Validator::make($request->all(), [
'name' => 'required|max:10',
]);
if ($validator->fails()) {
return redirect('/')
->withInput()
->withErrors($validator);
}
・・・
web.php](https://image.slidesharecdn.com/laravel5-170507110757/85/Laravel-5-3-basic-task-list-34-320.jpg)
![Eloquent でタスクを取得する
❖ Gist の getTask.txt を web.php の / にコピー
❖ orderBy は並び替えるメソッド、最後に get( ) で呼び出すこと
❖ 第二引数で昇順（asc）、降順（desc）が指定できる
❖ view 関数の第二引数に配列でデータを渡すとビューで使える
Route::get('/', function () {
$tasks = Task::orderBy('created_at', 'asc')->get();
return view('task', [
'tasks' => $tasks // このデータがtask.blade.phpで使える
]);
});
web.php](https://image.slidesharecdn.com/laravel5-170507110757/85/Laravel-5-3-basic-task-list-36-320.jpg)
Laravel 5.3 で basic task list を作ろう！
- 1. Laravel 5.3 で BasicTask List を 作ろう！
- 2.
- 3. You can findme at: @username user@mail.me 最近 PHP 界隈で人気のフレームワーク https://laravel.com/
- 4. Laravel ❖ 更新が頻繁にされている（最新は 5.3） ❖ 機能豊富 ❖ シンプルで軽い兄弟フレームワーク Lumen もある ❖ テンプレートエンジンを使って画面を拡張できたり、 Eloquent を使って DB 操作が簡単にできたり・・・ ❖ 生の PHP がかけなくても結構なんとかなる
- 5.
- 6. とはいえ You can findme at: @username user@mail.me
- 7. 自分で勉強するのって大変！ You can findme at: @username user@mail.me
- 8. なので一緒に勉強しましょう！ You can findme at: @username user@mail.me
- 9. ハンズオンするひと ショウノシオリ ❖ 株式会社 chatbox ❖エンジニア ❖ Qiita : @shosho ❖ Laravel はじめて 8ヶ月ぐらい
- 10. つくるもの ❖ タスクの追加 ❖ タスクの削除 ❖タスクの一覧表示 ができるシンプルなtodoリスト
- 11. デモ You can findme at: @username user@mail.me
- 12. 進め方について ❖ Laravel 5.2のドキュメントを使用 ❖ コピーするコードはGistに記載 ❖ 概要はQiitaに書いてあります （URL は connpass のコメントに貼ってます） docs : https://laravel.com/docs/5.2/quickstart Gist : https://gist.github.com/sshono1210/e42663e1b7312047132e588cf5cd7408 Qiita : http://qiita.com/shosho/items/f34276561a342dc85180
- 13. 学ぶこと 1. インストール /DB の設定（環境構築） 2. ルート / 画面の作り方（画面の表示） 3. マイグレーション / Eloquent ORM（DB 操作） 4. 実装（タスクの追加・削除）
- 14. 1. インストール / DBの設定 Composerを使ったLaravel をインストール
- 15. Composer のインストール ❖ 公式サイト ❖インストール済みの場合は スキップ
- 16. Laravel のインストール ❖ Composerを使って Laravel のプロジェクトをインストール ❖ Laravelは ライブラリの依存関係を Composer で管理している ❖ http://localhost:8000 にホーム画面が表示される # quickstart のダウンロード $ composer create-project laravel/laravel quickstart --prefer-dist # ディレクトリに移動、 Composerのインストール cd ~/quickstart $ composer install # サーバーを起動 $ php artisan serve
- 17. DB 接続先の変更 ❖ 今回はさっくり作りたいのでSQLite を使用 ❖ .env の DB_CONNECTION を sqlite に変更 ❖ その他の DB 周りの設定をコメントアウト # .env DB_CONNECTION=sqlite #DB_HOST=127.0.0.1 #DB_PORT=3306 #DB_DATABASE=homestead #DB_USERNAME=homestead #DB_PASSWORD=secret .env
- 18. SQLite ファイルの作成 ❖ database.sqliteは SQLite を動かすために必要なファイル ❖ database ディレクトリ内に database.sqlite をつくる # SQLite ファイルの作成 $ touch database/database.sqlite
- 19.
- 20. ルートをつくる ❖ Gist のcreateRouting.txt を routes / web.php にコピー ❖ アプリケーションの url などを書くファイル ❖ 今回はタスクの「一覧表示」「追加」「削除」の３つを生やす Route::get('/', function () { // }); Route::post('/task', function () { // }); Route::delete('/task/{task}', function () { // }); web.php
- 21. 画面（ビュー）をつくる ❖ テンプレートエンジン Bladeが使える ❖ .php も使用可能 ❖ Blade を使うとレイアウトの部品化が可能 ➢ 子ビューが親ビューを継承できる ➢ ヘッダーなどの共通部分を読み込める
- 22. テンプレートエンジン Blade について ❖拡張子は .blade.php ❖resources/views ディレクトリ内に（.phpも同様） ❖ データの埋め込みは {{ $hoge }} ❖ コメントは {{--コメント--}} で書く （HTMLには吐き出されない） ❖ 詳しくはドキュメントの Blade Templates を参照
- 23. エラー用のビューをつくる ❖ エラー時に表示するメッセージ（共通部品）用のビュー ❖ resources/viewsに新しいディレクトリ common を作成 ❖ 中に errors.blade.php を作成 ❖ Gist の errors.txt のコードをコピー
- 24. 親ビューをつくる ❖ レイアウトのベースとなるビュー ❖resources/views に新しいディレクトリlayouts を作成 ❖中に app.blade.php を作成 ❖ Gist の createParent.txt のコードをコピー
- 25. 子ビューをつくる ❖ 各ページのメインコンテンツ部分 ❖ resources/viewsの中に task.blade.php を作成 ❖Gist の createChild.txt のコードをコピー
- 26. 子ビューの構造について解説 ❖ @extends でどのビューを親にするかを指定（継承） ❖@include で共通部品を読み込んでいる ❖ @section(‘content’) 部分が親ビューの @yield(‘content’) に挿 入される感じ ❖ ビューの階層は .（ドット）で表す @extends(‘layouts.app’) @section(`content`) ・・・ @include(‘common.errors’) @endsection task.blade.php
- 27. 3. マイグレーション / Eloquent ORM Laravelを使った DB の運用・管理
- 28. マイグレーションファイルをつくる ❖ テーブルの設計図となるファイル ❖ このファイルをもとにマイグレーションが実行される ❖database/migrations の中に xxxx..._create_tasks_table.php が できる # マイグレーションファイルの作成 $ php artisan make:migration create_tasks_table --create=tasks
- 29. ❖ Gist のaddColumn.txt をさっき作ったファイルの public function up(){} 内に置き換え ❖ up() はテーブル作成、down()はテーブル削除の内容 ❖ デフォルトでidとtimestampsが設定されているので、新たにnameという 項目を追加する public function up() { Schema::create(‘tasks’, function(Blueprint $table){ $table->increments(‘id’); $table->string(‘name’); // 追加 $table->timestamps(); }); } xxxx..._create_tasks_table.php.php ファイルを編集する
- 30. マイグレーションの実行 ❖ マイグレーションファイルをもとにテーブルができる ❖ マイグレーションファイルを編集したら必ず巻き戻してからマイグレーションを 実行し直すこと（refresh） #マイグレーションの実行 $ php artisan migrate # マイグレーションコマンド $ php artisan migrate:install // migrationsファイルのみ作成 $ php artisan migrate:rollback // 直近のマイグレーション巻き戻し $ php artisan migrate:reset // 全てのマイグレーション巻き戻し $ php artisan migrate:refresh // migration:reset後、マイグレーション $ php artisan migrate:status // マイグレーション実行状況を確認
- 31. Eloquent ORM をつくる ❖DB 操作を簡単にできる Model クラス ❖ 上記コマンドで app/Task.php ができる（使用方法は後述） ❖ とりあえず作るだけ。実装はあとで。 # Eloquentモデルの作成 $ php artisan make:model Task
- 32.
- 33. ルート内でクラスのuse宣言する ❖ Gist のuse.txt を web.php の最初のところにコピー ❖ ルート内でクラスを使用する場合は use 宣言しないと使えない # routes/web.php の一番はじめに追加（ <?php のすぐ下に） Use AppTask; Use IlluminateHttpRequest; web.php
- 34. タスク追加時のバリデーションを追加 ❖ Gist のvalidation.txt のコードを /task のルートにコピー ❖ name について10文字以下になるようなバリデーションをかける ❖ バリデーションに引っかかれば / にリダイレクト ❖ () 内にRequest クラスを変数として使うように記述 Route::post(‘/task’, function(Request $reauest){ $validator = Validator::make($request->all(), [ 'name' => 'required|max:10', ]); if ($validator->fails()) { return redirect('/') ->withInput() ->withErrors($validator); } ・・・ web.php
- 35. Eloquent を使ってタスクを追加 ❖ Gistの addTask.txt のコードを先程のバリデーションの下に追加 ❖ Eloquent モデル Task.php を使ってタスクを作成 ❖ save メソッドで保存 ❖ 作成後 / にリダイレクト Route::post(‘/task’, function(Request $request){ ・・・バリデーションのコード・・・ $task = new Task; $task->name = $request->get(‘name’); $task->save(); return redirect('/'); web.php
- 36. Eloquent でタスクを取得する ❖ Gistの getTask.txt を web.php の / にコピー ❖ orderBy は並び替えるメソッド、最後に get( ) で呼び出すこと ❖ 第二引数で昇順（asc）、降順（desc）が指定できる ❖ view 関数の第二引数に配列でデータを渡すとビューで使える Route::get('/', function () { $tasks = Task::orderBy('created_at', 'asc')->get(); return view('task', [ 'tasks' => $tasks // このデータがtask.blade.phpで使える ]); }); web.php
- 37. 取得したタスクを一覧表示 ❖ Gist のcurrentTasks.txt を task.blade.php に追加 ❖ ビュー側でデータを表示するときは {{ $tasks }} ❖ @if で条件分岐、@foreach でループを回すことができる @if(count($tasks) > 0) ・・・ @foreach ($tasks as $task) ・・・ @endforeach @endif task.blade.php
- 38. 削除ボタンの追加 ❖ Gist のdeleteButton.txt を task.blade.php にコピー ❖ 削除ボタンを押すと DELETE/task リクエストが送られる <tr> ・・・ <td> <form action="{{ url('task/'.$task->id) }}" method="POST"> {{ csrf_field() }} {{ method_field('DELETE') }} <button type="submit" class="btn btn-danger"> <i class="fa fa-trash"></i> Delete </button> </form> </td> </tr> task.blade.php
- 39. Eloquent でDBのタスクを削除 ❖ Gistの deleteTask.txt を web.php の /task/{task} に追加 ❖ Eloquent の delete メソッドでDBのタスクを削除 Route::delete('/task/{task}', function (Task $task) { $task->delete(); return redirect('/'); }); web.php
- 40. Thanks! Any questions? You canfind me at: @username user@mail.me