CakePHP3系環境にBootstrapをinstall（for Windows）

1. Bootstrapのインストール

・Bootstrapの取得
http://getbootstrap.com
からファイルダウンロード

・WebRoot配下に展開

2. BootstrapUIのインストール

・BootstrapUIの取得
https://github.com/FriendsOfCake/bootstrap-ui/
からファイルダウンロード

・pluginsディレクトリにフォルダ名BootstrapUIとして展開

3. JQueryのインストール

・JQueryの取得
http://code.jquery.com
からファイルダウンロード

・webroot/js/jquery配下に展開

4. Bootstrap設定

・config/bootstrap.phpに追記
--------------------------------
Plugin::load('BootstrapUI', ['autoload' => true]);
--------------------------------

・src/View/AppView.phpに追記
--------------------------------
public function initialize()
{
$this->loadHelper('Html', ['className' => 'BootstrapUI.Html']);
$this->loadHelper('Form', ['className' => 'BootstrapUI.Form']);
$this->loadHelper('Flash', ['className' => 'BootstrapUI.Flash']);
$this->loadHelper('Paginator', ['className' => 'BootstrapUI.Paginator']);
}
--------------------------------

5. cake bakeコマンドを使ってファイル作成 (例でAdminクラスを作る)

・コマンドプロンプトで以下のコマンド実行
cd C:\eclipse\xampp\htdocs\bin
cake bake all Admin

以下のファイルが生成される
Controller/AdminController.php
src/Model/Entity/Admin.php
src/Model/Table/AdminTable.php
test/Fixture/AdminFixture.php
test/TestCase/Controller/AdminControllerTest.php
test/TestCase/Model/Table/AdminModelTest.php

6. src/Template/Layout/default.ctpの編集

・追記
$this->prepend('css', $this->Html->css(['bootstrap']));
$this->prepend('script', $this->Html->script(['jquery-2.1.4.js', 'bootstrap']));

・Bootstrap の CSS と衝突を避けるため以下は削除
< ?= $this->Html->css('base.css') ?>
< ?= $this->Html->css('cake.css') ?>

7. 画面を確認

-- Install Bootstrap to CakePHP3 for windows --

1. Bootstrap install

・Acquisition of Bootstrap
http://getbootstrap.com
file download

・Deployment under WebRoot

2. BootstrapUI install

・Acquisition of BootstrapUI
https://github.com/FriendsOfCake/bootstrap-ui/
file download

・Deployment as a folder name BootstrapUI the plugins directory

3. JQuery install

・Acquisition of JQuery
http://code.jquery.com
file download

・Deployment under webroot/js/jquery

4. Bootstrap setting

・Appended to the config/bootstrap.php
--------------------------------
Plugin::load('BootstrapUI', ['autoload' => true]);
--------------------------------

・Appended to the src/View/AppView.php
--------------------------------
public function initialize()
{
$this->loadHelper('Html', ['className' => 'BootstrapUI.Html']);
$this->loadHelper('Form', ['className' => 'BootstrapUI.Form']);
$this->loadHelper('Flash', ['className' => 'BootstrapUI.Flash']);
$this->loadHelper('Paginator', ['className' => 'BootstrapUI.Paginator']);
}
--------------------------------

5. File created using a cake bake command (example:Admin)

・following command at the command prompt
cd C:\eclipse\xampp\htdocs\bin
cake bake all Admin

The following files are generated
Controller/AdminController.php
src/Model/Entity/Admin.php
src/Model/Table/AdminTable.php
test/Fixture/AdminFixture.php
test/TestCase/Controller/AdminControllerTest.php
test/TestCase/Model/Table/AdminModelTest.php

6. edit default.ctp

・Appended
$this->prepend('css', $this->Html->css(['bootstrap']));
$this->prepend('script', $this->Html->script(['jquery-2.1.4.js', 'bootstrap']));

・Delete the following in order to avoid the CSS and the collision of Bootstrap
< ?= $this->Html->css('base.css') ?>
< ?= $this->Html->css('cake.css') ?>

7. Check the screen