この記事は 「そのままコピペで動く」 を重視しています。

事前準備とディレクトリ構成

以下のフォルダを作成します。

C:\Work\Workspace\Docker\example.com\
├─ htdocs\ ← Yii2のアプリ本体が入る（後で自動生成）
├─ docker\
│ ├─ php\
│ │ ├─ Dockerfile
│ │ └─ php.ini
│ └─ nginx\
│ └─ default.conf
└─ docker-compose.yml

docker-compose.yml の作成

ファイル: C:\Work\Workspace\Docker\example.com\docker-compose.yml

services:
  nginx:
    image: nginx:1.27-alpine
    container_name: example_nginx
    ports:
      - "8080:80" # Web → http://localhost:8080
    volumes:
      - ./htdocs:/var/www/html
      - ./docker/nginx/default.conf:/etc/nginx/conf.d/default.conf:ro
    depends_on:
      - php
    networks:
      - appnet

  php:
    build:
      context: ./docker/php
      dockerfile: Dockerfile
    container_name: example_php
    volumes:
      - ./htdocs:/var/www/html
    environment:
      PHP_MEMORY_LIMIT: 512M
      PHP_MAX_EXECUTION_TIME: 120
    networks:
      - appnet
  db:
    image: mysql:8.0
    container_name: example_db
    command: ["mysqld", "--default-authentication-plugin=mysql_native_password", "--character-set-server=utf8mb4", "--collation-server=utf8mb4_0900_ai_ci"]
    environment:
      MYSQL_ROOT_PASSWORD: root
      MYSQL_DATABASE: example
      MYSQL_USER: app
      MYSQL_PASSWORD: apppass
      TZ: Asia/Tokyo
    ports:
      - "3307:3306" # ローカルMySQLと衝突回避したい場合は3307→3306
    volumes:
      - dbdata:/var/lib/mysql
    networks:
      - appnet

  phpmyadmin:
    image: phpmyadmin:5-apache
    container_name: example_pma
    environment:
      PMA_HOST: db
      PMA_USER: root
      PMA_PASSWORD: root
    ports:
      - "8081:80" # phpMyAdmin → http://localhost:8081
    depends_on:
      - db
    networks:
      - appnet

  mailpit:
    image: axllent/mailpit:latest
    container_name: example_mailpit
    ports:
      - "1025:1025" # SMTP (アプリからの送信先)
      - "8025:8025" # Web UI → http://localhost:8025
    networks:
      - appnet

volumes:
  dbdata:

networks:
  appnet:
    driver: bridge

PHP（php-fpm）用 Dockerfile と設定

ファイル: C:\Work\Workspace\Docker\example.com\docker\php\Dockerfile

FROM php:8.3-fpm-alpine

# 必要拡張の導入
RUN apk add --no-cache \
    git zip unzip icu-dev oniguruma-dev libpng-dev libjpeg-turbo-dev libwebp-dev libzip-dev autoconf build-base \
 && docker-php-ext-configure gd --with-jpeg --with-webp \
 && docker-php-ext-install -j$(nproc) pdo_mysql intl mbstring gd zip exif bcmath opcache

# Composer
COPY --from=composer:2 /usr/bin/composer /usr/bin/composer

WORKDIR /var/www/html

Nginx の設定

ファイル: C:\Work\Workspace\Docker\example.com\docker\nginx\default.conf

server {
  listen 80;
  server_name example.com localhost;

  root /var/www/html/web;
  index index.php index.html;

  location / {
    try_files $uri $uri/ /index.php?$args;
  }

  location ~ \.php$ {
    include       fastcgi_params;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    fastcgi_pass php:9000;
    fastcgi_buffers 16 16k;
    fastcgi_buffer_size 32k;
  }

  location ~* \.(jpg|jpeg|png|gif|ico|css|js|svg|woff2?|ttf)$ {
    expires 7d;
    add_header Cache-Control "public";
  }
}

php.ini の最低限の調整

ファイル: C:\Work\Workspace\Docker\example.com\docker\php\php.ini

memory_limit = ${PHP_MEMORY_LIMIT}
max_execution_time = ${PHP_MAX_EXECUTION_TIME}
upload_max_filesize = 32M
post_max_size = 32M
date.timezone = Asia/Tokyo

コンテナの起動と初期化

PowerShell で次を実行します。

cd C:\Work\Workspace\Docker\example.com
# 初回ビルド＆起動
docker compose up -d --build

# 状態確認
docker compose ps

• http://localhost:8080 → Nginx（Yii2はまだ未導入なので404/エラー想定）
• http://localhost:8081 → phpMyAdmin（root / root、サーバ: db でログイン可）
• http://localhost:8025 → Mailpit（受信ボックスUI）

Yii2 のインストール（コンテナ内でComposer実行）

htdocs に Yii2 Basic を展開します。

# PHPコンテナに入る
docker compose exec php sh

# コンテナ内で実行（/var/www/html）
composer create-project yiisoft/yii2-app-basic .
exit

作成後、Windows側では C:\Work\Workspace\Docker\example.com\htdocs にファイルが展開されます。Nginx の root は /web 配下なので、web/index.php が入口になります。

DB接続設定（.env と Yii2設定）

Yii2 Basic はデフォルトで .env はありませんが、設定を分けたい場合は導入も可能です。ここではシンプルに config/db.php を直接編集します。

