スポンサーリンク

GitHubにCakePHP3のプロジェクトを作成してEclipseで開発する

2019.07.18

CakePHP3を使ったシステム開発を行う際にそろそろベースとなるようなテンプレートプロジェクトを作成した方が良いのではないかなと思い、挑戦してみることにしました。最終的にはbootstrap4を導入、テーブル作成→bake allするだけで一通りのMVC機能が生成できるようなプロジェクトが作れればいいかなと思っています。

今回は自身の備忘録も兼ねてGitHubにプロジェクトを作成するところからの一連の流れを画像付きでまとめてみました。

IDEについて

Eclipseのバージョン4.6を使用しています。
確認したらPleiades All in One Ultimate版のFull Editionでした。
Git関連のコマンドはほぼEclipseのプラグインに頼っているのでいまだにクローンくらいしかコマンドがわかっていません。。（；；
ダウンロードページ：Eclipse 日本語化 | MergeDoc Project

前提条件

  • MySQL5.7サーバーがインストール済み
    • CakePHP3の動作要件は5.5.3以上の模様
  • PHP5.6～ or PHP7～がインストール済み

手順１ – GitHubでプロジェクトを作成する

  1. とりあえずPrivateなリポジトリを作成
  2. リポジトリ名を「my_cakephp3_init」と命名
  3. リポジトリ作成後の画面からhttpsで始まるクローン用のURLをコピー

https://github.com/imo-tikuwa/my_cakephp3_init.git

手順２ – Eclipseのワークスペース上にGitHubのリポジトリのクローンを作成

  1. Gitリポジトリ・エクスプローラーで「右クリック＞リポジトリー・パスまたはURIの貼り付け」

  1. GitHubのアカウント情報を入力して「次へ」
    1. ロケーションの情報はクリップボードの情報を元に自動設定してくれる
  2. ローカル宛先を適当に設定して「完了」

  1. Gitリポジトリ・エクスプローラーの一覧に追加したリポジトリが表示されたら、「右クリック＞プロジェクトのインポート」

  1. 「一般的なプロジェクトとしてインポート」を選択して「次へ＞完了」
  2. インポート後、PHPエクスプローラーの方にインポートしたプロジェクトが表示されることを確認できればOK

手順３ – CakePHP3をインストールする

このページを書き始めたころ、CakePHP3.7系の最新をインストールして構築を進めていたのですがデータベース関連と思われるエラーが解決できませんでした。。（；；
3.6系ではそのようなエラーが発生しなかったため3.6系の最新をインストールする手順となっています。
  1. my_cakephp3_initプロジェクトのルートディレクトリに移動
  2. 以下のコマンドでcakephp3.6をインストール
cd /D E:\workspace_git\my_cakephp3_init
composer create-project --prefer-dist cakephp/app:3.6.* cake_app

  1. インストール後、プロジェクトフォルダをリフレッシュした状態
  2. インストール直後の状態をいったんGitにプッシュする
  3. GitへのプッシュにはGitステージングというエクスプローラーを使用
    1. 使い方はプッシュ対象を「ステージされていない変更」から「ステージされた変更」にドラッグアンドドロップするだけ
  4. vendor、logs、tmpの辺りはデフォルトで.gitignoreによりプッシュ対象から除外されている。インストール直後のプッシュ対象は意外と少ない

手順４ – Eclipseの入力補完が効くようにする

  1. プロジェクト直下の.projectを編集
  2. プロジェクト直下に.buildpathを追加
<?xml version="1.0" encoding="UTF-8"?>
<projectDescription>
  <name>my_cakephp3_init</name>
  <comment></comment>
  <projects>
  </projects>
  <buildSpec>
+		<buildCommand>
+			<name>org.eclipse.wst.common.project.facet.core.builder</name>
+			<arguments>
+			</arguments>
+		</buildCommand>
+		<buildCommand>
+			<name>org.eclipse.wst.validation.validationbuilder</name>
+			<arguments>
+			</arguments>
+		</buildCommand>
+		<buildCommand>
+			<name>org.eclipse.dltk.core.scriptbuilder</name>
+			<arguments>
+			</arguments>
+		</buildCommand>
  </buildSpec>
  <natures>
+		<nature>org.eclipse.php.core.PHPNature</nature>
+		<nature>org.eclipse.wst.common.project.facet.core.nature</nature>
  </natures>
</projectDescription>

<?xml version="1.0" encoding="UTF-8"?>
<buildpath>
  <buildpathentry kind="src" path=""/>
  <buildpathentry kind="con" path="org.eclipse.php.core.LANGUAGE"/>
</buildpath>

手順５ – MySQLデータベースの連携

  1. プロジェクト直下に用意したSQLをローカルに構築しているMySQLサーバーに1行のコマンドで実行するだけ
    1. MySQLのポートは適宜修正してください
  2. my_cakephp3_initとmy_cakephp3_init_debugという2つのデータベースとmy_cakephp3_usrというMySQLユーザーが作成されます
  3. Datasourcesの設定を済ませたapp.phpをプロジェクトのenvディレクトリに用意しています。cake_app/config/app.phpにコピーでOK
