tohokuaikiのチラシの裏

技術的ネタとか。

Laravel11で認証とかInertia.jsとかを入れて管理画面にMoonShineを導入するまで

Laravelのインストールまでは終わっているものとして。というか、dockerのbitnami/laravel:latestを使ってDocker composeでこんな感じで作ってる。

認証周り(ユーザー作成とか)

laravel.com Laravel公式のスターターキットには、Laravel BreezeLaravel JetStreamがある。Breezeがユーザー作成やセッションログインなどの最低限の機構を備え、JetStreamはチーム(グループ)単位での認証・認可を行う。今回はBreezeで。

Breezeのインストール

composer require laravel/breeze --dev

でパッケージが入るので、次にBreezeのインストールスクリプトを実行する。

./artisan breeze:install

Alpine・Vue・Reactの3つからJavaScriptフレームワークが選べる。LivewireはPHPコーディングでJavaScriptを生成するらしいがだったらJavaScript書くわーってことで、React with Inertiaを使う。

     ┌ Which Breeze stack would you like to install? ─────────┐
     │   ○ Blade with Alpine                                       │
     │   ○ Livewire (Volt Class API) with Alpine                   │
     │   ○ Livewire (Volt Functional API) with Alpine              │
     │ > ● React with Inertia                                      │
     │   ○ Vue with Inertia                                        │
     │   ○ API only                                                │
     └─────────────────────────────────────┘

追加するオプションの選択。

     ┌ Would you like any optional features?─────────────┐
     │   □ Dark mode                                             │
     │   □ Inertia SSR                                           │
     │   ■ TypeScript                                            │
     │ > ■ ESLint with Prettier                                  │
     └────────────────────────────────────┘

こんな感じ。でTypeScriptとESLint with Prettierだけ。

テスティングフレームワークはお好きな方で。

     ┌ Which testing framework do you prefer? ─────────────┐
     │   ○ Pest                                                    │
     │ > ● PHPUnit                                                 │
     └─────────────────────────────────────┘

で、インストール。インストールの過程で./argisan migrateもやってる。http://localhost:8000/register とか閲覧できるようになってる。

APIルーティングも追加

./artisan install:api

GET|HEAD api/user がルーティングに追加される。

MoonShineを導入

Laravelの管理画面MoonShine。なんでMoonLightじゃないんだろうな。 moonshine-laravel.com

基本的に公式ドキュメントを見ながらやっていく。

インストール

composer require moonshine/moonshine
./artisan moonshine:install

インストールスクリプトで、migrationが走りスーパーユーザーを作るようになる。進めていくと以下の4つのDBテーブルを作る。

moonshine_socialites
moonshine_user_roles
moonshine_users
notifications

notificationsとか他のライブラリとバッティングしないかな?心配ではある。Laravel Notificationとかあるしな。

この時点で、http://localhost:8000/admin ができていて、さきほどのインストールスクリプトで作った管理者用のログインアカウントが使える。従来のuserテーブルとは別にできているのでこれは便利ですね。

ルーティング

vendor/moonshine/moonshine/routes/moonshine.phpで定義されてるのがメッチャいっぱいある。

