CodeIgniter でつくる、あゆ板風何か vol.2

まずは、コントローラとビューだけでモックアップを作ってみたいと思います。

用意するのは、

  • CodeIgniter 2.0.3 (以下 ci)
  • git
  • CloudControl(以下 CC)
CloudControl は php のホスティングに対応した Paas で Rails の heroku のようなサービスです。
CC はアカウントをとって、コマンドが打てることを前提とします。

CodeIgniter セットアップ

ci を入手し、プロジェクト名として ayuita-clone にディレクトリ名を変更します。

git リポジトリの方が、随時開発が進んでいて、幾つかバグも潰されていてよいのですが、バージョンを固定する、という意味でアーカイブ版を用います。

アーカイブを展開し、名前を変更して、webサーバでアクセスできるように設定したら、アクセスしてデフォルトのビュー画面を拝んで動作を確認します。

ローカル環境が面倒くさい、という人は次の CroudControl にデプロイをやって、CC 上で動かしながら開発でも良いと思います。

git リポジトリとして初期化もしておきましょう。

cd ayuitaclone
git init
git add .
git commit -m'initial commit.'

.gitignore などは適宜用意してください。

CloudControl にデプロイ

最終的に CC にデプロイしますが、まず先にデプロイして、作業でつまずかないようにしておきましょう。

cctrlapp が使えるようになっていることを前提で話を進めます。

cctrlapp ayuitaclone create php
cctrlapp ayuitaclone/default addon.add mysql.free
cctrlapp ayuitaclone/default push
cctrlapp ayuitaclone/default deploy

データベースを使うので、ついでに有効化しておきます。

ローカルで動かしたときと同様、welcome  ビューが拝めれば完了です。

CC 上で動作を確認したい場合は好きなタイミングでデプロイしてください。

上記の push を行ってから、deploy を行えばデプロイできます。

.htaccess を設置

分かりやすいURIでアクセスしたいので、mod_rewrite を利用します。

個人的な好みで、assets/ 以下に css, js などを配置するために、assets も除外しています。

ayuitaclone/.htaccess

RewriteEngine on
RewriteCond $1 !^(index.php|assets|images|robots.txt)
RewriteRule ^(.*)$ index.php/$1 [L]

application/config/config.php を書き換えます。

- $config['index_page'] = 'index.php';
+ $config['index_page'] = '';

index_page の値を空にセットします。

オートロードの設定

config/autoload.php で、自動的に読み込むライブラリやヘルパーを指定します。

各コントローラー、徹底的にチューニングするなら、各アクションごとに、読み込む必要があるものだけを読み込むのが、より高速に軽いアプリケーションになりますが、作業効率や可読性を重視して、大抵の場合に使うライブラリとヘルパーは autoload.php で常に読み込まれるようにします。

- $autoload['libraries'] = array();
+ $autoload['libraries'] = array(
+   'database', 'form_validation', 'session'
+ );

- $autoload['helper'] = array();
+ $autoload['helper'] = array(
+   'form', 'html', 'url', 'application'
+ );

application というヘルパはあとで独自につくるものです。今回は手抜きでキッチンシンク的に、コレに詰め込みます。

ビューを作成

個人的な好みでパーシャルを以下のように分割、配置しました。

view
  items/
    index.php
  shared/
    head.php
    header.php
    nav.php
    footer.php

shared には共通部分を、items コントローラーのビューは items/ に配置します。

ci  ではビューを views 以下のファイルを ファイル名で自由に読み込むことができますが、便宜上と管理のしやすさからこのようにしました。

共通部分作成

全てのビューで読み込まれる共通部分を作成します。

// views/shared/head.php
<head>
  <meta charset="UTF-8" />
  <title>ayuita-clone</title>
  <?php echo link_tag( 'assets/css/ayuitaclone.css' ) ?>
  <script type="text/javascript" src="assets/js/ayuitaclone.js"></script>
</head>

// views/shared/header.php
<h1>
  <?php echo 'AyuIta-Clone' ?>
</h1>