ファイル: htdocs\config\db.php

<?php
return [
  'class' => 'yii\db\Connection',
  'dsn' => 'mysql:host=db;port=3306;dbname=example',
  'username' => 'app',
  'password' => 'apppass',
  'charset' => 'utf8mb4',
  'attributes' => [
    PDO::ATTR_EMULATE_PREPARES => false,
    PDO::ATTR_STRINGIFY_FETCHES => false,
  ],
];

host は db（docker-compose のサービス名）を指定します。ホストOSから直接接続する場合は localhost:3307 です。

初期テーブルを作る例として、マイグレーションを1本作ってみます（任意）。

# PHPコンテナに入る
docker compose exec php sh

# マイグレーション作成
php yii migrate/create create_post_table

# 生成されたファイル(例: migrations/mYYYYMMDD_HHMMSS_create_post_table.php)を編集
exit

サンプル（生成ファイルを編集）

public function safeUp()
{
  $this->createTable('{{%post}}', [
    'id' => $this->primaryKey(),
    'title' => $this->string()->notNull(),
    'body' => $this->text(),
    'created_at' => $this->dateTime()->defaultExpression('CURRENT_TIMESTAMP'),
  ]);
}


public function safeDown()
{
  $this->dropTable('{{%post}}');
}

# もう一度入って実行
docker compose exec php sh
php yii migrate --interactive=0
exit

Mailpit（メール送信テスト）設定

開発中のメールは 本当に送らない のが安全です。Mailpit に流してUIで確認しましょう。

ファイル: htdocs\config\web.php（components に mailer を追記）

'components' => [
  // ... 既存設定 ...
  'mailer' => [
    'class' => 'yii\swiftmailer\Mailer',
    'useFileTransport' => false, // falseでSMTPへ送信
    'transport' => [
      'class' => 'Swift_SmtpTransport',
      'host' => 'mailpit',
      'port' => 1025,
      'encryption' => null,
    ],
  ],
],

もし Yii2 を yiisoft/mailer に置き換える場合は適宜設定を読み替えてください（SwiftMailerは非推奨化済みですが、Yii2 Basic既定の形のままでもMailpit連携は可能です）。

テスト送信例（コントローラやコンソールから）

Yii::$app->mailer->compose()
         ->setFrom('no-reply@example.com')
         ->setTo('test@example.com')
         ->setSubject('Mailpit送信テスト')
         ->setTextBody('これはテスト本文です')
         ->send();

http://localhost:8025 を開くと、受信メールが一覧表示されます。

動作確認（Web・DB・Mail）

1. Web
   http://localhost:8080 にアクセスして Yii2 のトップが表示されること。
2. DB
   http://localhost:8081 → phpMyAdmin に root/root でログイン。example データベースに post テーブルができていること。
3. Mail
   サンプルコードを実行し、http://localhost:8025 の受信箱にメールが入ること。

トラブルシューティング

ポート競合

8080/8081/8025/1025/3307 が使用中 → docker-compose.yml の ports 左側（ホスト側）を変更。

MySQLへ接続できない

• host は db（Docker内部）か、ホスト接続では localhost:3307 を指定。
• 初回起動直後はDBの立ち上がり待ちが必要。数秒待って再試行。

Windows で権限由来の書き込みエラー

htdocs/runtime と htdocs/web/assets の書き込み権限が必要。コンテナ側で chmod -R 777 runtime web/assets（開発用途限定）。

ファイルの改行コード

Nginxやシェル用ファイルは LF を推奨。VS Codeで LF へ変換。

古いコンテナやイメージの削除でエラー

例: Error response from daemon: conflict: unable to delete ... image is being used by stopped container ...

docker ps -a # 停止中を含め一覧
docker rm <CONTAINER_ID> # 停止中コンテナを削除
docker rmi <IMAGE_ID> # 参照がなくなったらイメージ削除
# 一括停止・削除（このプロジェクト内）
docker compose down -v # コンテナ・ネットワーク・ボリューム削除
docker system prune -f # 不要なリソース掃除

Composerが遅い/タイムアウト

一時的に -vvv で状況確認。社内プロキシ下では環境変数の設定を。

よく使うコマンド集

# 起動・ビルド
cd C:\Work\Workspace\Docker\example.com
docker compose up -d --build

# 停止
docker compose down

# 停止＋ボリュームごと削除（DB初期化したいとき）
docker compose down -v

# ログ参照
docker compose logs -f nginx
docker compose logs -f php
docker compose logs -f db

# コンテナに入る
docker compose exec php sh

# 権限（開発用）
docker compose exec php sh -c "chmod -R 777 runtime web/assets"

あとがき

ここまでで、Windows + Docker 上に Yii2 + MySQL + phpMyAdmin + Mailpit の開発環境が整いました。実運用では Mailpit の代わりに本番SMTPを使いますが、開発段階では誤送信防止のため Mailpit固定 を強くおすすめします。また、MySQLのパスワードや公開ポートは本番用に必ず見直してください。必要に応じて SSL や Xdebug の導入、Nginxのキャッシュ/セキュリティヘッダ の調整などを行うと、より快適で安全な環境になります。

本記事では、Yii3で何が変わったのか、Yii2との違いやディレクトリ構造、実際にデータベースを使ったミニサンプルも交えて、実用的に解説します。

