cakephpを使って10分でCMSを作る方法
こんにちわ。
先日cakephpを使って10分でCMSを作る方法を教える必要があったのですが、まとめた資料をブログでもシェアします。
CMSってこんなに簡単に作れるんだ！を体験してもらえたら幸いです。
環境はすでに構築してある前提ですが、ローカルサーバーを立てたい場合には、
以下のサイトが参考になるかと思います。
ではでは、早速挑戦してみましょう！
1.CakePHPの最新版をダウンロード
まずはCakePHPの公式サイトから最新版をダウンロードします。
https://github.com/cakephp/cakephp/downloads
ダウンロードしたファイルを解凍すると長い名前になっているので、「cakephp」などにリネームしておきます。
そしてFTPソフトでサーバーにアップロードします。アップ先は公開ディレクトリにしてください。
SSHで実行する場合は、以下のコマンドを叩きます。
wget https://github.com/cakephp/cakephp/tarball/1.3 tar xvfz 1.3 mv ./cakephp-cakephp-ee16348/ ./cakephp/
1.CakePHPのセットアップ
それでは、CakePHPが動作するようにセットアップしていきます。
セットアップにはbakeというコマンドを使用します。
これはコマンドラインでMVC （M=モデル、V＝ビュー、C＝コントローラー）のプログラムを自動で生成してくれる機能です。
爆速でプログラミングできるようになるので、今回はこれを使います。
それでは、まずターミナルを立ち上げて以下のコマンドを実行しましょう。
今回はnewappというディレクトリを作成して、そこに全て格納するようにします。
cakephpへのパスは先ほどダウンロードしたディレクトリです。
適時変更しながら読み進めてくださいね。
$ cakephp/cake/console/cake bake ← bakeコマンドを実行します。 Welcome to CakePHP v1.3.10 Console --------------------------------------------------------------- App : public Path: /home/username/public --------------------------------------------------------------- What is the full path for this app including the app directory name? Example:/home/username/public/myapp [/home/username/public/myapp] > /home/username/public/newapp ←パスを指定します。 Bake Project Skel Directory: /home/username/public/cakephp/cake/console/templates/skel Will be copied to: /home/username/public/newapp --------------------------------------------------------------- Look okay? (y/n/q) [y] > ←空Enter Do you want verbose output? (y/n) [n] > ←空Enter --------------------------------------------------------------- Created: newapp in /home/username/public/newapp --------------------------------------------------------------- Creating file /home/username/public/newapp/views/pages/home.ctp Wrote `/home/username/public/newapp/views/pages/home.ctp` Welcome page created Random hash key created for 'Security.salt' Random seed created for 'Security.cipherSeed' CAKE_CORE_INCLUDE_PATH set to /home/username/public/cakephp in webroot/index.php CAKE_CORE_INCLUDE_PATH set to /home/username/public/cakephp in webroot/test.php Remember to check these value after moving to production server Your database configuration was not found. Take a moment to create one. --------------------------------------------------------------- Database Configuration: --------------------------------------------------------------- Name: [default] > ←空Enter Driver: (db2/firebird/mssql/mysql/mysqli/odbc/oracle/postgres/sqlite/sybase) [mysql] > ←空Enter。MySQLを使う。 Persistent Connection? (y/n) [n] > ←空Enter Database Host: [localhost] > ←DBのホスト名を入力。今回はlocalhostを使用。 Port? [n] > ←空Enter。ポートはデフォルトを使用。 User: [root] > hoge ←DBのユーザー名を指定 Password: > fuga ←DBのパスワードを指定 Database Name: [cake] > hoge ←DB名を指定 Table Prefix? [n] > ←空Enter Table encoding? [n] > ←空Enter --------------------------------------------------------------- The following database configuration will be created: --------------------------------------------------------------- Name: default Driver: mysql Persistent: false Host: localhost User: hoge Pass: ************ Database: hoge --------------------------------------------------------------- Look okay? (y/n) [y] > ←この内容でOKなら空Enter。 Do you wish to add another database configuration? [n] > ←空Enter。DB設定は１つのみ。 Creating file /home/username/public/newapp/config/database.php Wrote `/home/username/public/newapp/config/database.php`
これで /home/username/public/newapp にアプリケーションがセットアップできました。
↑http://[ドメイン]/newapp/にアクセスして、ページが表示されればひとまずOKです。
2.テーブルを作成する
それでは、CakePHPで更新するテーブルを作成します。
今回はPostテーブルという名前で作成します。
↑タイトルと本文だけのシンプルな構造です。
SQLはこんな感じです。
CREATE TABLE IF NOT EXISTS `posts` ( `id` int(10) unsigned NOT NULL auto_increment, `title` varchar(255) character set utf8 NOT NULL, `body` text character set utf8 NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=1 ;
3.アプリケーションのセットアップ
ここから再度コンソールに戻ってbakeを実行します。
オプションの引数でアプリ名を指定します。
$ cakephp/cake/console/cake bake -app newapp ←newappのセットアップを行います Welcome to CakePHP v1.3.10 Console --------------------------------------------------------------- App : newapp Path: /home/username/public/newapp --------------------------------------------------------------- Interactive Bake Shell --------------------------------------------------------------- [D]atabase Configuration [M]odel [V]iew [C]ontroller [P]roject [F]ixture [T]est case [Q]uit What would you like to Bake? (D/M/V/C/P/F/T/Q) > M ←モデルを作成します。 --------------------------------------------------------------- Bake Model Path: /home/username/public/newapp/models/ --------------------------------------------------------------- Possible Models based on your current database: 1. Post Enter a number from the list above, type in the name of another model, or 'q' to exit [q] > 1 ←Postモデルを作成する Would you like to supply validation criteria for the fields in your model? (y/n) [y] > ←空Enter。入力チェックを追加します。 Field: id Type: integer --------------------------------------------------------------- Please select one of the following validation options: --------------------------------------------------------------- 1 - alphanumeric 2 - between 3 - blank 4 - boolean 5 - cc 6 - comparison 7 - custom 8 - date 9 - decimal 10 - email 11 - equalto 12 - extension 13 - inlist 14 - ip 15 - maxlength 16 - minlength 17 - money 18 - multiple 19 - notempty 20 - numeric 21 - phone 22 - postal 23 - range 24 - ssn 25 - time 26 - url 27 - userdefined 28 - uuid 29 - Do not do any validation on this field. ... or enter in a valid regex validation string. [29] > ←空Enter。idフィールドは入力チェックはしない。 Field: title Type: string --------------------------------------------------------------- Please select one of the following validation options: --------------------------------------------------------------- 1 - alphanumeric 2 - between 3 - blank 4 - boolean 5 - cc 6 - comparison 7 - custom 8 - date 9 - decimal 10 - email 11 - equalto 12 - extension 13 - inlist 14 - ip 15 - maxlength 16 - minlength 17 - money 18 - multiple 19 - notempty 20 - numeric 21 - phone 22 - postal 23 - range 24 - ssn 25 - time 26 - url 27 - userdefined 28 - uuid 29 - Do not do any validation on this field. ... or enter in a valid regex validation string. [19] > ←空Enter。タイトルを必須項目にする。 Would you like to add another validation rule? (y/n) [n] > y ←続けて入力チェックを追加する Field: title Type: string --------------------------------------------------------------- Please select one of the following validation options: --------------------------------------------------------------- 1 - alphanumeric 2 - between 3 - blank 4 - boolean 5 - cc 6 - comparison 7 - custom 8 - date 9 - decimal 10 - email 11 - equalto 12 - extension 13 - inlist 14 - ip 15 - maxlength 16 - minlength 17 - money 18 - multiple 19 - notempty 20 - numeric 21 - phone 22 - postal 23 - range 24 - ssn 25 - time 26 - url 27 - userdefined 28 - uuid 29 - Do not do any validation on this field. ... or enter in a valid regex validation string. [19] > 15 ←タイトルの文字数制限を行う。 Would you like to add another validation rule? (y/n) [n] > ←空Enter。次の項目へ。 Field: body Type: text --------------------------------------------------------------- Please select one of the following validation options: --------------------------------------------------------------- 1 - alphanumeric 2 - between 3 - blank 4 - boolean 5 - cc 6 - comparison 7 - custom 8 - date 9 - decimal 10 - email 11 - equalto 12 - extension 13 - inlist 14 - ip 15 - maxlength 16 - minlength 17 - money 18 - multiple 19 - notempty 20 - numeric 21 - phone 22 - postal 23 - range 24 - ssn 25 - time 26 - url 27 - userdefined 28 - uuid 29 - Do not do any validation on this field. ... or enter in a valid regex validation string. [29] > 19 ←本文を必須にする Would you like to add another validation rule? (y/n) [n] > ←空Enter。次の項目へ。 Field: created Type: datetime --------------------------------------------------------------- Please select one of the following validation options: --------------------------------------------------------------- 1 - alphanumeric 2 - between 3 - blank 4 - boolean 5 - cc 6 - comparison 7 - custom 8 - date 9 - decimal 10 - email 11 - equalto 12 - extension 13 - inlist 14 - ip 15 - maxlength 16 - minlength 17 - money 18 - multiple 19 - notempty 20 - numeric 21 - phone 22 - postal 23 - range 24 - ssn 25 - time 26 - url 27 - userdefined 28 - uuid 29 - Do not do any validation on this field. ... or enter in a valid regex validation string. [29] > ←空Enter。作成日は入力チェックはしない Field: modified Type: datetime --------------------------------------------------------------- Please select one of the following validation options: --------------------------------------------------------------- 1 - alphanumeric 2 - between 3 - blank 4 - boolean 5 - cc 6 - comparison 7 - custom 8 - date 9 - decimal 10 - email 11 - equalto 12 - extension 13 - inlist 14 - ip 15 - maxlength 16 - minlength 17 - money 18 - multiple 19 - notempty 20 - numeric 21 - phone 22 - postal 23 - range 24 - ssn 25 - time 26 - url 27 - userdefined 28 - uuid 29 - Do not do any validation on this field. ... or enter in a valid regex validation string. [29] > ←空Enter。更新日は入力チェックはしない Would you like to define model associations (hasMany, hasOne, belongsTo, etc.)? (y/n) [y] > n ←モデルのアソシエーション。今回は使用しない --------------------------------------------------------------- The following Model will be created: --------------------------------------------------------------- Name: Post DB Table: `posts` Validation: Array ( [title] => Array ( [notempty] => notempty [maxlength] => maxlength ) [body] => Array ( [notempty] => notempty ) ) --------------------------------------------------------------- Look okay? (y/n) [y] > ←上記プレビューの内容で良ければ空Enter Baking model class for Post... Creating file /home/username/public/newapp/models/post.php Wrote `/home/username/public/newapp/models/post.php` SimpleTest is not installed. Do you want to bake unit test files anyway? (y/n) [y] > n ←自動テストは今回は作成しない
これでModelの設定は完了です。
次にControllerを設定します。
--------------------------------------------------------------- Interactive Bake Shell --------------------------------------------------------------- [D]atabase Configuration [M]odel [V]iew [C]ontroller [P]roject [F]ixture [T]est case [Q]uit What would you like to Bake? (D/M/V/C/P/F/T/Q) > C ←コントローラーを作成 --------------------------------------------------------------- Bake Controller Path: /home/username/public/newapp/controllers/ --------------------------------------------------------------- Possible Controllers based on your current database: 1. Posts Enter a number from the list above, type in the name of another controller, or 'q' to exit [q] > 1 ←Postを選択 --------------------------------------------------------------- Baking PostsController --------------------------------------------------------------- Would you like to build your controller interactively? (y/n) [y] > ←空Enter。対話式で作成します。 Would you like to use dynamic scaffolding? (y/n) [n] > ←空Enter。scaffoldは使用しない。 Would you like to create some basic class methods (index(), add(), view(), edit())? (y/n) [n] > y ←Postデータの一覧や追加変更処理を自動生成する Would you like to create the basic class methods for admin routing? (y/n) [n] > ←空Enter。URLにadminを使用しない。 Would you like this controller to use other helpers besides HtmlHelper and FormHelper? (y/n) [n] > ←空Enter。Htmlヘルパーを使用しない。 Would you like this controller to use any components? (y/n) [n] > ←空Enter。コンポーネントを使用しない。 Would you like to use Session flash messages? (y/n) [y] > ←空Enter。flashコンポーネントを使用する。 --------------------------------------------------------------- The following controller will be created: --------------------------------------------------------------- Controller Name: Posts --------------------------------------------------------------- Look okay? (y/n) [y] > ←上記プレビューの内容で良ければ空Enter Creating file /home/username/public/newapp/controllers/posts_controller.php Wrote `/home/username/public/newapp/controllers/posts_controller.php` SimpleTest is not installed. Do you want to bake unit test files anyway? (y/n) [y] > n ←自動テストは今回は作成しない
これでコントローラーも完了です。
最後にViewファイルを作ります。
--------------------------------------------------------------- Interactive Bake Shell --------------------------------------------------------------- [D]atabase Configuration [M]odel [V]iew [C]ontroller [P]roject [F]ixture [T]est case [Q]uit What would you like to Bake? (D/M/V/C/P/F/T/Q) > V ←Viewを選択 --------------------------------------------------------------- Bake View Path: /home/username/public/newapp/views/ --------------------------------------------------------------- Possible Controllers based on your current database: 1. Posts Enter a number from the list above, type in the name of another controller, or 'q' to exit [q] > 1 ←Postを選択 Would you like bake to build your views interactively? Warning: Choosing no will overwrite Posts views if it exist. (y/n) [n] > y ←上書きを許可 Would you like to create some CRUD views (index, add, view, edit) for this controller? NOTE: Before doing so, you'll need to create your controller and model classes (including associated models). (y/n) [y] > ←空Enter。一覧や追加変更ページを自動生成する Would you like to create the views for admin routing? (y/n) [n] > ←空Enter。URLにadminを含むページを作成しない。 Creating file /home/username/public/newapp/views/posts/index.ctp Wrote `/home/username/public/newapp/views/posts/index.ctp` Creating file /home/username/public/newapp/views/posts/view.ctp Wrote `/home/username/public/newapp/views/posts/view.ctp` Creating file /home/username/public/newapp/views/posts/add.ctp Wrote `/home/username/public/newapp/views/posts/add.ctp` Creating file /home/username/public/newapp/views/posts/edit.ctp Wrote `/home/username/public/newapp/views/posts/edit.ctp` --------------------------------------------------------------- View Scaffolding Complete.
これで表示画面も設定が終わりました。
１点だけ、ファイルを修正する必要があります。
Postモデルのタイトルチェックで追加した文字数制限ですが、
制限したい文字数を記述する必要があるので直接ファイルを書き換えます。
newapp/models/post.phpを開いたら、16行目近辺を以下のように修正します。
'maxlength' => array(
'rule' => array('maxlength'),
・・・
↓
'maxlength' => array(
'rule' => array('maxlength', 255),
これでデータの登録更新処理部分は完了です。
ひとまずブラウザから以下のURLにアクセスして動作を確認してみてください。
http://[ドメイン]/newapp/posts/
↑上のような画面が生成されていればOKです。
↑更新画面もばっちりできています。
↑エラー画面もばっちりです。
実際にデータが登録できる事も確認してみてください。
ログイン画面を作る
まだこれで終わりではないですよ。
そうです。管理者だけが更新できるようにするためのログイン画面が必要ですね。
ここはbakeだけでは作れないので、手を動かします。
まずはログインできるユーザー情報を格納するテーブルを作ります。
SQL
CREATE TABLE IF NOT EXISTS `users` ( `id` int(10) unsigned NOT NULL auto_increment, `username` varchar(255) character set utf8 NOT NULL, `password` varchar(255) character set utf8 NOT NULL, `created` datetime NOT NULL, `modified` datetime NOT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=1 ;
先ほどのPostと同様にUserでもbakeして、controller、model、viewを作成します。
内容は先ほどと同じでOKです。
$ cakephp/cake/console/cake bake -app newapp
それぞれのファイルを作成したら
users_controller.phpを以下のように編集します。
newapp/controllers/users_controller.php
class UsersController extends AppController {
var $name = 'Users';
$components = array('Auth');
function login(){
}
function logout(){
$this->Auth->logout();
}
}
ログイン画面を作成
app/views/usersフォルダ内にlogin.ctpファイルを作成します。
以下の内容をコピーしてください。
newapp/views/users/login.ctp
if ($session->check('Message.auth')) $session->flash('auth');
echo $form->create('User', array('action' => 'login'));
echo $form->input('username');
echo $form->input('password');
echo $form->end('Login');
ログアウト画面を作成
同時にlogout.ctpも作成します。
newapp/views/users/logout.ctp
ログアウトしました。
これでログインフォームが出来ました。
次に、ログインするためのユーザー名とパスワードをDBに設定します。
その際にパスワードは暗号化する必要があるのですが、
以下の手順で簡単に暗号化したパスワードを知る事ができますよ。
SQL
INSERT INTO `users` ( `id` , `username` , `password` , `created` , `modified` ) VALUES ( NULL , 'test', 'cd2409a5830bc21d461a2911da440ea877fab27b', '2011-07-05 00:00:00', '2011-07-05 00:00:00' );
最後にpost_controller.phpに認証が必要ないアクションを指定します。
indexとviewアクションは一般ユーザーが見れて良いページなので
この２つのアクションだけ認証が必要ないようにします。
以下のコードをpost_controller.phpに追加してください。
newapp/controllers/posts_controller.php
var $components = array('Auth');
function beforeFilter()
{
$this->Auth->allow('index', 'view');
}
これで完了です！
さあ、http://[ドメイン]/newapp/posts/ にアクセスしてみてください。
ログイン画面が出て、ユーザー名とパスワードを入力するとページが開けるようになりました。
以上で終了です。
簡単に設置できるよう、色々はしょっている部分もあります。ご了承ください。
何かわからない事や質問などありましたらお気軽にコメントくださいね。
読むべきサイトやブログ記事
もっと色々な機能が知りたい方やCakePHPを触ってみたい方は以下のサイトやブログを参考にすると色々勉強になると思います。私もいつもお世話になっております。
- CakePHP マニュアル
- コミュニティ
- cakephperの日記(CakePHP, MongoDB)
- 24時間CakePHP
- WEBLE
- Shin x blog
- CakePHP開発者が知るべき10のこと
- Fresh! » CakePHPで作る会員管理システム
- Mark Story
書籍ではこの本がおすすめです。cakephp1.2が対象なのですが、基礎的な部分からテストのやり方など
とてもためになる情報が満載です。
また、手前味噌ですが当ブログのCakePHPタグもぜひどうぞ。
以上、cakephpを使って10分でCMSを作る方法でした。
最新情報をお届けします
