はじめに 一週間前から初めて触るVue + Laravelの環境で新規案件を開発しはじめました。 入力フォームの情報を確認画面に渡し、入力ミスなどで入力フォームに戻る際に、Laravelでフォームの情報を受け渡ししようかと奮闘しましたができず、結局Javascriptの力技で解決しました。。。多分 本来のやり方ではないと思いますが、良かったら参考にしてください。 環境 バックエンド:PHP - Laravel8 フロントエンド:Vue.js DB:Mysql ver8.0 Docker使用 最初にやろうとしたこと 新規入力フォーム userCreate.vue <template> <form @submit.prevent="submit"> <label for="name">名前</label> <input type="text" id="name" name="name" v-model="form.name" /> <label for="email">メールアドレス</label> <input type="text" id="email" name="email" v-model="form.email" /> <button name="test" type="submit">送信</button> </form> </template> <script> //中略 export default { 　　　　　props: { user: Object, }, data() { return { 　　　　　　　　　　　　　// 戻った時に予め入力していた値を受け取り、フォームに復元する form: this.$inertia.form({ name: this.user.name, email: this.user.email, }), }; }, methods: { submit() { this.form.post(this.route("userconfirm")); }, }, }; </script> 入力確認フォーム userConfirm.vue <template> <form @submit.prevent="submit"> <table> <tbody> <tr> <td>名前</td> <td>{{ user.name }}</td> </tr> <tr> <td>email</td> <td>{{ user.email }}</td> </tr> </tbody> </table> <button name="back" type="submit">戻る</button> <button name="send" type="submit">送信</button> </form> </template> <script> //中略 export default { 　　　　　props: { user: Object, }, data() { return { form: this.$inertia.form({ name: this.user.name, email: this.user.email, }), }; }, methods: { submit() { // data()内のformデータをコントローラに送る this.form.post(this.route("usercomplate")); }, }, }; </script> laravel側コントローラー userController.php <?php namespace App\Http\Controllers; use Inertia\Inertia; use Illuminate\Http\Request; use App\Models\User; class UserController extends Controller { public function create() { return Inertia::render('Mypage/UserCreate'); } public function confirm(Request $request) { $user = $request->all(); return Inertia::render('Mypage/UserConfirm', ['user' => $user]); } public function complete(Request $request) { if($request->has('send')){ // ここに保存の処理 }elseif($request->has('back')){ // ここに新規入力フォームに戻る処理 $user = $request->all(); return Inertia::render('Mypage/UserConfirm', ['user' => $user]); } } } ボタンのnameを受け取りif文で条件分岐処理を行うのがLaravelのベストプラクティスかと思われますが、どうやってもname属性を受け渡しできずにLaravelでの処理は諦めました。。。。。 URLから受け取る処理をVueで実装する 新規入力フォーム userCreate.vue <template> <form @submit.prevent="submit"> <label for="name">名前</label> <input type="text" id="name" name="name" v-model="form.name" /> <label for="email">メールアドレス</label> <input type="text" id="email" name="email" v-model="form.email" /> <button type="submit">送信</button> </form> </template> <script> //中略 export default { 　　　　　props: { user: Object, }, data() { 　　　　　　　　// ①ここを追加 　　　　　　　　let url = new URL(window.location.href); let params = url.searchParams; return { 　　　　　　　　　　　　　// ②パラメータを受け取り、フォームに復元する form: this.$inertia.form({ name: params.get("name"), email: params.get("email"), }), }; }, methods: { submit() { this.form.post(this.route("userconfirm")); }, }, }; </script> 入力確認フォーム userConfirm.vue <template> <form @submit.prevent="submit"> <table> <tbody> <tr> <td>名前</td> <td>{{ user.name }}</td> </tr> <tr> <td>email</td> <td>{{ user.email }}</td> </tr> </tbody> </table> <div @click="backpage">戻る</div> <button type="submit">送信</button> </form> </template> <script> //中略 export default { 　　　　　props: { user: Object, }, data() { return { form: this.$inertia.form({ last_name: this.user.name, email: this.user.email, }), }; }, methods: { submit() { this.form.post(this.route("usercomplete")); }, 　　　　　　　　// 入力値が含まれるパラメーターを送る backpage() { this.form.get(this.route("usercreate")); }, }; </script> [戻る]をクリックしbackpageメソッド実行されると、下記のような入力データが入ったパラメータが送られるため①でURLを取得し、②で各項目をGetしてからdataに初期値を渡す。 http://localhost:8080//user/create?name=foobar&email=test@test.com 参考サイト URLに含まれるGETパラメータを取得する Laravelにて１つのFormで複数ボタンを実装する際の備忘録 正しい方法ではないかもしれませんがご参考まで

