MochiuWiki : SUSE, EC, PCB

「Laravel - Laravelの構造」の版間の差分

📢 Webサイト閉鎖と移転のお知らせ
このWebサイトは2026年9月に閉鎖いたします。
新しい記事は移転先で追加しております。（旧サイトでは記事を追加しておりません）

← 古い編集
ビジュアルウィキテキスト
 
(同じ利用者による、間の3版が非表示)
72行目: 72行目:
*: アプリケーションがサポートする全てのイベントブロードキャストチャンネルを登録できる場所を記述する。
*: アプリケーションがサポートする全てのイベントブロードキャストチャンネルを登録できる場所を記述する。
|-
|-
| storage || アプリケーションのプログラムが保存するファイル等(例: ログファイル)を配置する。
| storage || アプリケーションのプログラムが保存するファイル等 (例: ログファイル) を配置する。<br><br>コンパイル済みBladeテンプレート、ファイルベースのセッション、ファイルキャッシュ、フレームワークが作成したその他のファイルも含まれる。<br><br>このディレクトリは、app、framework、logsディレクトリに分離されている。<br>
* appディレクトリ
*: アプリケーションが作成したファイルを保存するために使用する。
* frameworkディレクトリ
*: フレームワークが作成したファイルとキャッシュを保存するために使用する。
* logsディレクトリ
*: アプリケーションのログファイルを保存している。
|-
|-
| tests || ユニットテスト関係のファイルが存在するディレクトリである。<br>テストコード等を配置する。
| tests || ユニットテスト関係のファイルが存在するディレクトリである。<br>テストコード等を配置する。<br><br>例えば、PHPUnitユニットテストと機能テストは、最初から提供されている。<br>各テストクラスには、Testという接尾辞を付ける必要がある。<br><br>phpunitまたはphpvendor/bin/phpunitコマンドを使用してテストを実行できる。<br><br>また、テスト結果をより詳細に表示する場合は、<code>php artisan test Artisan</code>コマンドを使用してテストを実行する。
|-
|-
| vendor || フレームワーク本体のプログラムが存在するディレクトリである。<br>Composerでインストールしたライブラリが保存されている。
| vendor || フレームワーク本体のプログラムが存在するディレクトリである。<br>Composerでインストールしたライブラリが保存されている。
202行目: 208行目:
* Enums
* Enums
*: 列挙型クラス
*: 列挙型クラス
<br><br>
== resourcesディレクトリ ==
==== resources/cssディレクトリ ====
このディレクトリは、アプリケーションで使用するCSSファイルを格納する場所である。<br>
コンパイル前のソースファイルを配置する場所という位置付けである。<br>
<br>
初期状態では、app.cssファイルのみが配置されている。<br>
<br>
また、SASSやLESS等のプリプロセッサのソースファイルもここに配置できる。<br>
<br>
# ディレクトリ構造の例
resources/
└── css/
    ├── app.css
    ├── components/
    └── pages/
<br>
このディレクトリは、アプリケーションのフロントエンド開発における重要な役割を果たす。<br>
必要に応じて、サブディレクトリを作成して、コードを整理することもできる。<br>
<br>
<u>※補足</u><br>
* node_modulesのインストールが必要である。(npm install)
* ホットリロード開発が可能である。(npm run watch)
* SCSSやTypeScript等、必要な依存関係は別途インストールする必要がある。
* アセットのバージョニングやキャッシュバスティングも可能である。
<br>
==== resources/jsディレクトリ ====
このディレクトリは、アプリケーションで使用するJavaScriptファイルを格納する場所である。<br>
モジュールのインポートやコンポーネントの定義等を行う。<br>
<br>
VueやReact等のコンポーネントもこのディレクトリに配置する。<br>
また、TypeScriptを使用する場合のソースファイルもこのディレクトリに配置する。<br>
<br>
初期状態では、app.jsが配置されている。<br>
<br>
# ディレクトリ構造の例
resources/
└── js/
    ├── app.js
    ├── components/
    ├── pages/
    └── bootstrap.js
<br>
<u>※補足</u><br>
* node_modulesのインストールが必要である。(npm install)
* ホットリロード開発が可能である。(npm run watch)
* SCSSやTypeScript等、必要な依存関係は別途インストールする必要がある。
* アセットのバージョニングやキャッシュバスティングも可能である。
<br>
==== コンパイルとバンドル ====
webpack.mix.jsファイル (Laravel Mix使用時)、あるいは、vite.config.jsファイル (Laravle 9以降) は、プロジェクトのルートディレクトリに自動的に配置される。<br>
<br>
# Laravel Mix使用時 (Laravel 8以前)
# Laravel新規プロジェクト作成時に自動で生成される
# 手動で作成する場合は以下のコマンドで雛形を作成できる
npm install laravel-mix --save-dev
# その後、webpack.mix.jsを手動で作成する
# Vite使用時 (Laravel 9以降)
# Laravel新規プロジェクト作成時に自動で生成される
# 手動でViteを追加する場合は以下のコマンドを実行
composer require laravel/vite-plugin
npm install --save-dev vite laravel-vite-plugin
<br>
これらの設定ファイルは、プロジェクトのアセットビルドプロセスを制御する重要なファイルであるため、バージョン管理システムにも含めることを推奨する。<br>
<br>
<syntaxhighlight lang="js">
// webpack.mix.jsでの設定例
// Laravel Mixを使用する場合
const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
    .sass('resources/css/app.scss', 'public/css')
    .version();  // バージョニング