// views/shared/nav.php
<ul>
  <li><?php echo anchor( 'items/vip', 'VIP認証' ) ?></li>
  <li><?php echo anchor( 'items/add', '新規提供品POST' ) ?></li>
  <li><?php echo anchor( 'items/log', '過去ログ一覧' ) ?></li>
  <li><?php echo anchor( 'admin', '管理モード' ) ?></li>
</ul>
// views/shared/footer.php
<p>2011 ayuita-clone</p>

layout パターンを提供してくれるプラグインや core クラスの拡張を利用するともっと楽ですが、今回は何も使わずにつくります。

分割したパーツをビューの中で $this->view( ‘hoge’ ) の用に呼び出して使います。

提供品一覧の作成

controllers/items.php と views/items/index.php をつくりました。

// controllers/items.php
class Items extends CI_Controller {

  public function __construct(){
    parent::__construct();
    $this->load->model( 'Item_model' );
    $this->load->model( 'Type_model' );
  }
  public function index() {
   $data = array(
      'items' => $this->Item_model->find_all(),
    );
    $this->load->view( 'items/index'、$data ) ;
  }
}

順序が前後しますが、後に作るモデルも含まれています。コンストラクタで load しているのに深い意味はないです。autoload.php に書いても同じです(若干実行順序がことなるかもしれませんが)。

$this->Itemo_model->find_all() は後に作るモデルとそのメソッドです。

全件取得し、ビューにレコードのデータを渡します。

// views/items/index.php
<html>
<?php echo $this->view( 'shared/head' ) ?>
<body>

<?php echo $this->view( 'shared/header' ) ?>

<div id="container">
  <?php echo $this->view( 'shared/nav' ) ?>

  <ul>
    <li>要書込のものは追加書き込みをすることでアドレスが現れます。</li>
    <li>UP職人はD/Lできる人数を設定できます。設定人数を超えると提供品のアドレスは表示されません。</li>
    <li>優秀UP職人として活動していただいた方にはVIP特典が贈られます。</li>
  </ul>

  <table>
    <tr>
      <th>提供日</th>
      <th>UP職人</th>
      <th>提供品</th>
      <th>種別</th>
      <th>DL数</th>
      <th>トピック状況</th>
    </tr>
    <?php foreach( $items as $i ): ?>
    <tr>
      <td><?php echo date( 'Y/m/d', strtotime( $i->created_at ) ) ?></td>
      <td><?php echo h($i->provider_name) ?></td>
      <td><?php echo anchor( "items/show/{$i->id}", h($i->name) ) ?></td>
      <td><?php echo $i->type_name ?></td>
      <td><?php echo $i->dl_count ?></td>
      <td><?php echo display_limit( $i->dl_limit, $i->dl_count ) ?></td>
    </tr>
    <?php endforeach ?>
  </table> 
</div>
<?php echo $this->view( 'shared/footer' ) ?>

</body>
</html>

display_limit() は後に実装する独自ヘルパです。

ヘルパの実装

独自のヘルパを実装しておきます。

function display_limit( $count, $consume ){
  if( 0 == $count ){
    return '無制限';
  }else{
    $left = $count - $consume;
    return 1 > $left ? '提供終了' : "あと{$left}人";
  }
}

function h($var){
  if (is_array($var)){
    return array_map( 'h', $var );
  }else{
    return htmlspecialchars( $var, ENT_QUOTES, config_item( 'charset' ) );
  }
}

function commented( $id, $gots ){
  return is_array( $gots ) ? in_array( $id, $gots ) : FALSE;
}

提供品の状態を表示する文字列ヘルパと、エスケープヘルパ、お礼用ヘルパを実装します。

ルーティングの変更

items/index がルートで表示されるように、config/routes.php を変更します。

- $route['default_controller'] = "welcome";
+ $route['default_controller'] = "items";

まだモデルがないのでコントローラーでエラーが出ますので次章へ続きます。

完了画面でリロードすると、同じ内容がポストされますが、create メソッドにポストすることで登録が出来る仕様ということにしてよしとしました。

次はデータベース周りをセットアップします。

welcome コントローラーとビューは不要なので削除してしまってもよいです。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする