自分だけのクイズ作成 - Quipha公開中

【M1 Mac】Laravel Sailで開発環境構築

Laravel
スポンサーリンク

はじめに

今回は、Laravel Sailを使って環境の構築を行いました。
SailはDockerですので、開発環境を簡単に用意することもできますし、カスタマイズすることも楽です。

Laravel SailはmacOS、Linux、Windowsに対応しています。
今回はMacで環境を構築しました。

WindowsでSailの環境構築方法につきましては、以下の記事をご覧ください。

詳しくは以下のサイトもご覧ください。

Laravel Sail 9.x Laravel
使用するバージョンなど
  • macOS Monterey (M1)
  • Docker Desktop
  • Laravel 9

他にも私のブログで、Laravelについて解説している記事がありますのでご覧ください。

【紹介】個人開発

私の個人開発ですがQuiphaというサービスを開発しました。(Laravel, Vue3など)
良かったら、会員登録して動作を試してみて下さい。

また、Laravel 9 実践入門という書籍を出版しました。
Kindle Unlimitedを契約している方であれば、読み放題で無料でご覧いただくことができます

是非多くの方に読んでいただき、Laravelの開発に少しでもお役に立てたら幸いです。

Laravelの環境構築について

環境構築について、以下のサイトの「最初のLaravelプロジェクト」に記載があります。

インストール 9.x Laravel

Laravel Sailで開発環境構築

メリットとしては、開発に必要な環境を簡単に用意することができます。
例えば、MySQLやComposer、Node.jsなどを、Macに個別にインストールする必要はありません
その他、開発に便利なツールなどはSailで選択することができます。

また、複数人での開発だったり、後日環境を再構築する際に、同じ環境を作れる点も利点でしょう。

開発に必要な環境を、色々とインストーラをダウンロードして設定していくのは面倒です。
Sailはコマンド一つで開発に必要な環境を構築できます。

デメリットを挙げるとすると、Dockerをそもそも使ったことがない人にとっては、少しハードルが高いかもしれませんね。

Laravel Sailを利用するためには、Docker Desktopが必要になります。

Laravelの翻訳ページには、「Dockerの経験がなくても」と書いてありますが、Sailのカスタマイズにはdocker-compose.ymlの編集が必要です。

確かにDockerコマンドを直接実行することはないのですが、それでもDockerの概要くらいは把握しておかないと、理解しづらい部分があると思います。

基本的にはSailでの構築をお勧めします
Dockerは便利ですので、これを機に覚えておくと良いでしょう。

Sailで構築していないLaravelプロジェクトを、後からSail環境へ移行することもできます。
詳しくは以下の記事にまとめました。

スポンサーリンク

事前準備

Laravel Sailを使用するには以下のインストールが必要です。

Docker Desktopのインストール

Docker Desktopのインストールが必要です。
詳しくは以下の記事を参考にしてください。

VS Code

VS Codeのインストール方法は、以下の記事にまとめましたのでご覧ください。

設定方法は以下を参考にしてください。

プロジェクト作成

まずはLaravelプロジェクトを作成しましょう。
Macのターミナルを起動します。

任意の場所にプロジェクトを作成します。
ユーザホームの書類(Documents)の直下にプロジェクトフォルダを作成しました。

% cd ~
% cd Documents
% mkdir Laravel-Project
% cd Laravel-Project

もし以下のようなメッセージが表示される場合は、OKをクリックします。

以下のコマンドでLaravelプロジェクトを作成します。
「example-app」の部分はプロジェクト名ですので、任意で指定します。

% curl -s "https://laravel.build/example-app" | bash

プロジェクトが作成されます。

途中でユーザのパスワードを求められますので、入力します。

続いて、以下のコマンドでLaravel Sailを起動します。

% cd example-app
% ./vendor/bin/sail up

もしターミナル上でコマンドを実行すると、「Operation not permitted」と表示される場合は、Macのシステム環境設定を変更します。

セキュリティとプライバシーを開き、フルディスクアクセスの「ターミナル.app」にチェックを入れます。

初回時はDockerイメージのビルドのために時間がかかります。

以下のURLにアクセスしましょう。いつものLaravel起動画面が表示されました。

http://localhost/

利用するサービスを指定することもできますが、指定しない場合は、mysql、redis、meilisearch、mailhog、seleniumが設定されます。

利用可能なサービスが色々あり、mysql、pgsql、mariadb、redis、memcached、meilisearch、minio、selenium、mailhogなど、選択するだけで使用できます。

Sailを停止する場合は、control ⌃ + C キーを押します。

