Laravel CRUD処理を使った投稿アプリを作成する その3 投稿保存処理の作成

# 目的

- アプリを作成する上で基本となるCRUD処理を有したLaravelアプリをチュートリアル的に作成する方法をまとめる

# 実施環境

- ハードウェア環境

| 項目 | 情報 |
| --- | --- |
| OS | macOS Catalina(10.15.5) |
| ハードウェア | MacBook Pro (13-inch, 2020, Four Thunderbolt 3 ports) |
| プロセッサ | 2 GHz クアッドコアIntel Core i5 |
| メモリ | 32 GB 3733 MHz LPDDR4 |
| グラフィックス | Intel Iris Plus Graphics 1536 MB |

- ソフトウェア環境

| 項目 | 情報 | 備考 |
| --- | --- | --- |
| PHP バージョン | 7.4.3 | Homwbrewを用いて導入 |
| Laravel バージョン | 7.0.8 | commposerを用いてこちらの方法で導入→[Mac Laravelの環境構築を行う](https://qiita.com/miriwo/items/adaaaeecae69d6392e08) |
| MySQLバージョン | 8.0.19 for osx10.13 on x86_64 | Homwbrewを用いてこちらの方法で導入→[Mac HomebrewでMySQLをインストールする](https://qiita.com/miriwo/items/ef6a064bc545fbea29d9) |

# 前提条件

- 実施環境に近い環境が構築されていること。
- 筆者は下記の方法で環境構築を行った。
    - [Mac Laravelの環境構築を行う](https://qiita.com/miriwo/items/adaaaeecae69d6392e08)
    - [Mac HomebrewでMySQLをインストールする](https://qiita.com/miriwo/items/ef6a064bc545fbea29d9)

# 前提情報

- ソースコードはこちら→[https://github.com/miriwo0104/laravel_crud/tree/master](https://github.com/miriwo0104/laravel_crud/tree/master)
- DockerやAWSなどは使用せずにMacのローカルに実施環境と同じLaravel開発環境を構築して実施する。
- チュートリアルで実際に筆者が作成したソースコードをGitHubにて公開予定である。
- CRUD処理の作成完了を最短目標にしてバリデーションなどは後々設定することとする。
- 実施環境と同じ環境がDockerやAWSで用意できるなら都度読み替えていただければ実施が可能だと思う。
- 公式ドキュメントと一冊の技術書を元に本記事を記載する。
    - [Laravel 7.x](https://readouble.com/laravel/7.x/ja/installation.html)
    - [PHPフレームワーク Laravel Webアプリケーション開発 バージョン5.5 LTS対応](https://www.amazon.co.jp/PHP%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0%E3%83%AF%E3%83%BC%E3%82%AF-Laravel-Web%E3%82%A2%E3%83%97%E3%83%AA%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E9%96%8B%E7%99%BA-%E3%83%90%E3%83%BC%E3%82%B8%E3%83%A7%E3%83%B35-5-LTS%E5%AF%BE%E5%BF%9C/dp/4802611846/ref=sr_1_5?__mk_ja_JP=%E3%82%AB%E3%82%BF%E3%82%AB%E3%83%8A&dchild=1&keywords=laravel&qid=1594858533&sr=8-5)
    - 本記事はシリーズとして内容を分割する予定である。記事のタグ「miriwo_laravelチュートリアル」を本シリーズの記事に付与するのでそのほかの記事がみたい方は活用していただきたい。

# この記事の読後感

- 前回実装した投稿登録画面から実際に投稿内容が登録できる様になる。

# 全ての記事(miriwo_laravelチュートリアル)を通した読後感

- Laravelアプリでログインなどのユーザ認証付き投稿アプリの作成ができる。

# 概要

1. ルーティングの記載
1. コントローラの記載
1. モデルファイルの作成
1. テーブルの作成
1. ビューファイルの修正
1. 確認

# 詳細

1. ルーティングの記載
    1. laravel_crudディレクトリで下記コマンドを実行してルーティングファイルを開く。

        ```terminal
        $ vi routes/web.php 
        ```
    1. 開いたファイルに下記の行を追記する。

        ```laravel_crud/routes/web.php
        Route::post('/save', 'ContentController@save')->name('save');
        ```
    1. 追記後のルーティングファイルの内容を下記に記載する。

        ```laravel_crud/routes/web.php
        <?php
        
        use Illuminate\Support\Facades\Route;
        
        /*
        |--------------------------------------------------------------------------
        | Web Routes
        |--------------------------------------------------------------------------
        |
        | Here is where you can register web routes for your application. These
        | routes are loaded by the RouteServiceProvider within a group which
        | contains the "web" middleware group. Now create something great!
        |
        */
        
        Route::get('/', function () {
            return view('welcome');
        });
        
        Auth::routes();
        
        Route::get('/home', 'HomeController@index')->name('home');
        
        Route::get('/input', 'ContentController@input')->name('input');
        Route::post('/save', 'ContentController@save')->name('save');
        ```
1. コントローラの記載
    1. laravel_crudディレクトリで下記コマンドを実行して作成したコントローラファイルを開く。

        ```terminal
        $ vi app/Http/Controllers/ContentController.php 
        ```
    1. 下記の内容をクラス内に追記する。

        ```laravel_crud/app/Http/Controllers/ContentController.php
        //下記を上部に追記
        use App\Models\Content;

        public function save(Request $request)
        {
            $input_content = new Content();
            $input_content->content = $request['content'];
            $input_content->save();
        
            return redirect('/');
        }
        ```
    1. 追記後のコントローラファイルの内容を下記に記載する。

        ```laravel_crud/app/Http/Controllers/ContentController.php
        <?php
        
        namespace App\Http\Controllers;
        
        use Illuminate\Http\Request;
        //下記も追記
        use App\Models\Content;
        
        class ContentController extends Controller
        {
            public function input()
            {
                return view('contents.input');
            }
        
            public function save(Request $request)
            {
                $input_content = new Content();
                $input_content->content = $request['content'];
                $input_content->save();
                
                return redirect('/');
            }
        }
        ```
1. モデルファイルとマイグレーションファイルの作成
    1. laravel_crudディレクトリで下記コマンドを実行してモデルファイルとマイグレーションファイルを作成する。

        ```terminal
        $ php artisan make:model Models/Content --migration
        ```
1. テーブルの作成
    1. laravel_crudディレクトリで下記コマンドを実行して作成したマイグレーションファイルを開く。(YYYY-MM-DDにはマイグレーションファイル作成日が、XXXXXXにはランダムな数字が入る。)

        ```terminal
        $ vi database/migrations/YYYY_MM_DD_XXXXXX_create_contents_table.php
        ```
    1. 下記の様に記載を行う。記載後のマイグレーションファイルの内容を下記に記載する。

        ```laravel_crud/database/migrations/YYYY_MM_DD_XXXXXX_create_contents_table.php
        <?php
        
        use Illuminate\Database\Migrations\Migration;
        use Illuminate\Database\Schema\Blueprint;
        use Illuminate\Support\Facades\Schema;
        
        class CreateContentsTable extends Migration
        {
            /**
             * Run the migrations.
             *
             * @return void
             */
            public function up()
            {
                Schema::create('contents', function (Blueprint $table) {
                    $table->id();
                    $table->string('content');
                    $table->timestamps();
                });
            }
        
            /**
             * Reverse the migrations.
             *
             * @return void
             */
            public function down()
            {
                Schema::dropIfExists('contents');
            }
        }
        ```
    1. laravel_crudディレクトリで下記コマンドを実行してマイグレーションを行い、テーブルを作成する。
    
        ```terminal
        $ php artisan migrate
        ```
1. ビューファイルの修正
    1. laravel_crudディレクトリで下記コマンドを実行してビューファイルを開く。

        ```terminal
        vi resources/views/contents/input.blade.php
        ```
    1. 作成して開いたビューファイルを下記の様に修正する。
    
        ```laravel_crud/resources/views/contents/input.blade.php
        <h1>input</h1>
        
        <!-- 下記を修正 -->
        <form action="{{route('save')}}" method="post">
            @csrf
            <textarea name="content" cols="30" rows="10"></textarea>
            <input type="submit" value="送信">
        </form>
        ```
1. 確認
    1. laravel_crudディレクトリで下記コマンドを実行してローカルサーバを起動する。

        ```terminal
        $ php artisan serve
        ```
    1. ブラウザで下記にアクセスする。
        - [http://127.0.0.1:8000/input](http://127.0.0.1:8000/input)
    1. テキストボックスに何かしらの文字列を入力して「送信」をクリックする。

        <img width="1439" alt="127_0_0_1_8000_input.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/46269848-73da-b79b-ef90-6479f01d82af.png">

    1. 下記画面が表示される

        <img width="1439" alt="Laravel.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/306417/b926af97-a99f-48af-8da1-95412f244443.png">

    1. 下記コマンドを実行してMySQLにログインする。(MySQLのrootユーザのパスワードを忘れてしまった方はこちら→[Mac ローカル環境の MySQL 8.0 のrootパスワードを忘れた時のリセット方法](https://qiita.com/miriwo/items/1880e9d2ebcfd3c0e60d))

        ```terminal
        $ mysql -u root -p
        ```
    1. 下記SQLを実行する。

        ```sql
        select * from laravel_crud_data.contents;
        ```
    1. 下記の様に出力されれば本記事の作業は完了である。(contentの内容は皆さんがブラウザのテキストボックスに入力した内容)

        ```
        +----+--------------------------+---------------------+---------------------+
        | id | content                  | created_at          | updated_at          |
        +----+--------------------------+---------------------+---------------------+
        |  1 | これはテストです             | 2020-07-14 07:50:16 | 2020-07-14 07:50:16 |
        +----+--------------------------+---------------------+---------------------+
        ```