Examples Bootstrap Version 4.5.2 + FriendsOfCake/bootstrap-ui

$ cd ~/path/to
$ composer create-project --prefer-dist cakephp/app my_app_name

今回はbootstrap4を使うので friendsofcake/bootstrap-ui dev-developを使います。

$ cd my_app_name
$ composer require friendsofcake/bootstrap-ui dev-develop
$ composer require phpoffice/phpspreadsheet

他に必要なものがあればインストールします。

$ bin/cake plugin load BootstrapUI

次のコマンドは node.js がない環境だと失敗する

$ bin/cake bootstrap install

node.js が実行できる環境で bin/cake plugin load BootstrapUIまでを実行後bin/cake bootstrap installを実行しますと、jqueryやboostrapがvendor/friendsofcake/bootstrap-ui以下にインストールされます。今回はbootstrap@4.3.1とjquery@3.4.1、popper.js@1.15.0がインストールされました。これを、

実行環境のvendor/friendsofcake/bootstrap-uiにコピーします。

次に

$ bin/cake bootstrap modify_view
$ bin/cake bootstrap copy_layouts

では早速、usersをbakeしてみましょう。

$ bin/cake bake all users -t BootstrapUI

-t BootstrapUIを付けてbakeするとベイクテンプレートを使用できます。

このままだと、loginメソッドがありませんのでUsersControllerにloginメソッドを足しましょう。

    /**
     * login method
     *
     * @return null
     */
    public function login()
    {
        if ($this->request->is('post')) {
            $user = $this->Auth->identify();
            if ($user) {
                $this->Auth->setUser($user);
                return $this->redirect($this->Auth->redirectUrl());
            }
            $this->Flash->error('ユーザー名またはパスワードが不正です。');
        }
        $user = $this->Users->newEntity();
        $this->set(compact('user'));
    }
    /**
     * logout method
     * @return null
     */
    public function logout()
    {
        $this->Flash->success('ログアウトしました。');
        return $this->redirect($this->Auth->logout());
    }

もう一度今度はtemplateでbakeします。

bin/cake bake template users -t BootstrapUI

すべて(n)で答えると、login.ctpが追加されています。