Guide | Yii3

Various Yii 3.0 related documentation

yii3.netlify.app

Yii2との主な違い・進化ポイント

Yii3では、近年のPHP界のトレンドであるPSR準拠を徹底しており、モダンPHPと高い互換性を持ちながら設計されています。

Yii3のディレクトリ構成

Yii3の標準的なアプリケーション構造は以下のようになります。

myapp/
├── config/          ← アプリ設定（DIやルーティングなど）
├── public/          ← Web公開ディレクトリ（index.php）
├── runtime/         ← ログやキャッシュなどの一時ファイル
├── src/             ← アプリケーションの本体コード
│   └── Controller/
│   └── Middleware/
│   └── View/
├── tests/           ← PHPUnitベースのテストコード
├── vendor/          ← Composer依存
└── composer.json

「config」や「src」にアプリロジックが集約されており、明確にMVCが分離されています。

Yii3での簡単なデータベース操作サンプル（MVC構成で作成）

このサンプルでは、次の機能を実装します。

「post テーブルの全件を取得して、一覧表示するWebページ」

ディレクトリ構成とファイル配置

まず、以下のようにディレクトリ構成を整理します。Yii3では、src/ がアプリケーションコードの中核です。

myapp/
├── config/
│   └── params.php
│   └── routes.php         ← ルーティング設定
│   └── web.php            ← DI・アプリ設定
├── src/
│   ├── Controller/
│   │   └── SiteController.php   ← コントローラ（C）
│   ├── Model/
│   │   └── Post.php             ← モデル（M）
│   ├── View/
│   │   └── site/
│   │       └── index.php        ← ビュー（V）
├── public/
│   └── index.php          ← フロントコントローラ
├── vendor/                ← Composer依存
└── composer.json

モデル（M） – src/Model/Post.php

ActiveRecordを使用して、post テーブルに対応したモデルクラスを作成します。

<?php
namespace App\Model;

use Yiisoft\ActiveRecord\ActiveRecord;

final class Post extends ActiveRecord
{
    public static function tableName(): string
    {
        return 'post';
    }
}

コントローラ（C） – src/Controller/SiteController.php

データベースからデータを取得し、ビューに渡す役割を担います。

<?php
namespace App\Controller;

use App\Model\Post;
use Yiisoft\Yii\View\ViewRenderer;
use Yiisoft\Router\CurrentRoute;

final class SiteController
{
    private ViewRenderer $view;

    public function __construct(ViewRenderer $view)
    {
        $this->view = $view->withControllerName('site');
    }

    public function index(): string
    {
        $posts = Post::find()->all(); // すべての投稿を取得
        return $this->view->render('index', ['posts' => $posts]);
    }
}

ビュー（V） – src/View/site/index.php

データをHTMLとして整形・表示するテンプレートファイルです。

<h1>記事一覧</h1>

<ul>
<?php foreach ($posts as $post): ?>
    <li>
        <strong><?= htmlspecialchars($post->title) ?></strong><br>
        <?= nl2br(htmlspecialchars($post->content)) ?>
    </li>
<?php endforeach; ?>
</ul>

ルーティング設定 – config/routes.php

リクエストURLとコントローラの対応関係を定義します。

<?php

use Yiisoft\Router\Route;
use App\Controller\SiteController;

return [
    Route::get('/')
        ->action([SiteController::class, 'index'])
];

アプリ設定 – config/web.php

必要なパッケージや設定を読み込むファイルです。ここでDB接続なども設定します。

<?php

use Yiisoft\Db\Connection\ConnectionInterface;
use Yiisoft\Db\Mysql\Connection;

return [
    ConnectionInterface::class => static function () {
        return new Connection(
            dsn: 'mysql:host=localhost;dbname=yii3_demo',
            username: 'root',
            password: 'your_password',
        );
    },
];

フロントコントローラ – public/index.php

アプリケーションのエントリーポイントです。

<?php

declare(strict_types=1);

require dirname(__DIR__) . '/vendor/autoload.php';

use Yiisoft\Yii\Web\Application;
use Yiisoft\Yii\Web\Emitter\SapiEmitter;

$container = require dirname(__DIR__) . '/config/web.php';

$app = new Application($container);

$response = $app->handle(
    $_SERVER['REQUEST_METHOD'],
    $_SERVER['REQUEST_URI']
);

(new SapiEmitter())->emit($response);

MySQL テーブル定義

CREATE TABLE post (
    id INT AUTO_INCREMENT PRIMARY KEY,
    title VARCHAR(255) NOT NULL,
    content TEXT NOT NULL
);

実行までの流れまとめ

1. MySQLで post テーブルを作成する
2. composer install で依存パッケージを取得
3. php -S localhost:8080 -t public で開発サーバを起動
4. ブラウザで http://localhost:8080 にアクセス

補足：Yii3は「自由度の高いMVC」

Yii3は、Laravelのような「レールに乗った」MVCよりも、より柔軟で明示的なアーキテクチャを採用しています。自分で組み立てる分、学習コストはやや高いかもしれませんが、カスタマイズ性と保守性に優れた構成です。

この構成に沿えば、MVCモデルの設計思想を維持しつつ、Yii3のモダンな利点を活かしたWebアプリを構築できます。
今後はフォームバリデーション、APIレスポンス、ログイン機能など、より実践的なトピックも記事化していきます。