</syntaxhighlight>
<br>
<syntaxhighlight lang="js">
// vite.config.jsでの設定例
// Viteを使用する場合 (Laravel 9以降)
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue'; // Vue.jsを使用する場合
export default defineConfig({
    plugins: [
      laravel({
          input: [
            'resources/css/app.css',
            'resources/js/app.js',
          ],
          refresh: true,
      }),
      vue(), // Vue.jsを使用する場合
    ],
});
</syntaxhighlight>
<br>
# コンパイル
# 開発環境
npm run dev
# 本番環境
npm run prod
<br>
コンパイル後のファイルにおいて、CSSファイルは、public/cssディレクトリに出力される。<br>
JavaScriptファイルは、public/jsディレクトリに出力される。<br>
<br>
==== resources/viewsディレクトリ (Bladeテンプレートファイル) ====
Bladeテンプレートファイルは、resources/viewsディレクトリに配置されている。<br>
<br>
* メインのビューファイル
*: resources/viewsディレクトリにBladeテンプレートファイルを配置する。
*: ファイル名は、example.blade.phpのような形式とする。
*: <br>
* レイアウトファイル
*: resources/views/layoutsディレクトリに共通レイアウトを配置するのが一般的である。
*: 例: resources/views/layouts/app.blade.php
*: <br>
* パーシャル (部分) ビュー
*: resources/views/partialsディレクトリやresources/views/componentsディレクトリに配置するのが慣習的である。
*: ヘッダやフッタ等の再利用可能なコンポーネント
*: <br>
* メールテンプレート
*: resources/views/emailsディレクトリにメール用テンプレートを配置する。
<br>
また、ビューファイルの場所は、config/view.phpファイルで変更することも可能である。<br>
必要に応じて、サブディレクトリを作成して整理することもできる。<br>
<br>
===== デフォルトのwelcome.blade.phpの特徴 =====
* Laravelのウェルカムページとして機能
* Tailwind CSSを使用したスタイリング
* レスポンシブデザイン対応
* ダークモード対応
<br>
主なセクションを以下に示す。<br>
* ログイン / 登録リンク (認証系)
* Laravelロゴ
* ドキュメンテーションへのリンク
* Laracastsへのリンク
* Laravel Newsへのリンク
* エコシステムの紹介
<br>
===== 推奨設定 =====
以下に示すディレクトリは、必要に応じて作成する。<br>
初期状態ではwelcome.blade.phpのみが存在しており、アプリケーションの規模に合わせて構造化していくことが一般的である。<br>
<br>
* layoutsディレクトリを作成して、共通レイアウトを作成する。
* コンポーネントやパーシャルのためのディレクトリを作成する。
* ページ別のビューファイルを適切なディレクトリに整理する。
<br>
resources/
└── views/
    ├── components/  # 再利用可能なコンポーネント用
    ├── layouts/    # レイアウトテンプレート用
    ├── pages/      # 個別ページ用
    ├── partials/    # 部分的なビュー用
    ├── admin/      # 管理者専用の機能やビューを格納
    |                # 高度な権限が必要な操作のインターフェース
    |                # システム全体の管理や設定に関する画面
    |                # ユーザ管理、コンテンツ管理などの機能
    ├── user/        # 一般ユーザ向けの機能やビュー
    |                # プロフィール管理
    |                # 個人設定
    |                # ダッシュボード等、ユーザ固有の機能
    └── auth/        # 認証関連の全ての機能
                      # ログイン / 登録フォーム
                      # パスワードリセット
                      # メール確認
                      # 二要素認証 (必要な場合)
<br>
# admin/ディレクトリの例
resources/views/admin/
├── dashboard/          # 管理ダッシュボード関連
│  ├── index.blade.php
│  └── stats.blade.php
├── users/              # ユーザー管理関連
│  ├── index.blade.php
│  ├── create.blade.php
│  ├── edit.blade.php
│  └── show.blade.php
├── settings/          # 管理設定関連
│  ├── general.blade.php
│  └── security.blade.php
└── layouts/            # 管理画面専用レイアウト
    └── admin.blade.php
<br>
# user/ディレクトリの例
resources/views/user/
├── profile/            # プロフィール関連
│  ├── show.blade.php
│  └── edit.blade.php
├── dashboard/          # ユーザダッシュボード
│  └── index.blade.php
├── settings/            # ユーザ設定
│  ├── account.blade.php
│  └── notifications.blade.php
└── layouts/            # ユーザ画面用レイアウト
    └── user.blade.php
<br>
# auth/ディレクトリの例 (Laravel UI や Breezeを使用した場合)
resources/views/auth/
├── login.blade.php        # ログインフォーム
├── register.blade.php    # 登録フォーム
├── verify.blade.php      # メール確認
├── passwords/            # パスワード関連
│  ├── email.blade.php      # パスワードリセットメール送信
│  ├── reset.blade.php      # パスワードリセットフォーム
│  └── confirm.blade.php    # パスワード確認
└── layouts/              # 認証用レイアウト
    └── auth.blade.php
<br>
Laravelのディレクトリ構造は、プロジェクトの要件に応じて柔軟に調整することができる。<br>
論理的で管理しやすい構造を維持することが重要である。<br>
* 一貫した命名規則
*: 複数形でリソースを表現 (users, posts)
*: 動作を表す単語で操作を表現 (create, edit, show)
* モジュール化
*: 各セクション専用のレイアウトファイル
*: 再利用可能なコンポーネントの活用
*: パーシャルビューの適切な使用
* アクセス制御
*: ミドルウェアと組み合わせて適切なアクセス制御を実装
*: 権限に基づいたビューの表示制御
<br><br>
<br><br>


「http://mochiuwiki.e2.valueserver.jp/index.php?title=Laravel_-_Laravelの構造」から取得