./artisan route:list --name=moonshine

  GET|HEAD        admin ......................................................................................................... moonshine.index › MoonShine\Http › HomeController
  GET|HEAD        admin/async/component/{pageUri}/{resourceUri?} ........................................... moonshine.async.component › MoonShine\Http › AsyncController@component
  ANY             admin/async/method/{pageUri}/{resourceUri?} .................................................... moonshine.async.method › MoonShine\Http › AsyncController@method
  POST            admin/async/reactive/{pageUri}/{resourceUri?}/{resourceItem?} .............................. moonshine.async.reactive › MoonShine\Http › AsyncController@reactive
  GET|HEAD        admin/async/table/{pageUri}/{resourceUri?} ....................................................... moonshine.async.table › MoonShine\Http › AsyncController@table
  POST            admin/attachments ................................................................................. moonshine.attachments › MoonShine\Http › AttachmentController
  POST            admin/authenticate ................................................................ moonshine.authenticate › MoonShine\Http › AuthenticateController@authenticate
  PUT             admin/column/relation/{resourceUri}/{pageUri}/{resourceItem} .......... moonshine.column.relation.update-column › MoonShine\Http › UpdateFieldController@relation
  PUT             admin/column/resource/{resourceUri}/{resourceItem} ...................... moonshine.column.resource.update-column › MoonShine\Http › UpdateFieldController@column
  GET|HEAD        admin/login ..................................................................................... moonshine.login › MoonShine\Http › AuthenticateController@login
  GET|HEAD        admin/logout .................................................................................. moonshine.logout › MoonShine\Http › AuthenticateController@logout
  GET|HEAD        admin/notifications ........................................................... moonshine.notifications.readAll › MoonShine\Http › NotificationController@readAll
  GET|HEAD        admin/notifications/{notification} .................................................. moonshine.notifications.read › MoonShine\Http › NotificationController@read
  GET|HEAD        admin/page/{pageUri} ........................................................................................... moonshine.page › MoonShine\Http › PageController
  POST            admin/profile ................................................................................ moonshine.profile.store › MoonShine\Http › ProfileController@store
  GET|HEAD        admin/relation/{pageUri}/{resourceUri?}/{resourceItem?} ........................ moonshine.relation.search › MoonShine\Http › RelationModelFieldController@search
  GET|HEAD        admin/relation/{pageUri}/{resourceUri?}/{resourceItem?}/has-many-form moonshine.relation.has-many-form › MoonShine\Http › RelationModelFieldController@hasManyFo…
  GET|HEAD        admin/relations/{pageUri}/{resourceUri?}/{resourceItem?} .... moonshine.relation.search-relations › MoonShine\Http › RelationModelFieldController@searchRelations
  DELETE          admin/resource/{resourceUri}/crud ........................................................ moonshine.crud.massDelete › MoonShine\Http › CrudController@massDelete
  POST            admin/resource/{resourceUri}/crud .................................................................. moonshine.crud.store › MoonShine\Http › CrudController@store
  PUT|PATCH       admin/resource/{resourceUri}/crud/{resourceItem} ................................................. moonshine.crud.update › MoonShine\Http › CrudController@update
  DELETE          admin/resource/{resourceUri}/crud/{resourceItem} ............................................... moonshine.crud.destroy › MoonShine\Http › CrudController@destroy
  ANY             admin/resource/{resourceUri}/handler/{handlerUri} ........................................................ moonshine.handler › MoonShine\Http › HandlerController
  GET|HEAD        admin/resource/{resourceUri}/{pageUri} ................................................................ moonshine.resource.page › MoonShine\Http › PageController
  GET|HEAD        admin/search .................................................................................. moonshine.global-search › MoonShine\Http › GlobalSearchController
  GET|HEAD        admin/socialite/{driver}/callback .................................................. moonshine.socialite.callback › MoonShine\Http › SocialiteController@callback
  GET|HEAD        admin/socialite/{driver}/redirect .................................................. moonshine.socialite.redirect › MoonShine\Http › SocialiteController@redirect
  GET|HEAD        admin/{fallbackPlaceholder} .......................................................................................................................... moonshine.

prefixの admin/cofnig/moonshine.php や.envで変更できる。

コマンド

./artisan list moonshine
Laravel Framework 11.29.0

Available commands for the "moonshine" namespace:
  moonshine:apply       Create apply for Field
  moonshine:component   Create component
  moonshine:controller  Create controller
  moonshine:field       Create field
  moonshine:handler     Create handler class
  moonshine:install     Install the moonshine package
  moonshine:page        Create page
  moonshine:policy      Create policy for Model
  moonshine:publish
  moonshine:resource    Create resource
  moonshine:type-cast   Create type cast class
  moonshine:user        Create user