mysql -u root -p -P 33306 < env\create_db_and_table.sql
-- データベースとユーザーを作成する
CREATE DATABASE my_cakephp3_init CHARACTER SET utf8 COLLATE utf8_general_ci;
GRANT SELECT,INSERT,UPDATE,DELETE,CREATE,DROP,INDEX,ALTER
ON my_cakephp3_init.* TO 'my_cakephp3_usr'@'localhost'
IDENTIFIED BY 'RflKHLDC78V27OEt';
FLUSH PRIVILEGES;

-- テーブルとデータを作成する
USE my_cakephp3_init;

SET FOREIGN_KEY_CHECKS=0;
DROP TABLE IF EXISTS `users`;
CREATE TABLE `users` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(50) NOT NULL,
  `kana` varchar(50) NOT NULL,
  `mail` varchar(255) NOT NULL,
  `created` datetime DEFAULT NULL,
  `modified` datetime DEFAULT NULL,
  `delete_flag` char(1) NOT NULL DEFAULT '0',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8;

INSERT INTO `users` VALUES ('1', 'てすといち', 'テストイチ', 'example1@imo-tikuwa.com', '2019-06-29 14:42:20', '2019-06-29 14:42:20', '0');
INSERT INTO `users` VALUES ('2', 'てすとに', 'テストニ', 'example2@imo-tikuwa.com', '2019-06-29 14:42:20', '2019-06-29 14:42:20', '0');
INSERT INTO `users` VALUES ('3', 'てすとさん', 'テストサン', 'example3@imo-tikuwa.com', '2019-06-29 14:42:20', '2019-06-29 14:42:20', '0');

-- デバッグキット用のDBを作成
CREATE DATABASE my_cakephp3_init_debug CHARACTER SET utf8 COLLATE utf8_general_ci;
GRANT SELECT,INSERT,UPDATE,DELETE,CREATE,DROP,INDEX,ALTER
ON my_cakephp3_init_debug.* TO 'my_cakephp3_usr'@'localhost';

手順６ – bakeでMVCリソースを自動生成する

  1. 手順４で作成したusersテーブルを元にモデル、ビュー、コントローラーの一式を生成
  2. コントローラーの中にはindex、add、edit、view、deleteのCRUD処理が出来上がる
    1. addとeditはコントローラー内の処理もビューの処理もやってることがほとんど同じなので共通化してもいいかも
bin\cake bake all users

手順７ – 動作確認

  1. cake.batからビルトインサーバーを起動して確認
    1. オプションでホスト名やポート名を設定することもできる
    2. httpdの設定を作成せずに使えるので簡単な動作確認を行うときに便利
bin\cake server

  1. ブラウザでhttp://localhost:8765/usersにアクセスして動作確認
    1. 一覧、新規登録、詳細、更新、削除などが行えるようになっている
    2. DebugKitの画面下に表示されていることが確認できる
    3. こういった管理機能は実際は管理者ログインを行った後の画面で使うことが多い
      bakeの際、–prefixオプションを使用することでプレフィックスルーティング用のコントローラーやテンプレートを作成できる。便利
    4. created,modifiedはCakePHP3で予約されているカラム名のため登録/更新画面には表示されず、良い感じだが独自に定義した削除フラグは当然入力項目として表示されてしまう。bakeによって自動生成されるソースを変更することも可能。twigというPHPのテンプレートエンジンを使用している模様
      自動生成のプログラムを頑張ることで後の仕事量が減ったりするかも

その他１ – bootstrap4とMaterial Design for Bootstrap 4テーマを導入

bootstrap4をCakePHP3に導入するのに著名なプラグインがあるようですが、使い方調べるのが辛かったので今回は手動で導入しました。
bootstrap4のテーマとしてMaterial Design for Bootstrap 4というマテリアルデザインなテーマを入れてみました。
公式：Material Design for Bootstrap 4 – the most popular & free UI KIT – Material Design for Bootstrap
デモ：Bootstrap Components – visual guide to components of Bootstrap 4 – Material Design for Bootstrap

その他２ – AdminLTEテーマを導入

先に導入したmdbootstrapですが無料版の制限が標準の入力項目にまで影響しており非常に使いづらいことが分かったため削除しました。
代わりにAdminLTEというBootstrap3の頃から有名なテーマを導入してみました。
公式：Free Bootstrap Admin Template | AdminLTE.IO
デモ：AdminLTE 3 | Dashboard
ヘッダ部分に余計なソースが残っていますが、消すと寂しくなるのでとりあえず残してます。

とりあえず今回はここまで。
現在はaddとeditを共通化する良い方法を検討したり、twigのテンプレートを眺めてたりしています。
最初にプライベートリポジトリとして作成していましたが、大したものでもないので公開しました。
https://github.com/imo-tikuwa/my_cakephp3_init

タイトルとURLをコピーしました