コンポーネントの開発

ディレクトリ・ファイルの作成

アプリケーションディレクトリ内にcomponentsディレクトリを作成します。

次にそのディレクトリの中にMailFetcherComponent.phpのファイルを次の内容で作成します。

ファイルの作成

<?php

namespace app\components;
    
use Yii;
use yii\base\Component;
use yii\base\Exception;

class MailFetcherComponent extends Component
{
    // Kind ( SMTP / IMAP / POP3 ).
    public $kind;
    
    // Mail server.
    public $host;
    
    // Connect post.
    public $port;
    
    // Account user.
    public $username;
    
    // Account password.
    public $password;
    
    // Encrypt type ( PLAIN / LOGIN / CRAM-MD5 ).
    public $encryption;
    
    // Target mail folder.
    public $mailboxFolder = 'INBOX';
    
    // Seaving server directoy for attachments.
    public $attachmentPath = false;
    
    protected $inbox;
    
    public function init()
    {
        parent::init();
        
        if (!$this->host || !$this->username || !$this->password) {
            throw  new \Exception("メールサーバの情報が不足しています。");
        }
        
    }
    
    public function connectOpen($args = [])
    {
        $labels = [ 'kind', 'host', 'port', 
                    'encryption', 'mailboxFolder'];
        
        $connectSource = "{{host}:{port}/{kind}/{encryption}}{mailboxFolder}";
        
        foreach ($labels as $label){
            if (isset($args[$label])) {
                $this->$label = $args[$label];
            }
            if (in_array($label, ['username', 'password'])) continue;
            
            $val = $label == 'mailboxFolder' ? 
                    strtoupper($this->$label) : 
                    strtolower($this->$label); 
            
            $connectSource = str_replace('{'.$label.'}', $val, $connectSource);
        }

        $this->inbox = imap_open($connectSource, $this->username, $this->password);
        
        if (!$this->inbox) {
            echo "IMAP接続に失敗しました: " . imap_last_error();
            return;
        }
        
        if (!$this->attachmentPath) {
            $this->attachmentPath = Yii::getAlias('@runtime/mail_attachments');
        }
        
        if (!is_dir($this->attachmentPath)) {
            mkdir($this->attachmentPath, 0777, true);
        }
    }
    
    public function fetchMails($searchCriteria = 'ALL')
    {
        $sources = [];
        
        $emails = imap_search($this->inbox, $searchCriteria);
        
        if ($emails) 
        {
            rsort($emails); // 最新のメールが最初に表示されるようにソート

            foreach ($emails as $emailNumber) 
            {
                $overview = imap_fetch_overview($this->inbox, $emailNumber, 0);
                
                // サブジェクトのデコード
                $subject = $this->mimeDecode($overview[0]->subject);

                // 差出人のデコード
                $from = $this->mimeDecode($overview[0]->from);
                
                $structure = imap_fetchstructure($this->inbox, $emailNumber);
                $message = '';
                
                
                if ($structure->type == 1) { // マルチパートメールの場合
                    
                    $attachments = array();
                    foreach ($structure->parts as $partNumber => $part) {
                        if ($part->subtype == 'PLAIN') {
                            $message = imap_fetchbody($this->inbox, $emailNumber, $partNumber + 1);

                            if ($part->encoding == 3) { // BASE64
                                $message = base64_decode($message);
                            } elseif ($part->encoding == 4) { // QUOTED-PRINTABLE
                                $message = quoted_printable_decode($message);
                            }
                            break;
                        }
                        
                        // 添付ファイルの取得
                        if (isset($part->disposition) && strtolower($part->disposition) == 'attachment') {
                            $attachment = imap_fetchbody($this->inbox, $emailNumber, $partNumber + 1);

                            if ($part->encoding == 3) { // BASE64
                                $attachment = base64_decode($attachment);
                            } elseif ($part->encoding == 4) { // QUOTED-PRINTABLE
                                $attachment = quoted_printable_decode($attachment);
                            }

                            $filename = 'attachment_' . time() . '_' . ($part->dparameters[0]->value ?? 'unknown');
                            file_put_contents($this->attachmentPath . '/' . $filename, $attachment);
                            $attachments[] = $this->attachmentPath . '/' . $filename;
                            echo "添付ファイルを保存しました: " . $filename . "\n";
                        }
                    }
                } else { // 単一パートメールの場合
                    $message = imap_fetchbody($this->inbox, $emailNumber, 1);

                    // エンコードの処理
                    if ($structure->encoding == 3) { // BASE64
                        $message = base64_decode($message);
                    } elseif ($structure->encoding == 4) { // QUOTED-PRINTABLE
                        $message = quoted_printable_decode($message);
                    }
                }

                $sources[$emailNumber] = [
                    'Subject' => $subject,
                    'From' => $from,
                    'Date' => $overview[0]->date,
                    'Message' => $message,
                ];
            }
        }
        
        imap_close($this->inbox);
        
        return $sources;
    }
    
    private function mimeDecode($str = '')
    {
        $encode_array = isset($str) ? imap_mime_header_decode($str) : [];
        $decoded      = '';
        foreach ($encode_array as $part) {
            $decoded .= $part->text;
        }
        
        return $decoded;
    }   
}

