Laravel 12 × React 19 で爆速開発！ECサイト構築用ボイラープレート「laravel-react-boilerplate」の紹介

最新のフレームワークを使用してフルスタックなWebアプリケーションを開発したいけれど、環境構築や認証周りの実装に時間がかかってしまう…そんな悩みはありませんか？

本記事では、Laravel 12 と React 19 をベースに、ECサイトの基本機能を網羅した学習用サンプルアプリケーション「**laravel-react-boilerplate**」をご紹介します。Dockerを利用したクリーンな開発環境と、実戦的な機能をすぐに試せる構成になっています。

🌙 laravel-react-boilerplate とは？

このプロジェクトは、最新の技術スタックを用いて ECサイトの標準的な機能（商品管理、カート、決済、画像管理、マルチ認証など） を実装したボイラープレートです。

単なる「Hello World」レベルのサンプルではなく、**Stripeによる決済**や**Minio（S3互換）による画像ストレージ**、**Googleソーシャルログイン**など、実務で即戦力となる実装例が豊富に含まれています。

主な特徴と対象ユーザー

* **最新スタック**: Laravel 12 / React 19 / TypeScript / Tailwind CSS を採用。
* **インフラ完結**: Docker Compose で Apache, MySQL, Adminer, Mailpit, Minio が一発で立ち上がります。
* **実戦的機能**: マルチログイン認証（フロント/管理画面）や、Stripe決済、S3互換ストレージの実装例を網羅。
* **品質管理**: PHPUnit によるテストコードや、Storybook によるコンポーネント管理も含まれています。

整理されたディレクトリ構造

大規模開発にも耐えられるよう、Domain層やService層を意識したディレクトリ構成になっています。

.
├── app                 # Laravel アプリケーション (Domain層/Service層を分離)
├── docker              # Docker設定ファイル (MySQL, Minio等)
├── documents           # 設計書・規約ドキュメント
├── resources
│   └── assets
│       ├── admin       # 管理画面用 (AdminLTE 3)
│       └── front       # フロント画面 (React 19)
├── tests               # PHPUnit / Featureテスト
└── Makefile            # プロジェクト操作用コマンド集

3ステップで完了する環境構築

Makefileが用意されているため、複雑なコマンドを覚える必要はありません。

• リポジトリをクローン: GitHubからソースを取得します。
• 初期化コマンドの実行: make init で環境構築を開始します。
• コンテナの起動: make up で各サーバーを立ち上げます。

# 初期化処理（初回のみ）
$ make init

# Dockerを起動して各サーバーを構築
$ make up

# Webサーバー(appコンテナ)にログインしてテスト実行
$ make app
> ./vendor/bin/phpunit

※ Windows環境の方は、WSL2上での動作を推奨します。

便利な外部ツール群

開発をサポートするツールも、Docker起動後にすぐ利用可能です。

* **Mailpit**: 送信メールのキャッチ（`http://localhost:8025/`）
* **Minio**: S3互換ストレージ管理（`http://localhost:9001`）
* **Adminer**: データベースGUI管理（`http://localhost:8888/`）
* **Storybook**: UIコンポーネントカタログ（`http://localhost:6006/`）

まとめ

「laravel-react-boilerplate」は、最新のLaravelとReactを学びたい方にとって、最高のスタート地点となるはずです。

• 最新の Laravel 12 & React 19 構成を体験できる
• Dockerによるクリーンで再現性の高い開発環境
• ECサイトに必要な実戦的機能の実装例が満載
• Makefileによる直感的な操作が可能

まずはGitHubリポジトリをチェックして、make init から始めてみましょう！

[GitHub: isystk/laravel-react-boilerplate](https://github.com/isystk/laravel-react-boilerplate)

作成したアプリケーション

フロント画面

https://laraec.isystk.com/

フロント画面の主な機能

• ログイン/ログアウト
• 会員登録
• パスワードリマインダ
• 商品一覧
• カートに追加
• 決算処理（Stripe）
• お気に入り追加
• お問い合わせ
• ソーシャルログイン（Google）

管理画面

https://laraec.isystk.com/admin/

管理画面の主な機能

• ログイン/ログアウト
• 商品管理
• 注文履歴
• 顧客管理
• お問い合わせ管理
• 画像管理
• CSVダウンロード
• PDFダウンロード
• 画像アップロード

ソースコード

https://github.com/isystk/laravel-react-boilerplate