【Laravel】やっとVue.jsとLaravelを連携させる+MailHogを試す

研究
この記事は約6分で読めます。

やっと掛かれるよゆうきゃん会長(@ucan_lab)さん。

Docker × Laravel Vueをインストールしてユーザー登録&ログイン機能を実装する – Qiita

DockerでLaravel環境を構築する記事を書きましたが、 Vue以外にもReactを選択したり、フロント側はそもそもリポジトリを分けて開発する場合もあり前回の記事では紹介しきれていませんでした。 今回はLaravel環境を構築したあと、Vueのインストールまで試してみます。 Laravelバージョン 5.8 までは、 php artisan make:auth というコマンドが用意されていましたが、 Laravel 6.0 以降は Laravel UI パッケージに切り離されました。 最強のLaravel開発環境をDockerを使って構築する【新編集版】 当記事は上記の記事の補足になる記事です。 $git clone git@github.com:ucan-lab/docker-laravel.git $ cd docker-laravel $make create-project http://127.0.0.1 とりあえず、Laravelの環境を構築します。 PHP: 7.4.6 Laravel: 7.24.0 Laravel UI: 2.1.0 Node: 14.2.0 npm: 6.14.4 yarn: 1.22.4 Vue: 2.6.11 正直どちらでも構わないと思います。 ただ、どちらを使うかプロジェクトで統一されている必要はあるかと思います。 今回はnpm, yarnコマンドを併記する形で進めたいと思います。 公式の手順に沿って、実行します。 私のDocker環境の場合は下記の流れになります。 $

使うDockerは以下のリンクを参考に作り直し、推奨してる環境に作り直してみます(作ると言うかクローンしたのみw)。

最強のLaravel開発環境をDockerを使って構築する【新編集版】 – Qiita

お急ぎの方は 使い方 からお読みください。 Docker, Docker Compose を使って、nginx, php-fpm, MySQLの実行環境(LEMP)を構築して、最強のLaravel開発環境を構築する記事です。 Laravelが最低限動作して、シンプルで軽量かつベストプラクティスなコンテナ、ディレクトリ構成を考えました。 最小限の構成なので、Dockerイメージのビルドは Laradock より10倍以上高速にビルド完了します。 スターをもらえると嬉しいです☺️ PHP, Linuxを完全に理解している方 Laravelを愛する心の持っている方 Dockerの知識をある程度持っている方 Dockerについて学びたい方は以前に 【初心者向け】20分でLaravel開発環境を爆速構築するDockerハンズオン というハンズオン記事を書いてますので、こちらをお読みいただけると理解が捗るかと思います。 入れておいてね DCTは、Dockerイメージを「なりすまし」と「改ざん」から保護するセキュリティ機能です。 Docker イメージへ発行者のデジタル署名を付ける イメージの利用時(pull など)に「発行者」と「イメージが改ざんされていないこと」を検証する push, build, create, pull, run のコマンド実行時に自動で機能します。 下記の3つのコンテナで構成します。 LEMP環境を作成します。 よく利用されるシンプルな構成だと思うのでこの構成にしました。 プロジェクトに合わせてご自由にカスタムしてください👍 アプリケーションサーバーのコンテナ HTTPリクエストを受けて、HTTPレスポンスを返す phpファイルへのアクセスはappコンテナに投げる nodeイメージからyarnコマンドをインストールして、アセットファイルのビルドも担当する nginx, node のベースイメージを利用 データベースサーバーのコンテナ MySQLのバージョンは8.0系を利用する 5.7系は2020年10月にサポートが切れるので注意 本番環境でAmazon Auroraを使用する場合は現時点で5.7互換までしかサポートしていないので注意 mysql

最初のリンクに従い、Laravelの初期画面にLogin/Registerを確認。

何度かリロードしないとCSSが来なかった。焦った。

叱られた。
独自ドメインにやってきて3回目くらいだけど、ちゃんとマイグレーションとか読むの。

ほら通った。
ついでなのでMailHogも試してみる。

Docker × Laravel メールの送信処理をローカルで確認する – Qiita

ウェブサーバー、アプリケーションサーバー、データベースサーバーが用意されていれば最低限Laravelを動作させることはできますが、実際に開発を進めてくるとメールを送信する処理を書くことが多くあります。 ローカルでのメール確認のためにメールサーバーを用意して、たくさんのメールアカウントを作って、メールを送信して、各メールアカウントでログインして確認…するのはとても非効率です。 そこでメール送信テストツールのMailHogというツールが公式のDockerイメージが提供されています。 こちらを利用すると実際にメールを送信することなく、メール内容をWeb UIで確認できます。 開発者向けのメールテストツール 最強のLaravel開発環境をDockerを使って構築する【新編集版】 当記事は上記の記事の補足になる記事です。 $git clone git@github.com:ucan-lab/docker-laravel.git $ cd docker-laravel $make create-project まずはサクッと環境構築します。 ※ docker-compose.yml や Dockerfile を変更する場合は予めコンテナを破棄しておくと良いです。 services : mail : image : mailhog/mailhog ports : – 8025:8025 mail サービスの設定を services 配下に追記します。 特にカスタマイズは必要ないので、公式の MailHogイメージ をそのまま利用します。 コンテナを作成して起動します。 $ docker-compose ps Name Command State Ports ————————————————————————————————- docker-laravel_app_1

それっぽいメールが飛んだのを確認。

さて…ありものに乗っかって習得してきた感があるけれど、以前CIで作っていたものをこの際Laravelに移植してGitHubに晒そうか、CIのままVue.jsで仕上げようか迷ってます。

コメント

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