ネビ活 | ネットビジネス生活

ネットxお金のスキルを作り、未来永劫豊かに暮らす事を目指すサイト

Laravel6チュートリアル初心者向け:単独の投稿ページを表示してみよう!

更新日:

今回は、データベース内に保存されている複数の投稿を、それぞれ投稿ページで1ページずつ表示するチュートリアルをやっていきます。

 

ポイント

前回のチュートリアルでは、複数の投稿を1ページにリスト形式で表示するチュートリアルをやりました。

Laravel6チュートリアル初心者向け:データベースの値を取得して表示してみよう

 

今回は、それぞれの単独の投稿ページ(記事ページ)を表示するやり方をチュートリアルとして解説していきます。

 

Laravelって稼げるの?独学?スクール?高給を稼ぐためにどうするべきか教えます。

Laravel6チュートリアル初心者向け:投稿ページを作ってみよう。

注意ポイント

今回のチュートリアルは、前回の続きになるので、

前回、前々回のチュートリアルで準備したファイルが必要です。

まずは、前々回のチュートリアルからやって、ファイルを揃えてください。

(前々回)Laravel6チュートリアル初心者向け:フォームを作成し投稿を保存してみよう!

(前回)Laravel6チュートリアル初心者向け:データベースの値を取得して表示してみよう

 

  1. コントローラーにクエリを書く
  2. 単独ページ用ブレードを作成
  3. ルートを設定
  4. リストページからリンクを貼る

という手順で一緒にやってきましょう。

 

コントローラーにクエリ(データベースへの問い合わせ文)を書く

では、前回のチュートリアルで作成したFormController.phpを開いてください。

 

classの{ } の中に、黄枠のfunction show を追記します。

コピーしました

コピー

public function show ($id){    
  $data = Form::where('id', $id)->first();
  return view('show')->with(['data' => $data]);
}

記入したら、上書き保存します。

 

中身の意味は後述します。

 

ブレードを作成する

投稿ページ(記事ページ)を表示するためのブレードを作成します。

まず、空のテキストエディタを開いてください。

 

継承のチュートリアルをやってる場合は

以下を記述し、show.blade.phpという名前で、resources\viewsフォルダに保存してください。

コピーしました

コピー

@extends('layout')
@section('content')
    <div class="content3">
        <p class="created">{{$data->created_at}}</p>
        <h1>{{$data->title}}</h1>
        <hr>
        <p>{!! nl2br($data->main)!!}</p>
    </div>
@endsection

 

 

継承のチュートリアルをやってない場合は、

以下を記述し、show.blade.phpという名前で、resources\viewsフォルダに保存してください。

コピーしました

コピー

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Laravel</title>
        <link rel="stylesheet" href="{{asset('css/style.css')}}">
    </head>
    <body>
    <div class="wrapper">
        <div class="header">
            <h1>Laraサイト</h1>
        </div>
        <div class="sidebar">
            <p>ここがサイドバー</p>
        </div>

        <div class="content3">
        <p class="created">{{$data->created_at}}</p>
        <h1>{{$data->title}}</h1>
        <hr>
        <p>{!! nl2br($data->main)!!}</p>
        </div>

        <div class="footer">
            <p>お問い合わせ</p>
        </div>
    </div>
    </body>
</html> 

 

 

ルートを設定する

次に、routes\web.phpを開きます。

黄枠部分を追記してください。

コピーしました

コピー

// 投稿一覧を表示する
Route::get('/show/{id}', 'FormController@show');

 

実際にブラウザで表示してみる

コマンドプロンプト(shell/ターミナル)を開いて、

cdでLaravelプロジェクトに移動します (例 cd D:\XAMPP\htdocs\newsite)。

そして、php artisan serve と入力、Enterします。

言ってる事が分からない場合はこの記事でやり方を1から解説してるから確認して↓

PC上のLaravelサイトをブラウザに表示する方法。初心者でも必ずできる。

Neby

 

ブラウザで、http://localhost:8000/show/2と入力し、表示します。

もし、何も表示されない場合は、show/1, show/3などと、数字を変えてください。

データベースに保存されている投稿が表示されるはずです。アドレスの数字を変えるたびに違う投稿が表示されます。

というのも、今回web.phpにshow/{id}と書きました。