使い方

設定

設定ファイル（config/web.php）に作成したMailFetcherコンポーネントを次のように追加します。

    'components' => [
        'mailFetcher' => [
            'class' => 'app\components\MailFetcherComponent',
            'kind' => 'IMAP',
            'host' => 'メールサーバホスト名',  // IMAPサーバーのホスト名
            'username' => 'アカウントユーザー名',
            'password' => 'パスワード',
            'port' => 'ポート',
            'encryption' => '暗号化タイプ',
            'mailboxFolder' => 'INBOX',  // デフォルトでINBOXを使用
        ],

上記の設定でコンポーネントをコントローラー上で実行できるようになります。

Yii::$app->mailFetcher;

実行例

InboxController

InboxControllerを次のように作成します。

<?php

namespace app\controllers;

use Yii;
use app\models\Account;

class InboxController extends \yii\web\Controller
{
    public function actionIndex()
    {
        $receiver= Yii::$app->mailFetcher;
        
        $receiver->connectOpen();
        
        return $this->render('index', [
            'receiver' => $receiver->fetchMails('ALL'),
        ]);
    }
}

Viewファイル

/views/inbox/index.phpを次にように編集します。

<?php
/** @var yii\web\View $this */
?>
<h1>inbox/index</h1>

<p>
    You may change the content of this page by modifying
    the file <code><?= __FILE__; ?></code>.
</p>
<h2>Receiver Result</h2>

<?php foreach($receiver as $email): ?>

<div style="padding:1em;margin-bottom:3em;border:solid 3px #999;">
    <dl>
        <dt>Date</dt>
        <dd><?php echo $email['Date'] ?></dd>
        <dt>From</dt>
        <dd><?php echo $email['From'] ?></dd>
        <dt>Subject</dt>
        <dd><?php echo $email['Subject'] ?></dd>
        <dt>Message</dt>
        <dd><?php echo nl2br($email['Message']) ?></dd>
    </dl>
</div>
<?php endforeach; ?>

ブラウザで確認

次のURLへアクセスして確認します。

http://ホスト名/index.php?r=inbox/index

メールの受信ボックス情報が確認できれば成功です。

FullCalendarとは

FullCalendarは、イベントのスケジュールやカレンダー表示を簡単に実装できる人気のJavaScriptライブラリです。レスポンシブ対応やさまざまなカスタマイズオプションを備えており、Googleカレンダーのような体験を提供できます。

Yii2プロジェクトへの導入手順

拡張機能からインポート

「yiitwofullcalendar」は、Yii2でFullCalendarを手軽に扱うための拡張です。これを使用することで、イベントの表示やカレンダーの基本的な設定が簡単に行えます。

Composerを使用して「yiitwofullcalendar」をインストールします。

php composer.phar require edofre/yii2-fullcalendar "@dev"

Composerが依存関係を解決してインストールを完了したら、すぐに利用できます。

カレンダーの表示

次に、カレンダーを表示する基本的なコードを用意します。ここでは、site/indexアクションでカレンダーを表示する例を示します。

コントローラーの設定

controllers/SiteController.phpで、イベントデータを渡す処理を記述します。

public function actionIndex()
{
    $events = [
        [
            'title' => 'イベント1',
            'start' => '2024-12-15',
        ],
        [
            'title' => 'イベント2',
            'start' => '2024-12-18',
            'end' => '2024-12-20',
        ],
    ];

    return $this->render('index', ['events' => $events]);
}

ビューの設定

views/site/index.phpに、カレンダーを表示するコードを追加します。

<?php
use yii2fullcalendar\yii2fullcalendar;

echo yii2fullcalendar::widget([
    'options' => [
        'id' => 'calendar',
    ],
    'clientOptions' => [
        'locale' => 'ja',
        'initialView' => 'dayGridMonth',
        'headerToolbar' => [
            'left' => 'prev,next today',
            'center' => 'title',
            'right' => 'dayGridMonth,timeGridWeek,timeGridDay',
        ],
    ],
    'events' => $events, // コントローラーから渡されたイベントデータ
]);
?>

上記のコードでは、eventsキーに渡したデータがカレンダーに表示されます。

カスタマイズ例

イベントのクリック処理を追加

イベントをクリックした際にアラートを表示する機能を追加する例です。

'clientEvents' => [
    'eventClick' => new \yii\web\JsExpression('function(event) {
        alert("イベントタイトル: " + event.title);
    }'),
],

Ajaxで動的にイベントを取得

イベントを動的に取得するには、eventsキーにURLを指定します。

'events' => \yii\helpers\Url::to(['/event/get-events']),

コントローラーで、指定したURLに対応するアクションを作成し、イベントデータを返します。

public function actionGetEvents()
{
    \Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
    return [
        [
            'title' => '動的イベント',
            'start' => date('Y-m-d'),
        ],
    ];
}

まとめ

「yiitwofullcalendar」を使えば、Yii2プロジェクトでFullCalendarを簡単に利用できます。デフォルト機能を活用するだけでなく、カスタマイズすることで、より実用的なカレンダーを実装可能です。

スケジュール管理やイベント一覧を手軽に追加したい方は、ぜひ試してみてください！

Foundationをインストールする

FoundationをインストールするためにComposerを利用します。

# composer require zurb/foundation

または、直接FoundationのCSS/JSファイルをダウンロードしてweb/cssやweb/jsディレクトリに配置します。

Bootstrapを無効化する

Yii2アプリケーションでは、デフォルトでBootstrapが読み込まれている可能性があります。これを無効にするには、アプリケーションの設定ファイルconfig/web.phpを編集します。

'components' => [
    'assetManager' => [
        'bundles' => [
            'yii\bootstrap\BootstrapAsset' => false,
            'yii\bootstrap\BootstrapPluginAsset' => false,
        ],
    ],
],

これにより、Bootstrapのアセットが読み込まれなくなります。

Foundationアセットを登録する

独自のアセットバンドルを作成してFoundationを登録します。

FoundationAssetを作成

以下のようなPHPファイルをfrontend/assets/FoundationAsset.php（または適切な場所）に作成します。

namespace frontend\assets;

use yii\web\AssetBundle;

class FoundationAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'css/foundation.min.css', // FoundationのCSSファイル
    ];
    public $js = [
        'js/foundation.min.js', // FoundationのJSファイル
    ];
    public $depends = [
        'yii\web\YiiAsset',
    ];
}