VSCodeでプロジェクトを開く

この時点でLaravelプロジェクトファイル一式がダウンロードされ、Laravelの環境も構築されています。

さっそく、VS Codeでプロジェクトを開いてみましょう。
VS Codeを起動し、先ほど作成したフォルダを開きます

VS Codeでプロジェクトを開くことができました。

これ以降は、VS Codeのターミナルで操作しますので、Macのターミナルは終了しておいてください。

VS Codeのターミナルを開きます。

これ以降のコマンドはこのターミナルを使用します。

毎回、「./vendor/bin/sail」コマンドを実行するのは面倒です。
プロジェクト直下で「sail」コマンドを実行するために以下の対応を行います。

% vi ~/.zshrc

以下の内容を追記して保存します。

alias sail='[ -f sail ] && bash sail || bash vendor/bin/sail'

以下のコマンドで反映させます。

% source ~/.zshrc

改めてSailを起動して、Laravelの画面にアクセスできることを確認してください。

sail up

Sailを停止する場合は、control ⌃ + C キーを押します。

スポンサーリンク

Sailコマンド

Laravelプロジェクトですので、ComposerやArtisan、Node/NPMコマンドで操作する場面があると思います。
ローカルPCに直接インストールした場合は、これらのコマンドを使用できますが、今回はSailで環境構築をしているため、Sailコマンドを使用して実行する必要があります。

いくつかのコマンドを確認してみましょう。

Sailをバッググランドで起動と停止

Sailをバックグラウンドで実行します。

% sail up -d

停止する場合は、以下のコマンドを実行します。

% sail down

以降のコマンドを実行するため、Sailを起動しておいてください。

PHPの実行

以下のコマンドでPHPのバージョン確認をします。
※バージョン変更方法は後述します。

% sail php --version

PHP 8.1.4 (cli) (built: Apr  4 2022 13:30:33) (NTS)
...

sailコマンドを使用して実行しているところがポイントです。

artisanの実行

artisanのコマンド一覧を確認します。

% sail artisan list

ルーティングの一覧を表示してみましょう。

% sail artisan route:list

Nodeの実行

Nodeのバージョンを確認しましょう。

% sail node --version

v16.14.2

NPMコマンドでパッケージをインストールしましょう。

% sail npm install

NPMでJS/CSSをビルドします。

% sail npm run prod

例:
% sail npm run dev
% sail npm run watch

パッケージをインストールしないで実行すると、以下のエラーが表示されます。
sh: 1: mix: not found

Sailコマンドを通して実行しているだけで、使い方は同じです。

テーブルの作成

以下のコマンドでテーブルを作成しましょう。

% sail artisan migrate

.envファイルが既に存在し、データーベースの接続設定も記載されているため、何も設定せずにテーブルの作成が完了しました。

Migration table created successfully.
Migrating: 2014_10_12_000000_create_users_table
Migrated:  2014_10_12_000000_create_users_table (155.58ms)
Migrating: 2014_10_12_100000_create_password_resets_table
Migrated:  2014_10_12_100000_create_password_resets_table (140.70ms)
Migrating: 2019_08_19_000000_create_failed_jobs_table
Migrated:  2019_08_19_000000_create_failed_jobs_table (150.64ms)
Migrating: 2019_12_14_000001_create_personal_access_tokens_table
Migrated:  2019_12_14_000001_create_personal_access_tokens_table (300.12ms)

後述していますが、phpMyAdminからも確認できます。

Sailカスタマイズ

docker-compose.yml

docker-compose.ymlはこのようになっていました。