この{id}というのは、データベースに保存されている投稿のIDの事です。

 

そう、それぞれの投稿には、自動的にidが付与されています。なので、このidが一致する投稿を呼び出してるわけです。

web.phpのURL部分に、show/{id}のように、{ }を使う事で、その値(入力された文字)をコントローラーに渡せるようになります。

 

今回、コントローラーには、function show ( )の中にRequest, $requestではなく、$idと書きました。

というのも、今回はフォームに入力された値ではなく、URLの{ }の部分(パラメーター)を$id(変数)として受け取るので、($id)としています。

例えば、/show/3 とURLを入力したなら、$idには、3という数字が自動的に代入されるという事です。

 

そして、クエリ(データベースへの問い合わせ文)ですが、

$data = Form::where('id', $id)->first();

つまり、「formsテーブルの、場所(where)がidで、$id(今回なら3)と一致するものを探し、最初に出てきたもの(first)だけ、取り出して$dataに代入してください」

というクエリになってます。

つまり、データベースのidが3番の投稿が取り出されるわけです。

 

そして、前回のチュートリアルでは、全部の投稿を取り出してリスト化しました。

この時は、->get()というクエリを使いました。get()を使うと複数の投稿を取り出せます。
逆に->first()とすると、仮にデータベースクエリで複数件の投稿がヒットしたとしても、1番最初にヒットしたものしか出しません。

今回のidのように、もともと重複が無いものに対しても、first()を使います。

 

そして、前回は複数の投稿があったので、
ブレード上ではforeach文を使いましたが、
今回は1つしか取り出しませんから、foreachを使ってないわけです。

 

複数の投稿を取り出す場合は、get()で取り出し、foreachを使う必要があるけど、1つの投稿だけ取り出すなら、first()で取り出し、foreachは不要になるんだ。
Neby

 

リンクを作って、記事ページに飛べるようにしよう!

さて、現状では、URLで数字を手入力しないと投稿ページは表示できないわけですが、これを前回作った投稿リストページから、リンクを貼って飛べるようにしてみましょう。

前回作ったpost.blade.phpを開いてください。

 

<h1>{{$datas->title}}</h1>

という部分を探して、それを以下に書き換えて、保存してください。

コピーしました

コピー

<h1><a href="/show/{{$datas->id}}">{{$datas->title}}</a></h1>

これは、タイトルにaタグを加えてリンクを作り、飛び先のURLを/show/{{$datas->id}}としました。こうする事で、それぞれの投稿IDが表示され、/show/3 のようになるわけです。

 

ブラウザで、http://localhost:8000/createを表示します。

タイトルがリンク化され、リンクをクリックすると、個別の投稿表示ページに飛ぶようになりました。

 

今までのチュートリアルで、ルート、コントローラー、ブレードの3つをどう使うかが分かってきたんじゃないかな?

フォームで投稿→データベースに保存→ページに投稿を表示

の流れを作れば、ブログでも口コミサイトでもLaravelで作れるわけ。

Neby
うん、結構Laravelの構造や使い方が分かってきたよ。でも、もっと本格的に文字に色を付けたりとか、画像を入れたりとかはどうやればいいのか分からないなぁ。

 

というわけで、次のチュートリアルでは、wysiwygエディタという、文字装飾などを入れられるフォームを使う方法をやっていきます。

Laravel6チュートリアル:WYSIWYGエディタ(Quill)を使ってみよう!

 

ところで、あなたが今Laravelを学んでる理由ってなんですか?

稼げると聞いたから?

どれくらい上達すれば稼げるのか?本当にそんな高給を稼げるのかの現実を知ってますか?

詳しくは下の記事に本音の裏事情を書いてるので参考にしてくださいね。

Laravelって稼げるの?独学?スクール?高給を稼ぐためにどうするべきか教えます。

  • この記事を書いた人

Neby

本を毎日多読しつつ、資産運用、プログラミング、心理学、ネットビジネススキルを猛向上中。貧富の差が広がる5年後、10年後に安心生活を送るためのお金のリテラシー、スキル、資産を一緒に作っていきましょう。

-PHP Laravel入門

Copyright© ネビ活 | ネットビジネス生活 , 2020 All Rights Reserved.