Foundationのファイルパスは、ダウンロード先に応じて変更してください。

AppAssetで読み込む

frontend/assets/AppAsset.phpにFoundationAssetを依存関係として追加します。

namespace frontend\assets;

use yii\web\AssetBundle;

class AppAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'css/site.css', // その他のCSS
    ];
    public $js = [
        // 必要なJSファイル
    ];
    public $depends = [
        'yii\web\YiiAsset',
        'frontend\assets\FoundationAsset', // 追加
    ];
}

FoundationのグリッドやUIコンポーネントを使用する

レイアウトファイルやビューでFoundationのクラスや構造を利用します。

<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
    <meta charset="<?= Yii::$app->charset ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?= Html::encode($this->title) ?></title>
    <?php $this->head() ?>
</head>
<body>
<?php $this->beginBody() ?>

<div class="grid-container">
    <div class="grid-x grid-padding-x">
        <div class="cell small-12 medium-8">
            <?= $content ?>
        </div>
    </div>
</div>

<?php $this->endBody() ?>
</body>
</html>

FoundationのJavaScriptを有効化

FoundationのJavaScriptコンポーネント（例えばモーダルやタブ）を利用するには、初期化スクリプトを追加します。

初期化スクリプト

views/layouts/main.phpのフッター部分に以下を追加します。

<script>
    $(document).foundation();
</script>

Foundationに基づいたスタイリングとレイアウトの調整

ビューでBootstrapのクラスを使用している箇所をFoundationのクラスに置き換えます。例えば、rowをgrid-xに、col-md-6をcell medium-6に変更します。

これで、Yii2アプリケーションでFoundationを利用する準備が整います！

Foundationを使うメリット

Foundationを使うメリットとして挙げられるのは、「よりプロフェッショナルなデザイン表現が可能で、競合と差をつけられること」です。特に、カスタマイズ性やモダンなUIコンポーネントが豊富で、デザイン性を重視したいプロジェクトに最適です。

1. カスタマイズ性の高さ
   Foundationは柔軟なグリッドシステムやモジュール構造を持ち、デザインや機能をプロジェクトのニーズに応じて簡単に調整できます。
2. レスポンシブデザインへの最適化
   Foundationはモバイルファーストのアプローチを強化しており、細かいレスポンシブ調整が可能です。
3. 現代的なUI/UXコンポーネント
   Foundationは「モダンな見た目」のコンポーネントが多く、Bootstrapよりも洗練されたデザインを提供します。
4. 差別化されたデザインが可能
   Bootstrapは多くのプロジェクトで使われているため、見た目が似てしまうことが多いですが、Foundationを使うことで独自性のあるUIが構築できます。
5. 拡張性と開発者支援
   Foundationは開発者向けツール（例えばモーションUIやアクセシビリティ機能）が充実しており、デザイナーや開発者にとって使いやすいフレームワークです。

The most advanced responsive front-end framework in the world. | Foundation

get.foundation

カスタムコンポーネントを作成する

たとえば、独自の通知システムを作成するとします。以下の手順で実装できます。

コンポーネントファイルを作成

components ディレクトリに Notifier.php を作成します。

namespace app\components;

use Yii;
use yii\base\Component;

class Notifier extends Component
{
    public $fromEmail = 'default@example.com'; // デフォルト値

    /**
     * 通知メールを送信する
     * @param string $toEmail
     * @param string $subject
     * @param string $message
     * @return bool
     */
    public function sendEmail($toEmail, $subject, $message)
    {
        return Yii::$app->mailer->compose()
            ->setFrom($this->fromEmail)
            ->setTo($toEmail)
            ->setSubject($subject)
            ->setTextBody($message)
            ->send();
    }

    /**
     * シンプルなログを記録
     * @param string $message
     */
    public function logNotification($message)
    {
        Yii::info($message, 'notifier');
    }
}

コンポーネントをアプリケーションに登録する

アプリケーションの設定ファイル config/web.php に登録します。

'components' => [
    'notifier' => [
        'class' => 'app\components\Notifier',
        'fromEmail' => 'no-reply@yourapp.com', // プロパティを上書き
    ],
],