# For more information: https://laravel.com/docs/sail
version: '3'
services:
    laravel.test:
        build:
            context: ./vendor/laravel/sail/runtimes/8.1
            dockerfile: Dockerfile
            args:
                WWWGROUP: '${WWWGROUP}'
        image: sail-8.1/app
        extra_hosts:
            - 'host.docker.internal:host-gateway'
        ports:
            - '${APP_PORT:-80}:80'
        environment:
            WWWUSER: '${WWWUSER}'
            LARAVEL_SAIL: 1
            XDEBUG_MODE: '${SAIL_XDEBUG_MODE:-off}'
            XDEBUG_CONFIG: '${SAIL_XDEBUG_CONFIG:-client_host=host.docker.internal}'
        volumes:
            - '.:/var/www/html'
        networks:
            - sail
        depends_on:
            - mysql
            - redis
            - meilisearch
            - selenium
    mysql:
        image: 'mysql/mysql-server:8.0'
        ports:
            - '${FORWARD_DB_PORT:-3306}:3306'
        environment:
            MYSQL_ROOT_PASSWORD: '${DB_PASSWORD}'
            MYSQL_ROOT_HOST: "%"
            MYSQL_DATABASE: '${DB_DATABASE}'
            MYSQL_USER: '${DB_USERNAME}'
            MYSQL_PASSWORD: '${DB_PASSWORD}'
            MYSQL_ALLOW_EMPTY_PASSWORD: 1
        volumes:
            - 'sail-mysql:/var/lib/mysql'
        networks:
            - sail
        healthcheck:
            test: ["CMD", "mysqladmin", "ping", "-p${DB_PASSWORD}"]
            retries: 3
            timeout: 5s
    redis:
        image: 'redis:alpine'
        ports:
            - '${FORWARD_REDIS_PORT:-6379}:6379'
        volumes:
            - 'sail-redis:/data'
        networks:
            - sail
        healthcheck:
            test: ["CMD", "redis-cli", "ping"]
            retries: 3
            timeout: 5s
    meilisearch:
        image: 'getmeili/meilisearch:latest'
        ports:
            - '${FORWARD_MEILISEARCH_PORT:-7700}:7700'
        volumes:
            - 'sail-meilisearch:/data.ms'
        networks:
            - sail
        healthcheck:
            test: ["CMD", "wget", "--no-verbose", "--spider",  "http://localhost:7700/health"]
            retries: 3
            timeout: 5s
    mailhog:
        image: 'mailhog/mailhog:latest'
        ports:
            - '${FORWARD_MAILHOG_PORT:-1025}:1025'
            - '${FORWARD_MAILHOG_DASHBOARD_PORT:-8025}:8025'
        networks:
            - sail
    selenium:
        image: 'selenium/standalone-chrome'
        volumes:
            - '/dev/shm:/dev/shm'
        networks:
            - sail
networks:
    sail:
        driver: bridge
volumes:
    sail-mysql:
        driver: local
    sail-redis:
        driver: local
    sail-meilisearch:
        driver: local

PHPのバージョンの変更

Sailのカスタマイズができます。
ここではPHPのバージョンを変更してみましょう。

Sailは現在、PHP8.1、PHP8.0、PHP7.4を利用したアプリケーションの実行をサポートしています。

https://readouble.com/laravel/9.x/ja/sail.html

現時点では、以下のバージョンが入っていました。

PHP 8.1.4

プロジェクト直下にあるdocker-compose.ymlを開きます。
以下の箇所を確認しましょう。

        build:
            context: ./vendor/laravel/sail/runtimes/8.1

PHP8.0に変更してみましょう。

        build:
            context: ./vendor/laravel/sail/runtimes/8.0

Dockerのimage名も変更しておきましょう。

image: sail-8.0/app

余談ですが、Dockerイメージとして作成されますので、Docker Desktopから確認することができます。
sail-8.1/appというのが、PHPの最新がインストールされているイメージです。

Dockerイメージとコンテナを再構築するために、以下のコマンドを実行します。
イメージがビルドされるため、時間がかかります。

% sail build --no-cache
% sail up

完了後、念の為Dockerイメージを確認すると、PHP8.0のイメージが作成されていました。

改めてプロジェクトのPHPのバージョンを確認したところ、正常にPHP8.0になっていました。

% sail php --version

PHP 8.0.17

Laravelのコーディングの仕方については、SailでもSailではない場合でも同じです。

phpMyAdminのインストール

phpMyAdminをインストールすることができます。
以下の記事をご覧ください。

デバッグや連携

他にもデバッグの方法など、別な記事で解説していますのでご覧ください。

その他

初学者へ

Laravelを初めて触る方へ向け、手順やアドバイスをまとめました。

外部サーバーへ公開

作成したアプリは公開して使ってもらいましょう!
Laravelアプリケーションを外部公開する方法をまとめました。

脆弱性対策

脆弱性を抱えたアプリケーションの場合、攻撃を受ける可能性があり大変危険です。
作成したアプリケーションは、脆弱性対策も意識しましょう。

GitHubと連携

GitHubと連携する方法を解説しました。
プロジェクトの管理はGitHubを活用しましょう。

さいごに

今回は、Laravel Sailを使って環境の構築を行いました。
多少Dockerの知識があったほうが理解しやすいと思いますが、簡単に環境を構築することができますので便利です。

他にも私のブログで、Laravelについて解説している記事がありますのでご覧ください。

\オススメ/

コメント

タイトルとURLをコピーしました