初心者による投稿機能付き掲示板の作成②

<h2>[Laravelのインストール、Laravelについて]</h2>

<h2>はじめに</h2>
<p>
　前回の記事でエディターをはじめとする必要ソフトのインストールを行いました。今回の記事では、Laravelをインストールし、サーバーへのアクセスまでの説明を行っていきます！
</p>

<h2>Laravelとは？</h2>

<p>
　PHPフレームワークの一つで、豊富なライブラリ、機能を備えている。MVCフレームワークを採用しているため、初心者にも扱いやすいのが特徴です。
<br>
　PHPの基礎の学習を行った方であれば、構造の理解をしてしまえば難しいものではないというのが個人の感想です。しかしながら、初めてLaravelに触れた時には、フレームワーク？MVC？？？と、ハテナが増えていきました。そのため、Laravelの構造の具体的な説明を行う前に、わたくし自身の復習も兼ねて、より噛み砕いた説明を行ってゆこうと思います。
</p>

<h3>フレームワーク、MVCフレームワークとは？</h3>

<p>
　フレームワークとは、<b>開発に利用される機能をまとめたアプリケーションを活用してプログラミングを行うこと</b>です。Laravelで採用されるMVCフレームワークを簡単に説明します。
</p>

<p>
　MVCとは、以下の単語の頭文字を取ったもので、次の様な役割を担います。
</p>

<p>
<b>・M　->　モデル(model)</b>
<br>
　システムの設計図：データベースのレコードを、PHPのオブジェクトとして操作することを可能にします。モデルの自動生成がコマンドにて行えるのもLaravelの特徴の一つです。
</p>

<p>
<b>・V　->　ビュー(view)</b>
<br>
　システムの外観：webサイトなどにおける見える部分で、ユーザーが求める内容をユーザーが閲覧する画面に表示します。
</p>

<p>
<b>・C　->　コントローラー(controller)</b>
<br>
　システムの骨組み：モデルとビューをつなぎ入力値や画面表示の制御を行います。
</p>
<br>

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754176/c818bdd3-a014-0ce7-62df-72d916981ed8.png">
引用：<a href="https://lab.m-field.co.jp/2019/06/28/servlet-novice/mvc%E3%83%A2%E3%83%87%E3%83%AB/">Tech blog</a>
<p>モデル、ビュー、コントローラーは上画像のように働きます。

ショッピングサイトでの商品の検索を例に挙げ、流れを説明すると、

<b>①webサイトからリクエストを受け取る。</b>
　　ショッピングサイトで検索を行い、商品を探したい！
<b>②コントローラーがモデルに必要なデータを送る。</b>
　　検索内容を整理し、データベースへの問い合わせに必要なデータをモデルに送る
<b>③データベースに問い合わせ、レコードを受取る。</b>
　　データベースに登録されている商品のうち、コントローラーから受け取った内容に合致する商品をモデルに送る
<b>④ビューがモデルから受け取ったレコードに沿い、webブラウザ上に表示させる。</b>
　　検索内容とデータベースを比較し合致する商品のみを検索結果画面に表示する。
<br>
　以上がMVCフレームワークの説明になります(^^)
　一通り説明をさせていただいたので、実際にエディターでLaravelを始めるのに必要な、<strong>Laravelのインストール</strong>の説明に入ります。
</p>

<h2>Laravelのインストール</h2>
<p>
　インストールの説明は、<a href="https://qiita.com/Nanami___/items/024e5e6668970a53a9b4">前回の記事[Laravel環境構築のための準備]</a>に記載した準備に沿いエディター等をインストール済みと仮定し、<a href="https://readouble.com/laravel/7.x/ja/installation.html">Laravel公式サイト</a>に沿い進めていきます。
　Visual Studio Codeのターミナルを起動し、以下のコマンドでLaravelをインストールします。
<pre>
composer global require laravel/installer
</pre>
　インストールを終えたら、早速Laravelのプロジェクトファイルの生成を行います！下記のコマンドにて上記で説明を行ったMVCフレームワークに必要なファイルを、Laravelが用意してくれます。今回私はlaravel_sumpleと名前を付けますが、この部分は任意なのでプロジェクトに適したものを入力してください。
<pre>
laravel new laravel_sumple
</pre>
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754176/49e5a508-d0a0-2a39-87ed-297661073dbe.png
">
<br>
　コマンド実行後上画像のような文字が表示され、ファイルの生成が始まります。少し長いですが、エラー表示がなけれインストールが完了しています。lsコマンドを使用して、完了していることを確認してください。


<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754176/be94d427-dbf9-6787-3777-d0829255074c.png">
<br>
　lsコマンドを使用して、完了していることを確認してください。
<br>
<br>
　ディレクトリの確認ができたら、早速laravelのサーバーを起動してみたいと思います！
<pre>
　cd laravel_sumple
</pre>
<br>
　上記コマンドで作成したLaravelのディレクトリに切り替え、
<br>
<pre>
　php artisan serve
</pre>
<br>
　上記のartisanコマンドを使用して、Laravelのサーバーを起動後、google chromeなどで、" localhost:8000 "にアクセスして下画像のような画面を開けるか確認してください。
<br>
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754176/1129a25b-82cc-4dd0-a261-e1b42f816bd4.png">
<br>
　画面が確認できていれば、Laravelのインストールとサーバーへのアクセスが成功し、今回の記事の内容を完了した状態になります！
</p>

<h2>余談</h2>
<p>
　先ほどアクセスした" localhost:8000 "で表示されたページのルートは、routesのweb.phpで、resourcesのviewsにあるwelcome.blade.phpを表示するよう定義されています。<b>ここ(localhost:8000)にアクセス来たら、この画面(welcome.blade.php)だしてね～</b>って感じです。
<br>
　現段階でファイルの説明はしていないので、はぁーーーん。って感じで流しておいてください。
<br>
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754176/53326282-116d-c23e-4a92-05cf744850bd.png">
<br>
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754176/34021a21-57e5-cac5-73b4-83897e55ccb4.png">
<br>
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/754176/054f613b-1150-a394-fee9-cb84b1b424a8.png">
</p>

<h2>次回の予定</h2>
　最後までお読みいただきありがとうございます。初心者の私が躓いた内容を思い出しながら書いたので、いらない説明が多く含まれていると思いますがご容赦ください。本記事でファイルの説明までできなかったので、次回の記事では簡単なページを作成しながら順を追ってファイルの説明を行っていく予定です。<br>　今後ともよろしくお願いいたします:grin:
<br>