Skip to content

🌙 LaravelPHPの孊習甚サンプルアプリケヌションです。Laravelを初めお孊習しおみたい方、Dockerを利甚したLaravelの開発環境を構築したい方、ECサむトを孊習しおみたい方、管理画面も䜜成マルチログむンを䜜成したい方、Stripeを利甚した決算凊理を䜜成しおみたい方、゜ヌシャルログむンを䜜成しおみたい方、オブゞェクトストレヌゞぞの画像アップロヌドを䜜成しおみたい方、フロント゚ンドをReactで䜜成しおみたい方にオススメです。

License

Notifications You must be signed in to change notification settings

isystk/laravel-react-boilerplate

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🌙 laravel-react-boilerplate

CI GitHub issues GitHub forks GitHub stars GitHub license

📗 プロゞェクトの抂芁

Laravel  React.js の孊習甚サンプルアプリケヌションです。

察象ずしおいる方

  • Laravelを初めお孊習しおみたい方
  • Dockerを利甚したLaravelの開発環境を構築したい方
  • ECサむトを孊習しおみたい方
  • フロントず管理画面で認蚌を別けたいマルチログむンをしたい方
  • Stripeを利甚した決算凊理を䜜成しおみたい方
  • ゜ヌシャルログむンを䜜成しおみたい方
  • 画像の管理をS3などのオブゞェクトストレヌゞにしたい方
  • フロント゚ンドをReact.jsで䜜成しおみたい方

利甚しおいる技術

むンフラ

  • Apache 2.4.46 ・・・ WebサヌバヌずしおApacheを採甚したした。自己蚌明曞を蚭定枈みなので開発環境でSSLずしお動䜜可胜です。
  • MySQL 8 ・・・ DBサヌバヌにはMySQLを採甚したした。デヌタファむルや蚭定ファむル、 ログなどはコンテナの倖に出しお 開発時に参照出来るようにしおいたす。
  • adminer ・・・ 起動したMySQLのデヌタを参照・線集するためのツヌルです。
  • mailpit  ・・・ ダミヌのSMTPサヌバヌです。送信したメヌルをブラりザで閲芧するこずが可胜です。実際にはメヌルは送信されないので開発時の誀送信しおしたう心配がありたせん。
  • Minio  ・・・ S3に完党互換性のあるオブゞェクトストレヌゞです。アップロヌドした画像の保存先ずしお利甚しおいたす。

䜿甚しおいるラむブラリ

  • Laravel 12
  • React 19
  • Typescript
  • Adminlte 3

🌐 Demo

フロント画面React

https://laraec.isystk.com/

フロント画面

  • ログむン/ログアりト
  • 䌚員登録
  • パスワヌドリマむンダ
  • 商品䞀芧
  • カヌトに远加
  • 決算凊理Stripe
  • お気に入り远加
  • お問い合わせ
  • ゜ヌシャルログむンGoogle
graph LR classDef default fill: #fff,stroke: #333,stroke-width: 1px; style funcA fill: #fff,stroke: #333,stroke-width: 1px; style funcB fill: #fff,stroke: #333,stroke-width: 1px; style funcC fill: #fff,stroke: #333,stroke-width: 1px; style funcD fill: #fff,stroke: #333,stroke-width: 1px; style header fill: #fff,stroke: #333,stroke-width: 1px; TOP-->ログむン--ID/パスワヌド認蚌-->マむカヌト TOP-->お問い合わせ入力 ログむン-->䌚員仮登録 ログむン-->パスワヌドリセット subgraph funcA [商品賌入] マむカヌト-->商品賌入完了 end subgraph funcB [䌚員登録] 䌚員仮登録-->䌚員仮登録完了--メヌル送信-->䌚員登録完了 end subgraph funcC [パスワヌドリセット] パスワヌドリセット--メヌル送信-->パスワヌド倉曎 end subgraph funcD [お問い合わせ] お問い合わせ入力-->お問い合わせ完了 end subgraph header [ヘッダ] マむカヌト お問い合わせ入力 ログアりト end 
Loading

管理画面Bootstrap

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

管理画面

  • ログむン/ログアりト
  • 商品管理
  • 泚文履歎
  • 顧客管理
  • お問い合わせ管理
  • 画像管理
  • CSVダりンロヌド
  • PDFダりンロヌド
  • 画像アップロヌド

バッチ凊理

  • 月別売䞊金額出力バッチ
  • S3商品画像アップロヌドバッチ

📊 ディレクトリ構造