はじめに 一週間前から初めて触るVue + Laravelの環境で新規案件を開発しはじめました。 入力フォームの情報を確認画面に渡し、入力ミスなどで入力フォームに戻る際に、Laravelでフォームの情報を受け渡ししようかと奮闘しましたができず、結局Javascriptの力技で解決しました。。。多分 本来のやり方ではないと思いますが、良かったら参考にしてください。 環境 バックエンド:PHP - Laravel8 フロントエンド:Vue.js DB:Mysql ver8.0 Docker使用 最初にやろうとしたこと 新規入力フォーム userCreate.vue <template> <form @submit.prevent="submit"> <label for="name">名前</label> <input type="text" id="name" name="name" v-model="form.name" /> <label for="email">メールアドレス</label> <input type="text" id="email" name="email" v-model="form.email" /> <button name="test" type="submit">送信</button> </form> </template> <script> //中略 export default { 　　　　　props: { user: Object, }, data() { return { 　　　　　　　　　　　　　// 戻った時に予め入力していた値を受け取り、フォームに復元する form: this.$inertia.form({ name: this.user.name, email: this.user.email, }), }; }, methods: { submit() { this.form.post(this.route("userconfirm")); }, }, }; </script> 入力確認フォーム userConfirm.vue <template> <form @submit.prevent="submit"> <table> <tbody> <tr> <td>名前</td> <td>{{ user.name }}</td> </tr> <tr> <td>email</td> <td>{{ user.email }}</td> </tr> </tbody> </table> <button name="back" type="submit">戻る</button> <button name="send" type="submit">送信</button> </form> </template> <script> //中略 export default { 　　　　　props: { user: Object, }, data() { return { form: this.$inertia.form({ name: this.user.name, email: this.user.email, }), }; }, methods: { submit() { // data()内のformデータをコントローラに送る this.form.post(this.route("usercomplate")); }, }, }; </script> laravel側コントローラー userController.php <?php namespace App\Http\Controllers; use Inertia\Inertia; use Illuminate\Http\Request; use App\Models\User; class UserController extends Controller { public function create() { return Inertia::render('Mypage/UserCreate'); } public function confirm(Request $request) { $user = $request->all(); return Inertia::render('Mypage/UserConfirm', ['user' => $user]); } public function complete(Request $request) { if($request->has('send')){ // ここに保存の処理 }elseif($request->has('back')){ // ここに新規入力フォームに戻る処理 $user = $request->all(); return Inertia::render('Mypage/UserConfirm', ['user' => $user]); } } } ボタンのnameを受け取りif文で条件分岐処理を行うのがLaravelのベストプラクティスかと思われますが、どうやってもname属性を受け渡しできずにLaravelでの処理は諦めました。。。。。 URLから受け取る処理をVueで実装する 新規入力フォーム userCreate.vue <template> <form @submit.prevent="submit"> <label for="name">名前</label> <input type="text" id="name" name="name" v-model="form.name" /> <label for="email">メールアドレス</label> <input type="text" id="email" name="email" v-model="form.email" /> <button type="submit">送信</button> </form> </template> <script> //中略 export default { 　　　　　props: { user: Object, }, data() { 　　　　　　　　// ①ここを追加 　　　　　　　　let url = new URL(window.location.href); let params = url.searchParams; return { 　　　　　　　　　　　　　// ②パラメータを受け取り、フォームに復元する form: this.$inertia.form({ name: params.get("name"), email: params.get("email"), }), }; }, methods: { submit() { this.form.post(this.route("userconfirm")); }, }, }; </script> 入力確認フォーム userConfirm.vue <template> <form @submit.prevent="submit"> <table> <tbody> <tr> <td>名前</td> <td>{{ user.name }}</td> </tr> <tr> <td>email</td> <td>{{ user.email }}</td> </tr> </tbody> </table> <div @click="backpage">戻る</div> <button type="submit">送信</button> </form> </template> <script> //中略 export default { 　　　　　props: { user: Object, }, data() { return { form: this.$inertia.form({ last_name: this.user.name, email: this.user.email, }), }; }, methods: { submit() { this.form.post(this.route("usercomplete")); }, 　　　　　　　　// 入力値が含まれるパラメーターを送る backpage() { this.form.get(this.route("usercreate")); }, }; </script> [戻る]をクリックしbackpageメソッド実行されると、下記のような入力データが入ったパラメータが送られるため①でURLを取得し、②で各項目をGetしてからdataに初期値を渡す。 http://localhost:8080//user/create?name=foobar&email=test@test.com 参考サイト URLに含まれるGETパラメータを取得する Laravelにて１つのFormで複数ボタンを実装する際の備忘録 正しい方法ではないかもしれませんがご参考まで

