アプリケーションのフロントエンドとバックエンドで同じバリデーションルールを維持することは、メンテナンス性を向上させ、設定漏れを防ぐ上で重要です。本記事では、Vue.js と Laravel を使用してバリデーションルールを共通化する方法を紹介します。 1.Auth.phpに共通化したいバリデーションルールを定義 2.バ...
プログラミングの記事一覧
インストール npm install vuex@next --save npm audit npm audit fix /resources/js/store/index.jsを手動で作成 import { createStore } from 'vuex'; export default crea...
Vue.js を使って開発を行なっている際に、テキストエリアフィールドのモデルを更新する必要がある場面は多々あります。特に、ボタンクリックなどのアクションをトリガーとして、テキストエリアに特定のテンプレートを挿入する機能を実装することがあります。 しかし、以下のような単純なメソッドを利用してモデルを更新しようとした場合...
こんなオブジェクトがあったとする。 const genericObject = { key1: "", key2: "", key3: "", key4: "", // ... その他のキー }; フォームなどで送信後にこいつの中身を1個ず...
php.iniのmax_execution_timeやmemory_limitの値を変更してもだいぶ早い段階で504 Gateway Timeoutのエラーが出る場合の対処法。 データベース内の特定のテーブルを全てCSVで書き出すAPIを叩いたら発生した。 結論としては、Webサーバー（nginxとか）のタイムアウトの...
ワイ、Docker環境でLaravel触ってたら、なんと「Your serialized closure might have been modified or it's unsafe to be unserialized.」ってエラーが出てきてビビったわ。Docker環境で再現したんやけど、これが意外とシビアやった。...
.envとかに書いたデータベース接続情報(ユーザー名やパスワード)を変更したとき、普通にdocker compoes up -dとdocker compoes downしても、マイグレーション時に次のようなエラーが発生する。 root@c18be2e9af87:/work# php artisan migrate Il...
App＼Providers＼RouteServiceProviderに移動して、bootメソッド内でRateLimiterの設定を変更 Laravelを使ったWebアプリケーションを開発する際、複数のタブやウィンドウでページを高速に開くと、429 Too Many Requestsというエラーに遭遇することがあります。...
replace関数を使うと Error in v-on handler: "TypeError: Cannot read properties of null (reading 'replace')” とのエラーが表示されてしまう場合。 文字列を置き換える元の値が空の場合は、エラーになって...
Allowed memory size of 268435456 bytes exhausted (tried to allocate 4096 bytes) 一気に書き出そうとすると起こりがちなので、分割して書く処理に書き換える。 FromCollectionじゃなくてFromQueryを使おう。 //プロジェクトデ...
created_atカラムを更新させるシステムには気をつけろ！秒数まで明示的に更新しないとアーカイブの順番が入れ替わりまくるぞ！ 事象 私が開発に取り組んでいたプロジェクトは、ユーザーの問い合わせを記録し、新しい投稿順に表示するWebアプリケーションでした。 ユーザーが過去の日付の問い合わせを書き忘れていた場合には、そ...
LaravelでSanctuｍを使ってログイン認証システムを構築するも、一定時間で自動ログアウトされてしまう場合、任意の時間に変更が可能。 session.phpを編集して解決 プロジェクトディレクトリ/config/session.phpを編集する。 初期値は2時間になっている。 'lifetime...
VuetifyはVue.js用のMaterial Designフレームワークで、多くの事前設計されたコンポーネントを提供しています。 その一つにv-navigation-drawerというコンポーネントがあり、このコンポーネントを使用するとサイドメニューの作成が簡単になります。 v-navigation-drawerコ...
A.vueとB.vueで全く同じ関数を使う なんてことはよくある。 例えば電話番号をコピーする関数とかね。 同じコードを別々のファイルにかいていると、メンテナンス性が悪いのでvuexにまとめて書いて呼び出しちゃおうよ！って話。 vuex側の設定 // プロジェクトディレクトリ/resources/js/store/in...
appleシリコンMac(m1,m2)でvscodeでcopilotログイン不可 vscodeでcopilotにログインしようとするも「ログイン情報のキーチェーンへの書き込みが、エラー 'Password is required.' で失敗しました。」とのエラーが出る場合。 症状さ再現した環境は下記 Appleシリコン...
GitHub のリモートリポジトリを変更する方法は、主に Git コマンドラインツールを使用して行います。以下の手順でリモートリポジトリの変更が可能です。 まず、現在のリモートリポジトリを確認します。ターミナルでプロジェクトディレクトリに移動し、次のコマンドを実行してください。 git remote -v これにより、...
Something went wrong in Ignition! An error occurred in Ignition's UI. Please open an issue on the Ignition GitHub repo and make sure to include any errors or wa...
全部のファイルを戻す方法 git reset --hard HEAD 特定のファイルを戻す方法 git restore --source=HEAD <ファイル名> < > は削除してね。ファイルはリポジトリからみた相対パスを書いてね。 ファイル名をスペースで区切って列挙すると複数のファイルを戻せ...
Vue.jsを使ったリポジトリを他の端末にgit cloneするもlocalhostが真っ白で何も表示されない場合。 VueRouterが端末にインストールされていないか、移行アシスタントで別のMacにデータを移したかのどっちかの可能性が高い。 VueRouterがインストールされていない場合 ブラウザでhttp://...