カスタムコンポーネントを使用する

コントローラやサービスクラスで簡単に利用できます。

namespace app\controllers;

use Yii;
use yii\web\Controller;

class SiteController extends Controller
{
    public function actionSendNotification()
    {
        $notifier = Yii::$app->notifier;

        // 通知メールを送信
        $toEmail = 'user@example.com';
        $subject = 'お知らせ';
        $message = 'こんにちは、こちらは通知メールです！';

        if ($notifier->sendEmail($toEmail, $subject, $message)) {
            $notifier->logNotification("通知を $toEmail に送信しました。");
            return "通知メールを送信しました！";
        }

        return "通知メールの送信に失敗しました。";
    }
}

高度な設定を追加する

場合によっては、外部サービスとの連携やさらなる機能拡張が必要になることがあります。その際、依存性を注入する方法が役立ちます。

例: 外部SMSサービスと連携

Notifier.php を以下のように拡張します。

namespace app\components;

use Yii;
use yii\base\Component;

class Notifier extends Component
{
    public $smsService; // 外部サービスのインスタンス

    /**
     * SMSを送信する
     * @param string $phoneNumber
     * @param string $message
     * @return bool
     */
    public function sendSms($phoneNumber, $message)
    {
        if (!$this->smsService) {
            throw new \Exception("SMSサービスが設定されていません。");
        }

        return $this->smsService->send($phoneNumber, $message);
    }
}

そして、設定ファイルでSMSサービスを注入します。

'components' => [
    'notifier' => [
        'class' => 'app\components\Notifier',
        'smsService' => [
            'class' => 'app\components\SmsService', // 外部サービスの実装クラス
        ],
    ],
],

まとめ

Yii2のコンポーネントをカスタマイズすることで、再利用可能なコードを簡潔にまとめることができます。この記事で紹介した例を参考に、自分のプロジェクトに合わせたコンポーネントを設計してみてください。

ブログに掲載する際は、さらに適用例やスクリーンショットを追加して読みやすくすると良いでしょう！

アプリケーションの構造: アプリケーション・コンポーネント

www.yiiframework.com

ここではユーザ認証のサンプルを固定オブジェクトからデータベース管理に切り替える方法を説明します。

尚、Yii2のインストールがされていない場合は以下を参考してください。

Yii2のインストール・初期設定方法

日本国では人気の無いフレームワークYii2 充実したライブラリと機能性の高さの割に大規模なウェブアプリケーションだけでなく小規模なウェブアプリケーションでも開発しやすいようディレクトリの構成変更が簡単にできる便利なフレームワークです。 この

blog.takeho.com

データベーステーブルとモデルの作成

マイグレーションを使用してユーザ管理用データベーステーブルを用意します。

データベーステーブルの作成

マイグレーションファイルの作成

次のコマンドを実行してマイグレーションファイルを作成します。

# php yii migrate/create create_user_table --fields="username:string(32):notNull:unique,password:string(64):notNull,access_token:string(32),auth_key:string(32)"
Yii Migration Tool (based on Yii v2.0.51)

Create new migration '/var/www/html/yii2.takeho.com/migrations/m240806_073739_create_user_table.php'? (yes|no) [no]:yes
New migration created successfully.
#

コマンド実行後、migrationsのディレクトリの作成及びその中に以下のファイルが生成されます。

<?php

use yii\db\Migration;

/**
 * Handles the creation of table `{{%user}}`.
 */
class m000000_000000_create_user_table extends Migration
{
    /**
     * {@inheritdoc}
     */
    public function safeUp()
    {
        $this->createTable('{{%user}}', [
            'id' => $this->primaryKey(),
            'username' => $this->string(32)->notNull()->unique(),
            'password' => $this->string(64)->notNull(),
            'access_token' => $this->string(32),
            'api_key' => $this->string(32),
        ]);
    }

    /**
     * {@inheritdoc}
     */
    public function safeDown()
    {
        $this->dropTable('{{%user}}');
    }
}

マイグレーションの反映

次の要領でコマンドを実行します。

# php yii migrate
Yii Migration Tool (based on Yii v2.0.51)

Creating migration history table "migration"...Done.
Total 1 new migration to be applied:
        m240806_073739_create_user_table

Apply the above migration? (yes|no) [no]:yes
*** applying m240806_073739_create_user_table
    > create table {{%user}} ... done (time: 0.006s)
*** applied m240806_073739_create_user_table (time: 0.012s)


1 migration was applied.

Migrated up successfully.
#

上記実行後、データベースにuserテーブルが作成されている事が確認できます。

モデルの作成

モデルの作成にはYii2のGUI生成ツールGiiを仕様します。

モデル生成ページへアクセス

次のURLへアクセスします。

http://www.example.com/index.php?r=gii

Model Generatorの項目にあるStartを押下します。

パラメータ設定

上記を参考に以下の情報を入力・設定し、Previewを押下します。

確認画面（プレビュー）

Generateを押下します。

生成確認

次のファイルが生成されているか確認します。

/models/User.php

CRUD（create、read、update、delete）機能の追加とデータの投入

モデルと同じ要領でGiiで以下のパラメータを指定してCURDを生成します。

動作確認

次のURLへアクセスしてCRUDが機能するか確認します。

http://www.example.com?r=user/index

User登録フォームの改修

