Developer

Laravelで簡単な掲示板を作成の巻 第1話 魁!小野の塾
2022.10.04
Lv2

Laravelで簡単な掲示板を作成の巻 第1話 魁!小野の塾

Laravelで簡単な掲示板を作成

魁!小野の塾 PHPで簡単なプログラムを作ってみようの巻 第1話 では、簡単な掲示板をPHPで作成しました。

今回は、同じような機能をLaravelで構築していきます。
機能的には、登録処理、削除処理、エラーチェックなどを実装していきます。

前回のソースは、200行程度の1ファイルだったのですが、今回はどのように書き方が変わるのか、見ていければ良いかと思います。
また、フレームワークを利用する機会は増えましたので、しっかり開発手順を覚えて頂きたいです。

Bootstrapを利用したサンプルを作成していますが、Laravelは Tailwind をCSSのフレームワークとして押しています。
Tailwindはコンポーネント開発を前提としたCSSフレームワークで、CSSを知っている人には使いやすいですが、Bootstrapを長年利用している人には、少し難易度が高いと思います。

対象のスキルレベル

構築環境

  • Windows10
  • XAMPP 8.1.2(PHP 8.1.2, MariaDB 10.4.22)
  • Laravel v9.33.0

簡単な掲示板機能を構築

Laravelの環境構築 開発環境構築の巻 魁!小野の塾 にて、以下のコマンドは発行済のことを前提とします。

composer create-project laravel/laravel bbs

C:\xampp8.1.2\htdocs\bbs が作成されます。コマンドプロンプトで、bbs フォルダーに移動しておきます。(artisanコマンドを発行する為)

cd bbs

config/app.php 編集

Laravelの基本設定になります。timezone, locale, faker_locale を変更します。

<?php

use Illuminate\Support\Facades\Facade;