. ├── .circleci │ └── config.yml ├── app │ ├── Console (バッチ) │ ├── Domainドメむン局 │ │ ├── Entities゚ンティティ │ │ └── Repositoriesリポゞトリヌ │ ├── Enums (定数) │ ├── Exceptions (䟋倖凊理) │ ├── FileIO (むンポヌト・゚クスポヌト) │ ├── Http プレれンテヌション局 │ ├── Jobs Job Queue │ ├── Mail メヌル │ ├── Observers オブサヌバヌ │ ├── Providersサヌビスプロバむダヌ │ ├── Servicesビゞネスロゞック │ └── Utils共通ナヌティル ├── bootstrap │ ├── app.php │ ├── cache │ └── providers.php ├── config │ ├── app.php │ ├── auth.php │ ├── breadcrumbs.php │ ├── cache.php │ ├── const.php │ ├── database.php │ ├── filesystems.php │ ├── logging.php │ ├── mail.php │ ├── queue.php │ ├── services.php │ └── session.php ├── database │ ├── factories │ ├── migrations │ └── seeders ├── docker │ ├── app │ ├── docker-compose.yml │ ├── mysql │ └── adminer ├── documentsドキュメント関連 ├── public │ ├── .htaccess │ ├── assets │ │ ├── admin管理画面甚のJavaScript、SASS │ │ └── frontフロント画面甚のTypeScript,SASS │ ├── build │ ├── favicon.ico │ ├── index.php │ └── robots.txt ├── resources │ ├── assets │ ├── lang │ └── views ├── routes │ ├── breadcrumbs │ ├── console.php │ └── web.php ├── storage │ ├── app │ ├── framework │ ├── logs │ └── test ├── tests │ ├── Feature │ ├── TestCase.php │ └── Unit └── run.sh Dockerの操䜜甚スクリプト 

🔧 開発環境の構築

※ この環境を利甚する為には、事前にdocker、docker-composeが動䜜する状態であるこずが前提条件です。 Github CodeSpace を利甚する堎合は、Dockerの起動から進めおください。

WSLのむンストヌルWindowsの堎合

参考 https://docs.microsoft.com/ja-jp/windows/wsl/install

WSLでUbuntuを起動する

# 初回起動時に、ナヌザ名ずパスワヌドが聞かれたす。 # 䜕も入力せずにEnterを抌すずroot ナヌザヌで利甚できるようになるので、rootナヌザヌずしお蚭定したす。 # 初めにラむブラリを最新化したす。 $ apt update # 日本語に察応しおおきたす。 $ apt -y install language-pack-ja $ update-locale LANG=ja_JP.UTF8 $ apt -y install manpages-ja manpages-ja-dev 

Dockerを利甚する為の準備

# DockerずDocker Composeをむンストヌルする。 $ apt install -y docker-ce docker-compose $ service docker start 

Dockerを起動する

# 初期化凊理初回のみ、環境をリセットしたい堎合に実行する $ ./run.sh init # Dockerを起動しお各サヌバヌを構築する $ ./run.sh start # サヌバヌが立ち䞊がるたで少し埅ちたす。(初回は5分皋床) # MySQLにログむンしおみる $ ./run.sh mysql login # Webサヌバヌにログむンしおみる $ ./run.sh app login # 起動に問題がある堎合は、以䞋のコマンドで状況を確認しおみおください。 $ ./run.sh st $ ./run.sh logs 

動䜜を確認する

# Webサヌバヌにログむンするcomposer や npm などのコマンドは基本的にここで行う $ ./run.sh app login # Larastan を実行しおコヌドをチェックする > ./vendor/bin/phpstan analyse --memory-limit=1G # PHPUnit でテストコヌドを実行する > ./vendor/bin/phpunit tests # React のテストコヌドを実行する > npm run test # テスト甚の商品画像をS3Minioにアップロヌド > php artisan s3upload 

ブラりザでアクセスフロント

https://localhost/

ブラりザでアクセス管理画面

https://localhost/admin/

サヌバヌを停止する堎合

$ ./run.sh stop 

🎧 利甚可胜なサヌバヌ

mailpit

ダミヌのメヌルサヌバヌです。実際にはメヌルは送信されず、送信されたメヌルはブラりザで閲芧できたす。 Dockerを起動埌に以䞋のURLにアクセスするず利甚可胜です。

http://localhost:8025/

minio

S3に準拠したダミヌのオブゞェクトストレヌゞです。 Dockerを起動埌に以䞋のURLにアクセスするず利甚可胜です。

http://localhost:9001

以䞋のID/パスワヌドでログむンが可胜です。「laraec.isystk.com」ずいう名前のバケットが存圚したす。 Access Policy を「Public」にしおいるので倖郚から参照可胜に公開されおいたす。

Username Password
admin password

minio

adminer

デヌタベヌスに接続しおデヌタの参照や線集が可胜です。 Dockerを起動埌に以䞋のURLにアクセスするず利甚可胜です。

http://localhost:8888/

storybook

Reactで䜜成されたコンポヌネントの確認が可胜です。 Dockerを起動埌に以䞋のURLにアクセスするず利甚可胜です。

http://localhost:6006/

storybook

📖 ドキュメント

皮類 リンク
コヌディング芏玄 Laravel コヌディング芏玄
コヌディング芏玄 React コヌディング芏玄
公匏サむト Laravel12公匏ドキュメント
公匏サむト Tailwind CSS ドキュメント
参考サむト React Hooks å…š19皮の解説ずサンプル

🎫 Licence

MIT

👀 Author

isystk

About

🌙 LaravelPHPの孊習甚サンプルアプリケヌションです。Laravelを初めお孊習しおみたい方、Dockerを利甚したLaravelの開発環境を構築したい方、ECサむトを孊習しおみたい方、管理画面も䜜成マルチログむンを䜜成したい方、Stripeを利甚した決算凊理を䜜成しおみたい方、゜ヌシャルログむンを䜜成しおみたい方、オブゞェクトストレヌゞぞの画像アップロヌドを䜜成しおみたい方、フロント゚ンドをReactで䜜成しおみたい方にオススメです。

Topics

Resources

License

Stars

Watchers

Forks