Laravel エラー Cannot end a section without first starting one.を解決した話

# 目的

- タイトルのエラーを解決した話をまとめる

# 実施環境

- ハードウェア環境
| 項目 | 情報 |
| --- | --- |
| OS | macOS Catalina(10.15.3) |
| ハードウェア | MacBook Pro (16-inch ,2019) |
| プロセッサ | 2.6 GHz 6コアIntel Core i7 |
| メモリ | 16 GB 2667 MHz DDR4 |
| グラフィックス | AMD Radeon Pro 5300M 4 GB Intel UHD Graphics 630 1536 MB |

- ソフトウェア環境

| 項目 | 情報 | 備考 |
| --- | --- | --- |
| PHP バージョン | 7.4.3 | Homwbrewを用いて導入 |
| Laravel バージョン | 7.0.8 | commposerを用いて導入 |
| MySQLバージョン | 8.0.19 for osx10.13 on x86_64 | Homwbrewを用いて導入 |

# エラー内容

- bladeのベースレイアウトファイルを使用したビューの表示で下記のエラーが発生した。

    ```
    Cannot end a section without first starting one.
    ```

# エラー原因

- ベースレイアウトファイルでのsection宣言の終了部分に`@endsection`を記載してしまっていた。
- 問題のコードを下記に記載する。

    ```helloapp..blade.php
    <!DOCTYPE html>
    <html>
    <head>
        <title>@yield('title')</title>
        <style>
            body{
                font-size: 16pt;
                color: #999;
                margin: 5px;
            }
            h1{
                font-size: 50pt;
                text-align: right;
                color: #f6f6f6;
            }
            ul{
                font-size: 12pt;
            }
            hr{
                margin: 25pt 100pt;
                border-top: 1px dashed #ddd;
            }
            .menutitle{
                font-size: 14pt;
                font-weight: bold;
                margin: 0px;
            }
            .content{
                margin: 10px;
            }
            .footer{
                text-align: right;
                font-size: 10pt;
                margin: 10px;
                border-bottom: solid 1px #ccc;
                color: #ccc;
            }
        </style>
    </head>
    <body>
        <h1>@yield('title')</h1>
        @section('menuber')
        <h2 class="menutitle">※メニュー</h2>
            <ul>
                <li>@show</li>
            </ul>
            <hr size="1">
            <div class="content">
                @yield('content')
            </div>
            <div class="footer">
                @yield('footer')
            </div>
        <!-- 下記が不要だった -->
        @endsection
    </body>
    </html>
    ```

# 解決方法

- ベースレイアウトファイルの問題箇所を修正後エラーは解消された。
- 下記にベースレイアウトファイルの記載を行う。

```helloapp.blade.php
<!DOCTYPE html>
<html>
<head>
    <title>@yield('title')</title>
    <style>
        body{
            font-size: 16pt;
            color: #999;
            margin: 5px;
        }
        h1{
            font-size: 50pt;
            text-align: right;
            color: #f6f6f6;
        }
        ul{
            font-size: 12pt;
        }
        hr{
            margin: 25pt 100pt;
            border-top: 1px dashed #ddd;
        }
        .menutitle{
            font-size: 14pt;
            font-weight: bold;
            margin: 0px;
        }
        .content{
            margin: 10px;
        }
        .footer{
            text-align: right;
            font-size: 10pt;
            margin: 10px;
            border-bottom: solid 1px #ccc;
            color: #ccc;
        }
    </style>
</head>
<body>
    <h1>@yield('title')</h1>
    @section('menuber')
    <h2 class="menutitle">※メニュー</h2>
        <ul>
            <li>@show</li>
        </ul>
        <hr size="1">
        <div class="content">
            @yield('content')
        </div>
        <div class="footer">
            @yield('footer')
        </div>
    @endsection
</body>
</html>
```
- 下記にベースレイアウトを呼び出しているビューファイルの内容を記載する。

```index.blade.php
@extends('layouts.helloapp')

@section('title', 'Index')

@section('menuber')
    @parent
    インデックスページ
@endsection

@section('content')
    <p>ここが本文のコンテンツです。</p>
    <p>必要なだけ記述できます。</p>
@endsection

@section('footer')
    copyright 2020 miriwo.
@endsection
```