フロントエンドガイドライン¶

概要¶

Livewireはv3のため、v2のドキュメントと間違えないようにする

• Livewireドキュメント
  https://livewire.laravel.com/docs/quickstart

• Alpine.jsドキュメント
  https://alpinejs.dev/start-here

規約¶

• スタイリングにtailwindcssを使う

  • Laravel Breezeに既に使われているため、統一する

• 動的な操作が必要になった場合、Alpine.js、複雑な操作はLivewireを利用する

  • jQueryやDOM操作は使わないこと、Alpine.js、またはLivewireで同等のことがより簡単な記述で実現ができます
  • 技術スタックが混在するとバグを招くため、必ず守るようにしてください

• 共通のパーツはコンポーネント化する

  • resources/views/componentsにbladeコンポーネントを作成してください

• 遅延ロード等、複雑なコンポーネントはLivewireコンポーネントを作成する

  • sail artisan make:livewire HouseMakerRankingなどのようにコマンドで雛形生成できます