はじめに
芝田です。
LaravelのBreezeって、主にログイン周りで使用するとめちゃくちゃ楽でいいよね！っていうパッケージだと思いますが、Breezeにはデフォルトでコンポーネントも付随しているみたいです。
そこで、そのコンポーネントを実際に使ってみたということで、感想をお伝えできればと思った次第です。
本題
Laravel Breezeをインストールすると、resources -> views -> components の中にいろいろなテンプレートファイルができます。
今回は代表してボタンが簡単に作成できる
primary-button-blade.php
を使ってみました。
（起）x-ディレクティブを使用してprimary-buttonを呼び出し
（適当に表示したいテンプレートを選んで）
<x-primary-button>
ボタン
</x-primary-button>とすると、すぐにボタンができました！
Breezeをインストールするとtailwindも一緒にインストールされるようなので、基本的なボタンの見た目も整っています。
これはいい感じ！
（承）…と思いきや、hrefもtarget=”_blank”も効かない…？
見た目が整ったのでボタンを押して見ましたが何も起きず…。
まぁ、そりゃそうですよね。
<x-primary-button>
ボタン
</x-primary-button>と設定しただけなので、hrefもtarget=”_blank”も何も書いてないので。
では、これらを下記のように設定し、改めて動作を確認してみます。
<x-primary-button href="https://google.com" target="_blank">
ボタン
</x-primary-button>…？
動かんぞ？
（転）buttonタグなの？あぁそう。お？これは公式…じゃないのか…？？
動かないなーと思ってprimary-button-blade.phpの中身を確認してみた。すると、
<button
{{ $attributes->merge(['type' => 'submit', 'class' => 'inline-flex items-center px-4 py-2 bg-gray-800 dark:bg-gray-200 border border-transparent rounded-md font-semibold text-xs text-white dark:text-gray-800 uppercase tracking-widest hover:bg-gray-700 dark:hover:bg-white focus:bg-gray-700 dark:focus:bg-white active:bg-gray-900 dark:active:bg-gray-300 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition ease-in-out duration-150']) }}>
{{ $slot }}
</button>って書いてた。
…。
buttonタグかい。そりゃ動かんわ。
えーでも普通にaタグをボタンみたいにしてリンクさせる軽い気持ちで使いたいのよ。って場合どないすんねん。
で、公式（とこのときは思っていた）になんかそれっぽいのが…！
おおお！
これは別タブ設定やhrefとかを設定して、Show codeボタンを押すとそのまま動作してくれるやつやないのかい！？
<x-primary-button element="a" button-type="primary" href="https://google.com" target="_blank">
Button
</x-primary-button>上記が生成できたので、これを埋め込めばいけるかなぁ…
だめやん。
（結）primary-buttonのテンプレートを書き換えろ！？
うーん、参考書もう少し見てみるか…。
なになに？
レイアウト変えたいときはprimary-button-blade.php をアレンジするとよい
https://www.amazon.co.jp/dp/480261408X?&linkCode=li3&tag=addisteria-22&linkId=dfea20ad33fa6e7d2ad8d0f21224fb3c&language=ja_JP&ref_=as_li_ss_il
!?
そんなことしたら変更した内容がBreezeのバージョンあげたときに上書きされて消えない？
しかもaタグのような使い方を手軽にする方法は未だにわからず…。
うーん。。。
結論
Breezeはログイン認証で使用するのがいいな！と思いました。
適材適所ですからね。
bladeテンプレートもいいところあるのでしょうけど、上記の点でだけいえばフロントはReactにしてボタンをtailwindで追加したりするほうが手軽にできるのではないかな、という印象を受けました。
※もしbladeのままでいい感じにできる方法ご存知の方いらっしゃいましたらぜひご教授ください。
補足
いま会社で購入していただいたこちらを読んでいます。
Laravelの入門書は多くありますが、バージョンがちょっと古かったりしているので、最新のバージョン10に対応した書籍がでたらすぐにリクエストさせていただきました。
書籍購入制度、助かっています！ありがとうございます！