はじめに 今回は、Laravel8でアカウント作成後のリダイレクト先を変更する方法についてご紹介します！ また、ログイン後のリダイレクト先変更については、こちらの記事で紹介していますので是非参考にしてください。 https://qiita.com/yyy752/items/60511e1ef799f9943ee7 リダイレクト先変更 1.RegisterResponseを新規作成。 /app/Http/Responses/RegisterResponse.php <?php namespace App\Http\Responses; use Illuminate\Http\JsonResponse; use Illuminate\Http\Response; use Laravel\Fortify\Contracts\RegisterResponse as RegisterResponseContract; class RegisterResponse implements RegisterResponseContract { public function toResponse($request) { // below is the existing response // replace this with your own code return $request->wantsJson() ? new JsonResponse('', 201) : redirect('/list'); } } 2.JetstreamServiceProviderのbootを修正。 /app/Providers/JetstreamServiceProvider.php public function boot() { $this->configurePermissions(); Jetstream::deleteUsersUsing(DeleteUser::class); // register new RegisterResponse $this->app->singleton( \Laravel\Fortify\Contracts\RegisterResponse::class, \App\Http\Responses\RegisterResponse::class ); } まとめ 以上でアカウント作成後のリダイレクト先を変更できました！ 是非参考にしてみてください！ 参考サイト

はじめに 我が家の愛犬の世話は、家族で分担しています。 家族間で情報を共有し、愛犬の体調管理をスムーズにするために、散歩や餌の時間・量、排泄の回数などの記録（以下、お世話記録とする）を手軽に行えるアプリを作りたいと思います。 バックナンバー (1)【構想】 (2)【開発環境】 (3)【DB設計】　＜　今回はここ DB設計 どんなテーブルのデータベースが必要なのか考えていきます。 最終的にはグループウェアのように、複数人で一匹のペットに関する記録を投稿できるようにしたいですが、処理が複雑になりそうなので、まずは一人で使う前提です。 テーブル１：users カラム名 内容 カラムタイプ 備考 id ユーザID bigint(20) unsigned name ユーザ名 varchar(255) email メールアドレス varchar(255) password パスワード varchar(255) created_at 作成日時 timestamp updated_at 更新日時 timestamp テーブル２：walks（さんぽ） カラム名 内容 カラムタイプ 備考 id ID bigint(20) unsigned user_id ユーザID bigint(20) unsigned recorded_on お世話の実行時刻 dateTime time 散歩した時間 integer 単位：分 note メモ text created_at 作成日時 timestamp updated_at 更新日時 timestamp テーブル３：pees（おしっこ） カラム名 内容 カラムタイプ 備考 id ID bigint(20) unsigned user_id ユーザID bigint(20) unsigned recorded_on お世話の実行時刻 dateTime amount 量 integer 選択肢（少なめ/ふつう/多め） color 色 integer 選択肢（薄い黄色/黄色/濃い黄色/赤/その他） odor におい integer 選択肢（ふつう/くさい/異臭） note メモ text created_at 作成日時 timestamp updated_at 更新日時 timestamp テーブル３：poops（うんち） カラム名 内容 カラムタイプ 備考 id ID bigint(20) unsigned user_id ユーザID bigint(20) unsigned recorded_on お世話の実行時刻 dateTime amount 量 integer 選択肢（少なめ/ふつう/多め） color 色 integer 選択肢（薄い茶色/茶色/濃い茶色/赤/その他） odor におい integer 選択肢（ふつう/くさい/異臭） note メモ text created_at 作成日時 timestamp updated_at 更新日時 timestamp テーブル４：foods（ドッグフードのリスト） カラム名 内容 カラムタイプ 備考 id ID bigint(20) unsigned name ドッグフード名 varchar(255) maker メーカー名 varchar(255) calorie_published 基本カロリー integer 単位：kcal/100g note メモ text created_at 作成日時 timestamp updated_at 更新日時 timestamp テーブル５：feeds（ごはん） カラム名 内容 カラムタイプ 備考 id ID bigint(20) unsigned user_id ユーザID bigint(20) unsigned recorded_on お世話の実行時刻 dateTime food_name_1 ドッグフード名１ varchar(255) amount_1 量１ integer 単位：g food_name_2 ドッグフード名２ varchar(255) ※ドッグフード切替時のブレンドに対応 amount_2 量２ integer 単位：g calorie 摂取カロリー integer 単位：kcal、ドッグフード名と基本カロリー、量から計算 note メモ text created_at 作成日時 timestamp updated_at 更新日時 timestamp テーブル６：cares（その他のお世話リスト） カラム名 内容 カラムタイプ 備考 id ID bigint(20) unsigned name お世話名 varchar(255) created_at 作成日時 timestamp updated_at 更新日時 timestamp テーブル７：others（その他のお世話） カラム名 内容 カラムタイプ 備考 id ID bigint(20) unsigned user_id ユーザID bigint(20) unsigned care_name お世話名 varchar(255) recorded_on お世話の実行時刻 dateTime note メモ text created_at 作成日時 timestamp updated_at 更新日時 timestamp 今回は以上です。

