🔔 本の下書きプレビューをシェアできるようになりました
Zenn
🐘

Laravel 入門１ ページ追加

2025/03/11に公開
Docker
Laravel
laravel12
tech

前回の記事

https://zenn.dev/kate0418/articles/d6a0a71bd7ece9

次回の記事

https://zenn.dev/kate0418/articles/4783ab3f33b623

【超重要】処理の順番

  • 以下の順に処理が実行されます
# 逆順に作成していきます
1. web.php
    ⬇︎
2. Controllers
    ⬇︎
3. views
  • コメントアウトの箇所を使用します
.
├── laravel_app
│   ├── app
│   │   └── Http
│   │       └── Controllers # コントローラー（PHP）
│   ├── resources
│   │   └── views # ビュー（HTML）
│   └── routes
│       └── web.php # ルーティング（URL）
├── docker-compose.yml
└── Dockerfile

views

laravelでは見た目を作るのにhtmlファイルの代わりにbladeファイルを使う

bladeファイルとは

基本的にはhtmlと変わらないが、条件分岐やループを描くことが可能
（詳しくは、次回記事で紹介）

ファイル作成

  1. topディレクトリ内にindex.blade.phpを作成

（今回はtop/index.blade.php）

.
├── laravel_app
│   └── resources
│       └── views
│           └── top
│               └── index.blade.php # ここに作成する
├── docker-compose.yml
└── Dockerfile
  1. index.blade.phpに記述
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <h1>トップページ</h1>
</body>
</html>

Controllers

作ったindex.blade.phpを返すコードを書きます

コントローラーとは

アクセスされた際の処理を記述するところ

ファイル作成

  1. Dockerコンテナに入る
docker compose run app bash
  1. コントローラーファイルを作るコマンドを実行

（今回はTopController）

php artisan make:controller TopController

以下のようにファイルが生成されれば完了

.
├── laravel_app
│   └── app
│       └── Http
│           └── Controllers
│               └── TopController.php # ここに生成される
├── docker-compose.yml
└── Dockerfile
  1. TopController.phpに記述

（今回はindex関数を作成）

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class TopController extends Controller
{
    function index() {
        // 今回はviews/top/index.blade.phpなので"top.index"で指定可能
        return view("top.index");
    }
}

web.php

以下のようなルーティングを作成する

  • http://localhost:8000/topにアクセスした際に、TopControllerのindex関数を呼び出すようにする

ルーティングとは

特定のURLにアクセスした際の処理を割り当てること

ファイル作成

  1. web.phpに記述
<?php

use Illuminate\Support\Facades\Route;
// 使用するコントローラーをインポート
use App\Http\Controllers\TopController;

Route::get('/', function () {
    return view('welcome');
});

// Route::get(URL, [コントローラー::class, 関数名])->name(ルーティング名);
Route::get('/top', [TopController::class, 'index'])->("top.index");

.
├── laravel_app
│   └── routes
│       └── web.php # ここに記述
├── docker-compose.yml
└── Dockerfile

http://localhost:8000/topにアクセスして以下のような画面が出ればOK

Discussion