Laravel12でのAdminLTE統合：認証機能のスムーズ実装方法
はじめに
Laravel12からBreezeが実質非推奨となったようです。
使えないことはないのですが、今後のアップデートの予定はないようなので、 前回の記事でAdminLTEでログイン画面を作ったので認証機能も作成してみようと思います。
👉前提条件
1. Laravel12とAdminLTEをインストール
AdminLTEのインストールは以下でも説明してます。
Laravel12インストール
composer create-project laravel/laravel:^12 laravel-auth
AdminLTEインストール
cd laravel-auth composer require jeroennoten/laravel-adminlte php artisan adminlte:install php artisan adminlte:install --only=auth_views
2. Sqliteの表示
今回はSqliteを使用して作業を行います。
sqliteファイルはバイナリファイルなので、 「SQLite」というアドオンをイントールしておきましょう。
3. ユーザを作ろう
Laravel12をインストールするとデフォルトで Usersテーブル にデータを登録してくれるSeederが作られています。
以下のコマンドでデータを登録してみましょう。
php artisan db:seed
データの内容は /database/seeders/DatabaseSeeder.php に記載されています。
パスワードについては /database/factories/UserFactory.php をみていただくとデフォルトで password となっていることがわかります。
4. LoginControllerを作ろう
以下のコマンドでコントローラーを作ってみましょう。
php artisan make:controller LoginController
以下の内容のControllerが /app/Http/Controllers/LoginController.php に作成れます。
<?php namespace App\Http\Controllers; use Illuminate\Http\Request; class LoginController extends Controller { // }
以下のように変更してみましょう。
<?php namespace App\Http\Controllers; use Illuminate\Http\RedirectResponse; use Illuminate\Http\Request; use Illuminate\Support\Facades\Auth; class LoginController extends Controller { public function authenticate(Request $request): RedirectResponse { $credentials = $request->validate([ 'email' => ['required', 'email'], 'password' => ['required'], ]); if (Auth::attempt($credentials)) { $request->session()->regenerate(); return redirect()->intended('/'); } return back()->withErrors([ 'email' => 'The provided credentials do not match our records.', ])->onlyInput('email'); } }
5. 認証を試してみる
routes/web.php に以下を追加してください。
Route::get('/login', function() {
return view('auth.login');
});
Route::post('/login', [LoginController::class, 'authenticate'])->name('login');
それでは以下のコマンドでサーバを起動しましょう。
php artisan serve
http://localhost:8000/loginにアクセスしてみましょう。
以下の画面が表示されるので先ほど登録したユーザの情報を入力して Sgin in ボタンを押してみましょう。
そうするとLarvelのデフォルトの画面に遷移します。
認証についてはこちらで成功となります。
7. ルーティングで制限
ログインできている場合のみアクセスさせたい場合は以下のようにroutes/web.phpを変更してみてください。
Route::middleware(['auth', 'auth.session'])->group(function () {
Route::get('/', function () {
return view('welcome');
});
});
ログインができていない場合は http://localhost:8000/login にリダイレクトされるのがわかります。
ログアウトなどをも行いたいですが今回はここまでとします。
8. おすすめ教材📘
|
|
✅ まとめ
- Laravel 12 では Breeze の更新が停止しており、今後は代替手段の検討が必要かもしれません。（Breeze自体はまだ使用できます）
- AdminLTE パッケージを活用することで、ログイン画面などの認証機能を手軽に構築できます。
- SQLite を使用すれば、ブラウザ上で手軽に DB 操作・確認が可能です（VSCode拡張なども便利）。
- Laravel 12 にはデフォルトで Seeder が用意されており、テストユーザーもすぐ作成できます。
- 認証のロジックは LoginController に記述し、Auth::attempt() を使ってログイン処理を簡潔に実装できます。
- 認証後のリダイレクトや保護されたルート設定も auth ミドルウェアで簡単に管理可能です。
関連記事
- 【Laravel 12対応】AdminLTEを導入する手順
- Laravel Homesteadでの認証機能導入: Breezeパッケージの活用
- 【2025年版】Laravelにおすすめのサーバー4選【VPS＆共用タイプ】
【Laravel 12対応】AdminLTEを導入する手順
はじめに
Laravelで管理画面を作りたい人向けに、無料で高機能なUIテンプレート「AdminLTE」を導入する方法を解説します。
この記事では、Laravel 12 に AdminLTE のCSSとJSを組み込む方法を、なるべくシンプルに紹介します。
1. AdminLTEとは？
AdminLTE は Bootstrapベースの管理画面テンプレートで、以下の特徴があります：
- ダッシュボードやテーブル、チャートなどが豊富
- 無料・商用利用OK（MITライセンス）
- Bootstrap 4 または 5 に対応（AdminLTE v3 / v4）
2. AdminLTEのインストール
※Laravelプロジェクトは既に作成されているものとします。
AdminLTEをLaravelに統合するのに手っ取り早いのは jeroennoten/laravel-adminlte のパッケージをインストールすることです。
composerを利用してインストールしてみましょう。
composer require jeroennoten/laravel-adminlte
インストールが終わったらアセットをプロジェクトに展開します。
php artisan adminlte:install
/config/adminlte.php や /public/vendor 配下にAdminLTEを利用するにあたって必要なCSSやJavaScriptが展開されています。
3. AdminLTEをLaravelに設定
/resources/views に adminlte.blade.php を以下で作ってみましょう。
こちらの内容は 👉公式のwiki にも載ってます。
@extends('adminlte::page')
@section('title', 'Dashboard')
@section('content_header')
<h1>Dashboard</h1>
@stop
@section('content')
<p>Welcome to this beautiful admin panel.</p>
@stop
@section('css')
{{-- Add here extra stylesheets --}}
{{-- <link rel="stylesheet" href="/css/admin_custom.css"> --}}
@stop
@section('js')
<script> console.log("Hi, I'm using the Laravel-AdminLTE package!"); </script>
@stop
作成できたら /routes/web.php に以下を追加します。
Route::get('/adminlte', function() {
return view('adminlte');
});
追加できたら以下でサーバを起動して http://localhost:8000/adminlte にアクセスしてみましょう。 そうすると以下のような画面が表示されると思います。
簡単にAdminLTEを導入できましたね。
4. ログイン画面を作ってみる
管理画面なのでログイン画面も作ってみたいですよね。 以下のコマンドを実行してみましょう。
php artisan adminlte:install --only=auth_views
そうすると /resources/views/auth に色々とファイルが作成されます。
そうしたら /routes/web.php に以下を追加してみましょう。
Route::get('/login', function() {
return view('auth.login');
});
サーバを起動した状態で http://localhost:8000/login にアクセスすると以下のような画面が表示されます。
こちらは /vendor/jeroennoten/laravel-adminlte/resources/views/auth/login.blade.php を使用しているので、
カスタマイズしたい場合はこちらのファイルをコピーして触ってみましょう。
5. おすすめ教材📘
|
|
6. まとめ
- Viteやnpmを使わず、すぐにUIを確認できる
- ロゴなどを触りたい場合は
/config/adminlte.phpに設定を変更すれば簡単
関連記事
- 【2025年版】Laravelにおすすめのサーバー4選【VPS＆共用タイプ】
- ブラウザテストを簡単に実行する方法: Laravel Duskの活用
- Laravel入門: ルーティングの基本を徹底解説
- LaravelのMVCアーキテクチャの基礎
ブラウザテストを簡単に実行する方法: Laravel Duskの活用
Laravel Duskは、Laravelアプリケーションのブラウザテストを簡単に実行できる公式パッケージです。実際のブラウザを使用してエンドツーエンドテストを行うことで、ユーザーの操作を忠実に再現したテストが可能になります。
1. Laravel Duskとは
Laravel DuskはChromeDriverを使用してHeadlessブラウザでのテストを実行するツールです。JavaScriptが動作する環境でのテストも可能で、SPAやAjaxを多用するアプリケーションのテストに最適です。
2. インストール
Composerを使用してDuskをインストールします：
composer require --dev laravel/dusk
php artisan dusk:install
3. 基本的な使用方法
テストの作成
php artisan dusk:make LoginTest
テストの記述例
<?php namespace Tests\Browser; use Illuminate\Foundation\Testing\DatabaseMigrations; use Laravel\Dusk\Browser; use Tests\DuskTestCase; class LoginTest extends DuskTestCase { public function testBasicLogin() { $this->browse(function (Browser $browser) { $browser->visit('/login') ->type('email', 'user@example.com') ->type('password', 'password') ->press('Login') ->assertPathIs('/dashboard') ->assertSee('Welcome'); }); } }
4. 主要な機能
要素の操作
// 入力フィールドへの入力 $browser->type('name', 'John Doe'); // ボタンのクリック $browser->click('#submit-button'); // セレクトボックスの選択 $browser->select('country', 'Japan'); // チェックボックスの操作 $browser->check('terms'); $browser->uncheck('newsletter');
アサーション
// テキストの存在確認 $browser->assertSee('Hello World'); // URLの確認 $browser->assertPathIs('/dashboard'); // 要素の存在確認 $browser->assertPresent('#success-message'); // フォームフィールドの値確認 $browser->assertInputValue('email', 'user@example.com');
待機処理
// 要素が表示されるまで待機 $browser->waitFor('#loading-complete'); // テキストが表示されるまで待機 $browser->waitForText('Data loaded'); // JavaScriptの実行完了まで待機 $browser->waitUntil('typeof window.app !== "undefined"');
5. 実践的なテスト例
フォーム送信テスト
public function testContactFormSubmission()
{
$this->browse(function (Browser $browser) {
$browser->visit('/contact')
->type('name', 'Test User')
->type('email', 'test@example.com')
->type('message', 'This is a test message')
->press('Send Message')
->waitForText('Thank you for your message')
->assertSee('Thank you for your message');
});
}
ファイルアップロードテスト
public function testFileUpload()
{
$this->browse(function (Browser $browser) {
$browser->visit('/upload')
->attach('document', storage_path('test-files/sample.pdf'))
->press('Upload')
->waitFor('.upload-success')
->assertSee('File uploaded successfully');
});
}
6. 設定とカスタマイズ
環境設定
.env.dusk.localファイルでテスト環境を設定：
APP_URL=http://localhost:8000 DB_CONNECTION=sqlite DB_DATABASE=:memory:
ブラウザオプションのカスタマイズ
// tests/DuskTestCase.php
protected function driver()
{
$options = (new ChromeOptions)->addArguments([
'--disable-gpu',
'--headless',
'--window-size=1920,1080',
]);
return RemoteWebDriver::create(
'http://localhost:9515', DesiredCapabilities::chrome()->setCapability(
ChromeOptions::CAPABILITY, $options
)
);
}
ベストプラクティス
1. Page Objectパターンの使用
// tests/Browser/Pages/LoginPage.php
class LoginPage extends Page
{
public function url()
{
return '/login';
}
public function elements()
{
return [
'@email' => 'input[name="email"]',
'@password' => 'input[name="password"]',
'@submit' => 'button[type="submit"]',
];
}
public function login($email, $password)
{
return $this->type('@email', $email)
->type('@password', $password)
->click('@submit');
}
}
2. データベースの初期化
use Illuminate\Foundation\Testing\DatabaseMigrations;
class UserTest extends DuskTestCase
{
use DatabaseMigrations;
public function setUp(): void
{
parent::setUp();
// テストデータの準備
User::factory()->create([
'email' => 'test@example.com',
'password' => bcrypt('password'),
]);
}
}
3. スクリーンショットの活用
public function testFailureWithScreenshot()
{
$this->browse(function (Browser $browser) {
$browser->visit('/complex-page')
->screenshot('before-interaction')
->click('#complex-button')
->screenshot('after-interaction')
->assertSee('Expected Result');
});
}
7. トラブルシューティング
よくある問題と解決方法
- ChromeDriverのバージョン不一致
php artisan dusk:chrome-driver --detect
- タイムアウトエラー
// 待機時間を延長
$browser->waitFor('#slow-element', 30);
- 要素が見つからない
// より具体的なセレクターを使用 $browser->assertPresent('div.container > .specific-class');
8. まとめ
Laravel Duskを使用することで、ブラウザベースの包括的なテストを効率的に実装できます。JavaScriptが動作する実際のブラウザ環境でのテストにより、ユーザー体験に近い形でのテストが可能になり、アプリケーションの品質向上に大きく貢献します。
継続的インテグレーション（CI）環境での実行も容易で、開発チーム全体でのテスト自動化を推進する強力なツールといえるでしょう。
9. おすすめ教材📘
 | Laravelの教科書 バージョン10対応 [ 加藤 じゅんこ ] 価格:3300円 |
初心者向け：LaravelでのCRUD操作の基礎
はじめに
Laravelで「データの登録・表示・編集・削除」を実装する方法を知りたいですか？
この記事では、Laravel初心者が最初に覚えるべき「CRUD操作」の基本を、実例付きでわかりやすく解説します。
1. CRUDとは？
CRUDとは、アプリ開発でよく使われる以下の4つの操作の頭文字です。
| 処理名 | 英語 | Laravelでの役割 |
|---|---|---|
| 作成 | Create | 登録画面 → データ保存 |
| 読み取り | Read | 一覧表示、詳細表示 |
| 更新 | Update | 編集画面 → 上書き保存 |
| 削除 | Delete | データの削除処理 |
2. 準備：マイグレーションとモデルの作成
ここでは「記事（Post）」というシンプルなデータを扱います。
php artisan make:model Post -m
生成された database/migrations/xxxx_create_posts_table.php を以下のように編集：
public function up()
{
Schema::create('posts', function (Blueprint $table) {
$table->id();
$table->string('title');
$table->text('body');
$table->timestamps();
});
}
その後、マイグレーションを実行します。
php artisan migrate
3. ルーティングを定義する
routes/web.php に以下を追加：
use App\Http\Controllers\PostController;
Route::resource('posts', PostController::class);
これだけで、CRUDに必要な7つのルートが自動生成されます！
4. コントローラーを作成
以下のコマンドで、リソースコントローラーを作成します。
php artisan make:controller PostController --resource
これにより、CRUDに必要な7つのアクション（index, create, store, show, edit, update, destroy）が含まれる PostController.php が生成されます。
それぞれの役割と実装例は以下の通りです。
今回はCRUDなので必要なメソッド以外は割愛させていただきます。
🔹 create（新規登録処理）
public function store(Request $request)
{
$validated = $request->validate([
'title' => 'required|max:255',
'body' => 'required',
]);
Post::create($validated);
return redirect()->route('posts.index')->with('success', '投稿が完了しました');
}
🔹 read（一覧表示）
public function index()
{
$posts = Post::all();
return view('posts.index', compact('posts'));
}
🔹 update（更新処理）
public function update(Request $request, Post $post)
{
$validated = $request->validate([
'title' => 'required|max:255',
'body' => 'required',
]);
$post->update($validated);
return redirect()->route('posts.index')->with('success', '投稿を更新しました');
}
🔹 destroy（削除処理）
public function destroy(Post $post)
{
$post->delete();
return redirect()->route('posts.index')->with('success', '投稿を削除しました');
}
一つのコマンドで７つのよく使うメソッドが作成されるので便利です。
5. ビューを作成（Bladeテンプレート）
例：resources/views/posts/index.blade.php
<h1>記事一覧</h1> @foreach($posts as $post) <div> <h2>{{ $post->title }}</h2> <p>{{ $post->body }}</p> </div> @endforeach
bladeについては今回割愛させていただきます。
6. 他のアクション（create, store, edit, update, destroy）も実装！
ここでは割愛しますが、以下の流れで進めてください：
| メソッド | 目的 | 必要なビュー |
|---|---|---|
| index | 一覧フォーム表示 | index.blade.php |
| create | 登録フォーム表示 | create.blade.php |
| store | フォーム送信処理 | - |
| edit | 編集フォーム表示 | edit.blade.php |
| show | 詳細情報フォーム | show.blade.php |
| update | 更新処理 | - |
| destroy | 削除処理 | - |
7. Laravel CRUDの学習におすすめ教材📚
📘 Laravel6と古いですが入門書としてはおすすめです
 | PHPフレームワーク Laravel入門 第2版【電子書籍】[ 掌田津耶乃 ] 価格:2970円 |
📘 Laravel10対応
| Laravelの教科書 バージョン10対応 [ 加藤 じゅんこ ] 価格:3300円 |
まとめ
- CRUDはLaravel開発の基本中の基本！
- resource() ルートと PostController を使えば、最短で実装が可能
- Viewファイル（Blade）でデータを表示する流れを理解しよう！
関連記事
👉 読者登録・ブックマークして今後の更新もぜひチェック！
LaravelのMVCアーキテクチャの基礎
はじめに
Laravelを学ぶうえで必ず出てくる「MVC」という言葉。
でも、
「MVCって結局なに？」
「ControllerとModelって何が違うの？」
と感じたことはありませんか？
この記事では、LaravelのMVCについて、図解と実例を交えてやさしく解説します。
これを理解すれば、Laravelの設計やコードがグッと読みやすくなります！
1. MVCとは？
MVCは、アプリケーションを3つの役割に分けるアーキテクチャです。
| 略称 | 担当する役割 |
|---|---|
| M（Model） | データの操作・DBとのやりとり |
| V（View） | ユーザーに見える画面（HTML） |
| C（Controller） | 処理の流れをまとめる仲介役 |
▼ ざっくりイメージ図
[ユーザー操作]
↓
[Controller] → [Model] → DB
↓
[View]
2. LaravelにおけるMVCの具体
🔹 Controller（例：UserController）
class UserController extends Controller
{
public function index()
{
$users = User::all(); // Modelを使ってDBから取得
return view('users.index', compact('users')); // Viewに渡す
}
}
🔹 Model（例：Userモデル）
class User extends Model
{
protected $fillable = ['name', 'email'];
}
→ users テーブルと自動的に連携（LaravelのEloquentの力）
🔹 View（例：resources/views/users/index.blade.php）
@foreach($users as $user) <p>{{ $user->name }}</p> @endforeach
→ Bladeテンプレートでデータを表示！
3. MVCの役割を分けるメリット
MVCパターンを使うと、コードの見通しや保守性が大きく向上します。
✅ 主なメリット
見通しが良くなる
役割ごとにファイルが分かれるため、処理の流れを把握しやすくなります。再利用しやすい
ModelやViewを複数の機能で使い回すことができ、開発効率が上がります。チーム開発に強い
フロントエンド担当とバックエンド担当で役割を分けやすく、共同作業に向いています。
4. 初心者が混乱しやすいポイント
❓ ControllerでDB操作してもいいの？
→ 技術的には可能ですが、処理をModel側に分けておく方が見通しがよくなり、保守もしやすくなります。
❓ Viewにロジックを書いてもいいの？
→ Bladeテンプレート内での @if や @foreach などの軽いロジックはOKですが、複雑な処理やDBアクセスはNGです。できるだけControllerやModelで処理してからViewに渡しましょう。
5. Laravel MVCの学習におすすめ教材📘
MVCの流れや実装を体系的に理解したいなら、以下の教材がおすすめです。
📘 Laravelの教科書（バージョン10対応）
| Laravelの教科書 バージョン10対応 [ 加藤 じゅんこ ] 価格:3300円 |
📘 PHPの基礎ならこちら
 | 価格:3740円 |
まとめ
- MVCとは「Model」「View」「Controller」の役割を分ける設計パターン
- Laravelではこの考え方が自然に組み込まれている
- コントローラーは処理の仲介、モデルはデータ操作、ビューは画面表示を担当！
✅ MVCの理解はLaravel以外にもweb系のアプリケーションのプログラミングを使いこなす第一歩です。
関連記事
🛠 Laravelのルーティング超入門【web.php/API/パラメータ】
→ Controllerと連携するルート定義の基本を解説！🔐 Laravel Breezeでログイン機能を最速実装する方法（Homestead対応）
→ 実際にMVC構成で使われる認証テンプレートを導入！⚙️ 【初心者向け】Laravelの初期設定マニュアル！開発を始める前にやるべき6つのステップ）
→ MVCを動かすための準備に役立つ基本手順を紹介！💻 【超初心者向け】PHPのローカル環境構築マニュアル（無料で今日から始める方法）
→ Laravelを始める方はこちらから！
👉 読者登録・ブックマークもお待ちしています！
Laravel入門: ルーティングの基本を徹底解説
はじめに
Laravelを使い始めたけど「ルーティングって何？」という方へ。
この記事では、Laravelにおけるルーティングの基本を、初心者でもわかるように丁寧に解説します。
web.phpの基本から、API開発で使うルートの書き方、パラメータの受け取り方まで網羅！
※まずはPHPを勉強したい方はこちらの本がおすすめです。
1. ルーティングとは？
ルーティングとは、「どのURLでどの処理を行うか」をLaravelに教える設定のことです。
// 例：アクセスされたら「Hello Laravel!」を返す
Route::get('/', function () {
return 'Hello Laravel!';
});
2. ルートの定義ファイル：web.php と api.php の違い
Laravelには主に2つのルート定義ファイルがあります。
| ファイル名 | 用途 | URLのprefix |
|---|---|---|
routes/web.php |
Web画面・フォーム処理など | そのまま（例：/） |
routes/api.php |
API向けのエンドポイント | 自動で/api/が付く（例：/api/users） |
注意：
APIルートはwebミドルウェアが付かないため、セッションやCSRF保護が無効です。
3. 代表的なルーティングの書き方
🔹 GET（取得）
Route::get('/hello', function () {
return 'Hello GET';
});
🔹 POST（送信）
Route::post('/submit', function () {
return 'Form submitted!';
});
🔹 パラメータ付き
Route::get('/user/{id}', function ($id) {
return "User ID: $id";
});
🔹 オプションパラメータ
Route::get('/user/{name?}', function ($name = 'ゲスト') {
return "こんにちは、$name さん";
});
4. 名前付きルート（name()）
Route::get('/dashboard', function () {
return view('dashboard');
})->name('dashboard');
ビューやリダイレクトで route('dashboard') として使用可能になります。
5. コントローラーに分離する書き方
ルートに直接処理を書くのではなく、コントローラーを使うのが一般的です。
Route::get('/users', [UserController::class, 'index']);
名前空間が設定されていれば、自動で app/Http/Controllers/ 以下を探します。
6. Laravel初心者におすすめの教材📚
ルーティングやMVCを深く理解するには、書籍や動画教材も活用しましょう！
|
|
関連記事
Laravel Homesteadでの認証機能導入: Breezeパッケージの活用
はじめに
Laravelを学び始めたけど、ログイン機能ってどう作るの？と思ったことはありませんか？
この記事では、Laravel Homestead（仮想環境）を使っている方向けに、公式パッケージ「Breeze」を使って最短でログイン機能を導入する手順を紹介します。
対象読者
- Laravel + Homestead 環境がセットアップ済み
- 認証機能をすぐ試してみたい
- Breezeの導入方法を知りたい
1. Laravel Homesteadとは？
Laravel Homesteadは、Laravel用に最適化された仮想マシン（Vagrantベース）です。
以下のメリットがあります：
2. Breezeとは？
Laravel Breezeは、ログイン・登録・パスワードリセットなどを最小構成で提供する公式の認証テンプレートです。
- Blade + Tailwind CSSベースでシンプル
- 学習コストが低くカスタマイズしやすい
- Laravel 8以降で利用可能
3. Breezeの導入手順（Homestead環境）
以下の手順をHomesteadのSSH内で実行してください。
# Laravelプロジェクトへ移動 cd ~/code/your-laravel-app # Breezeインストール composer require laravel/breeze --dev # Breezeのセットアップ php artisan breeze:install # npmパッケージのインストールとビルド npm install && npm run dev # マイグレーション実行 php artisan migrate
4. 確認する
Homestead.yaml で設定したドメイン（例：http://laravel.test）にブラウザでアクセスします。
それぞれアクセスしてログイン・登録画面が表示されれば成功です！
5. BreezeのUI切り替え（任意）
以下のようにReact/Vue/API版も選べます。
php artisan breeze:install vue php artisan breeze:install react php artisan breeze:install api
6. よくあるエラー対策（Homestead編）
| トラブル | 対応 |
|---|---|
| Laravelの画面が真っ白 | php artisan migrate 忘れがちです |
npm コマンドが動かない |
npmはホストPC側で実行する（Homestead内ではなく） |
.envにAPP_URLが間違っている |
http://laravel.testなどに修正 |
7. おすすめ書籍＆動画教材
📗 Laravelの教科書 バージョン10対応
| Laravelの教科書 バージョン10対応 [ 加藤 じゅんこ ] 価格:3300円 |
まとめ
- Homesteadでも簡単にLaravel Breezeを導入できる
- ログイン・登録・パスワードリセットが自動で生成される
- 開発を始める上でのスタート地点としておすすめ！
関連記事
👉 ブックマーク・読者登録もぜひお願いします！