はじめに 　今回はPHPの関数について見ていきたいと思います。 我々初学者が最初につまづくポイントの一つでもあると思うので、自分なりにまとめて、しっかり定着させていきたいと思います。 関数とは 　PHPでは下記のように書きます。 sample.php function addition($x,$y) { $sum = $x + $y; return $sum; } echo addition(2, 5); 　functionとすることで関数が定義されます。()内には引数、{}内に処理を書き、returnは戻り値（または返り値）を示しています。そしてその関数を使いたい場面で実行します。実行する際は上記のように関数名（引数）とすることで実行できます。ちなみに引数は必要ないこともありますので必要に応じて使っていきましょう。 　用語について、一つずつ見ていきましょう。 　関数：処理をひとまとめにして好きな場所で使いまわせるようにしたもののこと。 　引数：関数内で使われる値のこと。 　戻り値(返り値)：関数の結果のこと。 　分かりにくいと思うので、イメージで見ていきます。例えば、関数をミキサー、引数を果物、戻り値をジュースとして考えてみましょう。関数であるミキサーに材料の果物や牛乳などを入れて（渡して）混ぜる（処理する）と、その結果ジュースが出来上がりますよね。これと同じように上記の関数に当てはめると、additional関数に引数として"2","5"を渡します。すると関数内で処理が行われます。そしてその結果、戻り値として"7"が返されるわけです。 PHPの関数には大きく分けて２種類あります。「組み込み関数」と「ユーザー定義関数」です。 組み込み関数 　PHPに元々用意されている関数のことです。様々な種類がありますのでいくつか紹介していきます。 ①var_dump 　引数には何かしらのデータが渡されます。var_dump関数を用いることで渡された引数のデータ型や値を調べて、戻り値として調べた結果の値を返します。想定したデータ型で処理できているか、値は間違っていないかなどデバッグによく使いますのでぜひ覚えておきましょう。 ②strlen 　引数に与えられた値のバイト数を返します。 ③empty 　与えられた値の内容が空であるかどうかを返します。空文字や０、null、falseなどの際にtrueが返されます。 その他にも多数の関数が用意されています。公式ドキュメントなどで調べてみると良いでしょう。 ユーザー定義関数 　ユーザー定義関数とは、自分で定義した関数のことです。アプリケーション内で使いたい処理の内容を関数にまとめ、好きな時に使うことが出来ます。先程のadditional関数もユーザー定義関数です。 　 　ユーザー定義関数には様々な利点があります。 ・同じ処理を何度も書かなくて済む。 ・プログラムが読みやすくなる。 ・変更があった際に関数の中身だけ修正すれば良い。 　一度関数を作ってしまえば、同じ処理を行う際関数を呼び出すだけで良くなります。そうするとコードの量が少なくなり可読性が上がり、変更があった際は関数を修正するだけで、使用している全ての処理に修正が反映されます。何か処理を行う際は全部関数化してしまっても良いですね。 まとめ 　このような関数はコードの品質を上げる上で非常に重要な要素になってきます。ぜひ使いこなせるようにしっかり学習していきましょう！