カテゴリー
Linux

Laravel 8 で Vue.js 3 を SPA として使えるようにした記録メモ

どの状態から始めたか?

Laravel 8 をインストールした直後に Vue.js 3 を SPA として最低限使えるようにしました。

カテゴリー
Linux

Chart.js 3.7.0 、 90度回転させた線チャートのグラフ両側にラベルを表示する方法

まとめ

  • チャートの右側にラベルを表示するためのプラグインを用意し、これを使用した。
  • Chart.js のオプションで設定する方法を見つけることはできなかった。
カテゴリー
コンピューター

Laravel の `DATABASE_URL` を外部の環境変数 (server レベル) で設定している場合、 PHPUnit テストの 1 個目は通常に行われるのに 2 個目で DB 接続エラーとなってしまう問題を解決した

エラー対処まとめ

  • 今回の状況
    • Laravel 8.55.0
    • PHPUnit テストをインメモリ SQLite で行いたい。
    • DATABASE_URL を外部の環境変数 (server レベル) で設定している。
  • テスト用に DATABASE_URL を指定する以外に、 DB_CONNECTIONDB_DATABASE も指定する必要がある。
  • 次のように phpunit.xml に指定すればよい。
        <server name="DATABASE_URL" value="sqlite:///:memory:?foreign_key_constraints=true" force="true"/>
        <server name="DB_CONNECTION" value="sqlite"/>
        <server name="DB_DATABASE" value=":memory:"/>
カテゴリー
Linux

laravel-permission。 ユーザーに紐づく全てのパーミッションを取得する。この時、パーミッションがロールに属している場合はそのロールも取得したい、を実現する Eloquent ORM とリレーション

環境

$ php artisan --version
Laravel Framework 6.20.30
$
$ composer show | grep spatie/laravel-permission
spatie/laravel-permission                 4.2.0     Permission handling for Laravel 6.0 and up
$
カテゴリー
Linux

Laravel 6 、 PHPUnit をデータプロバイダを利用したリファクタリングによりコードの重複を減らす方法

はじめに

Laravel のバリデーションクラスであるフォームリクエストをユニットテストするためのノウハウ – oki2a24 のリファクタリングを行いました。

PHPUnit のデータプロバイダを利用して、重複をできるだけ取り除いた内容となります。

本投稿での Laravel 等のバージョンです。

$ php artisan --version
Laravel Framework 6.20.30
$ 
$ composer show | grep phpunit/phpunit
phpunit/phpunit                           9.5.7     The PHP Unit Testing framework.
$ 

まとめ

  • データプロバイダ – 2. PHPUnit 用のテストの書き方 — PHPUnit latest Manual
  • データプロバイダのデートとしてファクトリを使用して DB データを生成する場合は、データプロバイダを利用するのは難しい。データプロバイダメソッド内のファクトリメソッドで DB レコードとそのモデルデータを用意しても、それを利用するテストメソッドの前に DB レコードは削除されてしまうため。具体的には、テストはデータプロバイダメソッドの実行後に、 refreshDatabase() を実行し、次にデータプロバイダを利用するテストメソッドを実行するため。
  • データプロバイダを利用するテストメソッドを、別のテストメソッドから呼び出すことは可能だった。テスト失敗した場合も、期待通り別のテストメソッドで失敗したと出力されていた。
カテゴリー
コンピューター

Vue.js 3 で Dropzone をラップした SFC その 4 。ファイルアップロード前の確認などの操作を SFC 呼び出し元で自由に制御する

まとめ

  • Dropzone の addedfile イベント時に emit するが、この時に送出する変数としてイベント発生時に受け取れる file 以外に、 Dropzone オブジェクトも加える。

話としては、 Vue.js 3 で Dropzone をラップした SFC その3 。ファイルアップロード前に確認操作を挟む – oki2a24 の続きとなります。

カテゴリー
コンピューター

Vue.js 3 で Dropzone をラップした SFC その3 。ファイルアップロード前に確認操作を挟む

Vue.js 3 で Dropzone をラップした SFC その2 。 HTML 要素 の id ではなく要素そのものを指定して Dropzone と紐付ける等 – oki2a24 の続きとなります。

Dropzone はファイルをドロップや選択すると予め指定した URL に対して、自動的に即座にアップロードを開始します。 とても便利ですけれども、例えば、ヘッダに情報を追加した Axios を他のところでも使っているので Dropzone でも使いたい、ファイルアップロード前に確認操作を挟みたい、という時はどうしたら良いでしょうか?

本投稿では、ファイルアップロード前に確認操作を挟みたい、の例をとりあげます。

カテゴリー
コンピューター

Laravel 6 のメールの絡む開発用に MailHog の Docker コンテナを構築する方法のメモ

まとめ

  • Docker 側のコードは mailhog/mailhog イメージを使うだけ。
  • Laravel 側では、 .env を変更するだけ。
カテゴリー
Linux

Docker コンテナ内の Laravel から外部サービスを使わずにメールを送信するために Docker コンテナ内に exim4 をインストールしたらできた、という記録

まとめ

カテゴリー
Linux

【Vue.js 3】 Bootstrap4 ページネーションのシングルファイルコンポーネントを、参考サイトそのままに Vue.js 3 Compotision API 化したコード

はじめに

本投稿は、 【Vue.js】ページネーションコンポーネント(ページ遷移ごとにデータを取得するタイプ) | Wood-Roots:blog にて Vue.js 2 で書かれたページネーションのシングルファイルコンポーネント (SFC) を Vue.js 3 で書き直したものです。

元となった 【Vue.js】ページネーションコンポーネント(ページ遷移ごとにデータを取得するタイプ) | Wood-Roots:blog に感謝申し上げます!

また、本投稿は、本ブログの Vue.js 3 で flatpickr をラップした SFCその2 。ページ移動時に発生していたエラーを解消する – oki2a24 の続きとなります。