中野's workspace

  • Profile
  • Privacy
  • Contact

2021/12/28

Laravel8でTODOアプリ作成 環境準備

目次

この記事について

Laravel8のチュートリアルとして、TODOアプリを作っていきます。
長くなるので、分割していきます。

一覧は下記で閲覧可能です。
LaravelでTODOアプリ作成

まずは前回 (素のPHPでシンプルなTODOアプリを作成する) で作成したTODOアプリと同じ挙動になるようにすることを目標として開発していきます。

※ この記事は実際にTODOアプリを作っていく前の事前準備記事となっているので不要であれば適当に読み飛ばしてください。

動作を確認したバージョン情報は下記です。

  • PHP 8.0
  • MySQL8.0
  • Laravel 8.0

Laravel8で環境構築

まずはLaravel8で環境構築を行います。

ここら辺はなんでも良いですが、自分は下記コマンドを使用してプロジェクトを作成しました。

composer create-project "laravel/laravel=8.*" sample-todo

出来上がったプロジェクトを立ち上げて、resources/views/welcome.blade.phpが表示されるようになっていれば環境構築完了です。

初期画面表示

次にresources/views配下にindex.blade.phpを作成し、下記を記載してください。

index.blade.php
<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>TodoApp</title>
    </head>
    <body>
        <h1>TODOアプリ</h1>

        <section>
            <form method="post">
                <input type="text" name="submit" required>
                <button type="submit">作成する</button>
            </form>
        </section>
    </body>
</html>

次に、ルーティングの設定を行っていきます。

routes/web.phpを開くと

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

となっています。
初期表示時にresources/views/welcome.blade.phpを呼び出すという設定です。
これをindex.blade.phpを呼び出すように変えてあげましょう。

web.phpを

web.php
Route::get('/', function () {
    return view('index');
});

と切り替え、再び初期表示します。

index.blade.phpに記載した内容が出力されていれば、事前準備完了です。

次にやること

ここまでで、実際にTODOアプリの処理を書いていく基盤が出来たと思います。

ただし、このままでは単にviewを返しているだけなのでTODOアプリに必要な処理が書けません。

ということで次回はTODOアプリの初期表示をLaravelのお作法に則って表示するようにしてみます。

このエントリーをはてなブックマークに追加
  • Copyright © 2019. Makoto Nakano
  • ALL Tags