return [

    /*
    |--------------------------------------------------------------------------
    | Application Name
    |--------------------------------------------------------------------------
    |
    | This value is the name of your application. This value is used when the
    | framework needs to place the application's name in a notification or
    | any other location as required by the application or its packages.
    |
    */

    'name' => env('APP_NAME', 'Laravel'),

    /*
    |--------------------------------------------------------------------------
    | Application Environment
    |--------------------------------------------------------------------------
    |
    | This value determines the "environment" your application is currently
    | running in. This may determine how you prefer to configure various
    | services the application utilizes. Set this in your ".env" file.
    |
    */

    'env' => env('APP_ENV', 'production'),

    /*
    |--------------------------------------------------------------------------
    | Application Debug Mode
    |--------------------------------------------------------------------------
    |
    | When your application is in debug mode, detailed error messages with
    | stack traces will be shown on every error that occurs within your
    | application. If disabled, a simple generic error page is shown.
    |
    */

    'debug' => (bool) env('APP_DEBUG', false),

    /*
    |--------------------------------------------------------------------------
    | Application URL
    |--------------------------------------------------------------------------
    |
    | This URL is used by the console to properly generate URLs when using
    | the Artisan command line tool. You should set this to the root of
    | your application so that it is used when running Artisan tasks.
    |
    */

    'url' => env('APP_URL', 'http://localhost'),

    'asset_url' => env('ASSET_URL'),

    /*
    |--------------------------------------------------------------------------
    | Application Timezone
    |--------------------------------------------------------------------------
    |
    | Here you may specify the default timezone for your application, which
    | will be used by the PHP date and date-time functions. We have gone
    | ahead and set this to a sensible default for you out of the box.
    |
    */

    'timezone' => 'Asia/Tokyo',

    /*
    |--------------------------------------------------------------------------
    | Application Locale Configuration
    |--------------------------------------------------------------------------
    |
    | The application locale determines the default locale that will be used
    | by the translation service provider. You are free to set this value
    | to any of the locales which will be supported by the application.
    |
    */

    'locale' => 'ja',

    /*
    |--------------------------------------------------------------------------
    | Application Fallback Locale
    |--------------------------------------------------------------------------
    |
    | The fallback locale determines the locale to use when the current one
    | is not available. You may change the value to correspond to any of
    | the language folders that are provided through your application.
    |
    */

    'fallback_locale' => 'en',

    /*
    |--------------------------------------------------------------------------
    | Faker Locale
    |--------------------------------------------------------------------------
    |
    | This locale will be used by the Faker PHP library when generating fake
    | data for your database seeds. For example, this will be used to get
    | localized telephone numbers, street address information and more.
    |
    */

    'faker_locale' => 'ja_JP',

    /*
    |--------------------------------------------------------------------------
    | Encryption Key
    |--------------------------------------------------------------------------
    |
    | This key is used by the Illuminate encrypter service and should be set
    | to a random, 32 character string, otherwise these encrypted strings
    | will not be safe. Please do this before deploying an application!
    |
    */

    'key' => env('APP_KEY'),

    'cipher' => 'AES-256-CBC',

    ※以下略

.env 編集

app.configで設定しなかった項目の設定を行います。環境依存部分の設定は、.env ファイルに設定を行います。
ローカル環境、テスト環境及びステージング環境や本番環境用に、.env ファイルを作成し、切り替えて利用すると各段に管理が簡単になります。
app.configで設定したファイルを各環境毎に用意すると良く分からなくなるため、.env で設定することが重要になります。

ポイント

APP_NAME にはアプリケーション名を設定します。
名前に空白が入る場合は、値をダブルクォーテーション又はシングルクォーテーションで囲みます。

APP_NAME="BBS | TECH PJIN"
APP_ENV=local
APP_KEY=base64:dv52JYYKjUW5TIbdD5uK/t70uQ6I/58yTWzXWz586Cg=
APP_DEBUG=true
APP_URL=http://localhost

LOG_CHANNEL=stack
LOG_DEPRECATIONS_CHANNEL=null
LOG_LEVEL=debug

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=bbs
DB_USERNAME=root
DB_PASSWORD=

BROADCAST_DRIVER=log
CACHE_DRIVER=file
FILESYSTEM_DISK=local
QUEUE_CONNECTION=sync
SESSION_DRIVER=file
SESSION_LIFETIME=120

※以下略

DB_DATABASE=[今回作成するデータベース名] を設定します。
XAMPPをインストールするだけの場合は、データベースにパスワードが設定されていません。

database作成

phpMyAdminを起動し、データベースを作成します。
今回は、DB_DATABSEで指定している、bbs を作成します。

データベースタグを選択して、データベース名に bbs と入力し、照合順序を確認後、作成ボタンをクリックします。

Model作成

artisanコマンドをうって、モデルを作成します。
このコマンドを打つことで、migrateファイルが作成されます。
以下のコマンドをコマンドプロンプトで実行します。

php artisan make:model Bbs -m

自動作成ファイル

  1. app/Models/Bbs.php
  2. database/migrations/yyyy_MM_dd_HHmmss_create_bbs_table.php

app/Models/Bbs.php修正

自動生成されたファイルでは、リクエストを受けた際に全てのフィールドを項目として定義してしまうため、データベースのテーブルにない項目までマッピングしてしまい、エラーになります。
リクエストのキーとデータベースの項目名をマッピングするための変数($fillable)を定義します。

<php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Bbs extends Model
{
    use HasFactory;

    // 項目名を追加します
    protected $fillable = [
        'title',
        'contents',
    ];
}

今回のテーブルは、タイトル(title)と内容(contents)を入力するものとします。

database/migrations/yyyy_MM_dd_HHmmss_create_bbs_table.php修正

自動作成されたmigrateファイルでは、idとtimestamp(created_at, updated_at)の項目のみの定義になります。
今回は、varchar型のtitleと、text型のcontentsを追加します。

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

return new class extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('bbs', function (Blueprint $table) {
            $table->id();

            // 項目を追加します
            $table->string('title');
            $table->text('contents');

            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('bbs');
    }
};

migrate実行

以下のコマンドをコマンドプロンプトで実行します。

php artisan migrate

実行後、phpMyAdminにてデータベースを確認すると、bbsテーブルが出来ていることが確認できます。

今回はここまでにして、次回はコントローラー作成から始めたいと思います。

魁!小野の塾 連載目次リンク