前頁で作成したUserのCURDには次の問題があるので修正を行います。

• Auth Keyの入力は不要だか新規登録時に自動で値が設定される必要がある
• Access Tokenの入力が不要
• パスワードが平文保存されている

Auth Keyの値を自動設定する

次のコードを参考にmodel/User.phpへbeforeSaveメソッドを追加します。

  public function beforeSave($insert)
  {
      if (parent::beforeSave($insert)) {
          if ($this->isNewRecord) {
              $this->auth_key = \Yii::$app->security->generateRandomString();
          }
          return true;
      }
      return false;
  }

上記より保存する前に新しいレコードの追加（insert）が確認の上、ランダムな文字列をauth_keyへセットします。

Auth KeyとAccess Tokenの入力を消す

Auth KeyとAccess Tokenは動的に生成する情報になり入力するべき項目ではありませんので、入力項目を消します。

次の項目を削除します。

    <?= $form->field($model, 'access_token')->textInput(['maxlength' => true]) ?>

    <?= $form->field($model, 'auth_key')->textInput(['maxlength' => true]) ?>

パスワードの保存をハッシュ値に変更

次のコードを参考にmodel/User.phpのbeforeSaveメソッドを編集します。

    public function beforeSave($insert)
    {
        if (parent::beforeSave($insert)) {
            $this->password = Yii::$app->security->generatePasswordHash($this->password);
            if ($this->isNewRecord) {
                $this->auth_key = Yii::$app->security->generateRandomString();
            }
            return true;
        }
        return false;
    }

上記のように$this->passwordの値をセキュリティクラスからハッシュ値を求めた値に設定します。

認証インターフェイスの環境を整える

認証インターフェイスの利用に必須となる次のメソッドをUserモデルに追加します。

    public static function findIdentity($id)
    {
      return static::findOne($id);
    }

    public static function findIdentityByAccessToken($token, $type = null)
    {
      return static::findOne(['access_token' => $token]);
    }

    public static function findByUsername($username)
    {
      return static::findOne(['username' => $username]);
    }

    public function getId()
    {
      return $this->id;
    }

    public function getAuthKey()
    {
      return $this->auth_key;
    }

    public function validateAuthKey($authKey)
    {
      return $this->getAuthKey() === $authKey;
    }

    public function validatePassword($password)
    {
      return Yii::$app->getSecurity()->validatePassword($password, $this->password);
    }

アクセス確認

次のURLへアクセスして認証確認を行います。

http://www.example.com/index.php?r=site/login

ログインに成功したらデバックツールバーのUserを押下して認証されている情報を確認できます。

充実したライブラリと機能性の高さの割に大規模なウェブアプリケーションだけでなく小規模なウェブアプリケーションでも開発しやすいようディレクトリの構成変更が簡単にできる便利なフレームワークです。

この記事ではYii2のインストールと開発開始までの初期設定方法を説明します。

Yii2のインストール

次のcomposerコマンドでYii2をインストールします

# cd ＜インストールするディレクトリ＞
# composer create-project --prefer-dist yiisoft/yii2-app-basic ＜プロジェクト名＞

コード生成ツールGiiの許可設定

Yii2にはGUI上で次のファイルを自動生成する機能があります。

• Model Generator
  このジェネレータは、指定されたデータベーステーブルのActiveRecordクラスを生成します。
• CRUD Generator
  このジェネレータは、指定されたデータモデルのCRUD(作成、読み取り、更新、削除)操作を実装するコントローラとビューを生成します。
• Controller Generator
  このジェネレータは、1つまたは複数のコントローラアクションと対応するビューを持つ新しいコントローラクラスをすばやく生成するのに役立ちます。
• Form Generator
  このジェネレータは、指定されたモデルクラスの入力を収集するフォームを表示するビュースクリプトファイルを生成します。
• Module Generator
  このジェネレータは、Yiiモジュールに必要なスケルトンコードを生成するのに役立ちます。
• Extension Generator
  このジェネレータは、Yii拡張に必要なファイルを生成するのに役立ちます。

Giiの使用は開発環境でのみ利用できるようIP制限を掛けて特定のアクセス元IPのみ許可する必要があります。

/config/web.php

    $config['bootstrap'][] = 'gii';
    $config['modules']['gii'] = [
        'class' => 'yii\gii\Module',
        // uncomment the following to add your IP if you are not connecting from localhost.
        'allowedIPs' => ['127.0.0.1', '::1'], // ⇦コメントアウトを外しアクセス元IPを設定
    ];

デバックツールバーの許可設定

デバックツールバーもGiiと同様にアクセス元IPの許可設定をします。

/config/web.php

    $config['bootstrap'][] = 'debug';
    $config['modules']['debug'] = [
        'class' => 'yii\debug\Module',
        // uncomment the following to add your IP if you are not connecting from localhost.
        'allowedIPs' => ['127.0.0.1', '::1'], // ⇦コメントアウトを外しアクセス元IPを設定
    ];

データベース接続設定

データベースの接続設定をします。

config/db.php

return [
    'class' => 'yii\db\Connection',
    'dsn' => 'mysql:host=localhost;dbname=＜データベース名＞',
    'username' => '＜ユーザ名＞',
    'password' => '＜パスワード＞',
    'charset' => 'utf8',

以上で完了です。