cakephpでブックマークアプリを作る(4)-2

2011年05月28日| CakePHP入門

cakephpでブックマークアプリを作る(4)-2

記事を追加するための見た目の表示である『\posts\add.ctp』はできたので、後は記事を追加するfunction add()を追加するだけですね。

C:\xampp\htdocs\bookmark_master\app\controllers\posts_controller.php

を開いて、下記の赤字の部分を追加してください。

<?php

  class PostsController extends AppController {

  

  var $uses = array('Post');
function index($id = null) {
$con = array(

  'order' => array('Post.id DESC'),

  );
$post = $this->Post->find('all',$con);
$this->set('posts',$post);

  }
function add() {

  if(!empty($this->data)) {

  if($this->Post->save($this->data)) {

  $this->redirect('/posts');

  }

  }

  }


}

  ?>

これだけで、もう記事の投稿はできます。解説は一旦後にして、記事を投稿してみましょう！

Cakephp　記事の追加

登録ボタンを押すと、一覧ページにリダイレクトしてくれます。

もうこれだけで記事の追加ができてしまいました！
さらに注目してほしいのが、登録日時と更新日時両方が、プログラム上何もしていなくても自動で入ってくれます。
フィールド名をcreated、modifiedのDATETIMIE型にしておくことで、
登録日時と更新日時を勝手に入れてくれるんですね！すばらしい

function addの解説

function add() {
	if(!empty($this->data)) {
		if($this->Post->save($this->data)) {
			$this->redirect('/posts');
			}
		}
	}

まず、$this->dataの中身を確認するために、リダイレクト処理である$this->redirect(‘/posts’);をコメントアウトして、$this->dataをdebugしてみましょう。

function add() {
	if(!empty($this->data)) {
		if($this->Post->save($this->data)) {
			//$this->redirect('/posts');
debug($this->data);
			}
		}
	}

もう一度
http://localhost/bookmark_master/posts/add
からデータを投稿してみてください。

ここで言う[Post]とは、Postモデルのことです。この$this->dataの中身は、デバックの結果の通りです。

そして、save関数を使って、データの登録を行っているわけですね。

if(!empty($this->data)) {}

を使って、データが空でなければ登録を行い、無事に登録が完了すると
$this->redirect(‘/posts’);
で指定されたページにジャンプすることができます。

下記URLからダウンロードできます。
http://www.kaasan.info/sample/0528

次回は記事の編集についです。

2011年05月17日| 徒然

今日からあなたも情報通！情報収集のための５つのこと

私は19の時に生まれて初めて自分のノートパソコンを所有し、当時は音楽の専門学校に通っていたこともあり、作曲とかそちらに力を入れていましたが、自分のホームページを持ち始めたことをきっかけに、20のころから本格的にWEB屋として少しずつ仕事を始めました。

6年もこの業界にいると、『すごく仕事の出来る人』と『そうでもない人』の違いにいい加減気がつくのですが、実際問題WEB屋として仕事のできる人って、情報の収集力がすばらしいです。

そんなわけで、今日はWEB屋なら今すぐ実践した５つの情報収集方法を紹介したいと思います。

まずはツイッター

ま～、移動中の電車の中でもいいのですが、私の場合残念ながら地下鉄なので、会社に到着してからになるんですが・・・。
私はまだまだフォロー数が少ないのですが、100人ちょっとのフォローと200人ほどのフォロワーがいて、半分以上は同業のWEB関係の方です。流し見る程度に情報を得ます。
また、ちょっと分からないことがあればそれもハッシュタグをつけてツイートすると、１時間ほどで誰かが質問に答えてくれます。

はてなブックマークのIT欄を見る

はてなブックマークのIT欄を流し見ます。毎日はてなブックマークのIT欄を流し見るだけで全然トレンドに強くなります。こちらは毎日チェックしましょう

とにかくハテブ使え

前の会社のチーフに、『はてなブックマーク一年使って！そしたら人生変わるから』と言われ、一年使ったころから情報に強くなりました。気になる情報はとりあえずはてなブックマークをしておいて、タグをつけてあとで時間が空いたら流し見ます。
最近は自分で自分のためのクリップサイトを作ってしまったので、そちらに情報をためるケースが多くなってしまったのですが、・・・WEBSTA.info

RSSリーダーで購読しろ

仕事をして、こまったことがあると何でも検索しますよね。すると、意外とチェックしているサイトは同じサイトだったりすることありませんか？検索してヒットしたサイトが　あ、またこのサイトか、みたいな。
そういうサイトは迷わずRSSリーダーで購読しましょう。私はGoogle　RSSリーダーを利用して、気になっているサイトは毎日RSSリーダーを使って購読します。
RSSは日本人はあまり好きでない人が多いですが、海外サイトはRSSは画像付きで全文をRSSリーダーで公開しています。
RSSを流し見るだけで、そのサイトの全文をチェックしたこととと同じことが言えます。

これら上記４つを毎日続けろ

とにかく毎日続けることが大切です。
何かの入門書を何冊も読破することが情報ではありません。毎日ちょっとした情報を毎日積み重ねることが大切で、
『このプログラム、AJAXは以前はてぶでチェックしたことがある！』
とか、ちょっとしたアイディアや企画の役に立つ日がきっときます。

とにかく、毎日続けることが成長の糧となります。がんばりましょう。

2011年05月15日| CakePHP入門

cakephpでブックマークアプリを作る(4)-1

久々にcakephpでブックマークアプリを作る(4)をお送りします。

間がずいぶん開いてしまいましたが、いよいよ管理画面を作っていきたいと思います。

データの表示をするのがユーザー画面だとすると、データを登録するのはマスター画面となります。
今回からデータの登録を行うマスター画面となるのですが、

ユーザー認証機能まで設けるのは入門としては非常にハードルが上がるので、
前回まで作った

C:\xampp\htdocs\bookmark

このフォルダをそっくりそのまま複製して、

C:\xampp\htdocs\bookmark_master

マスター用のCakephpを用意します。

ポイント

ユーザー用とマスター管理用とそれぞれ別のCakephpを用意する

ということになります。

もし、これにさらにユーザー管理画面も付けるとすると、ユーザー管理画面用とマスター画面と通常画面とで３つのCakephpを用意することになります。

すると、ユーザー管理画面用ならユーザーのみのセッションを確認すればいいわけですし、マスターにいたってはベーシック認証のみをかけるか、IP制限をかけるだけでアクセスはされないわけですから、セッションの管理がすごくシンプルになります。
最初このやり方を聞いたとき、ちょっと乱暴な気がしましたが、よりシンプルに書くことができるという点で、Cakephp使いになってから、私はこの方式をとるようにしています。

さて、前置きはそれくらいにして、いよいよマスター管理画面の編集を行いたいと思います。

posts_controller.phpの編集

まずはコントローラーから編集します。
管理用に一覧表示用である、function indexのみを残して、残りは消してしまいます。

これに、データ追加用のfunctionを追加していきます。
function addはまだ空ですが、コントローラー側の下準備はこれでできました。

<?php
class PostsController extends AppController {

var $uses = array(‘Post’);

function index($id = null) {

$con = array(‘conditions’=>
‘order’ => array(‘Post.id DESC’),

);

$post = $this->Post->find(‘all’,$con);

$this->set(‘posts’,$post);
}

function add() {
}

}

function add用のview編集

下記のフォルダの中に　add.ctpファイルを作成して下さい。

C:\xampp\htdocs\bookmark_master\app\views\posts

さきに宣言しちゃいますと、今回はviewの内容が難しいです。
データの追加なので、今回はcakephpでのフォームの作り方がメインになるかと思います。
Cakephpでの独特のフォームの書き方　formヘルパーを覚えていきましょう。

formヘルパー　formの作り方。

Cakephpでformを作る時のポイント

actionは自分自身(/bookmark_master/posts/add)
methodは”post”にしたいが、Cakephpのformのデフォルトはgetである

まずはformの枠から作っていきましょう。

formの書き出し

<?php echo $form->create('Post', array('type' => 'post')); ?>

formの終了

</form>と、HTMLでは書けば終了ですが、Cakephpのformヘルパーでは少し書き方が違います

<?php echo $form->end('登録'); ?>

これでformの外枠ができました。

Cakephpでformの部品を作ろう

まずはtextフォームから。手始めにタイトルの投稿フォーム。

<?php echo $form->create('Post', array('type' => 'post')); ?>

<?php echo $form->input('title'); ?>

<?php echo $form->end('登録'); ?>

するとこんな感じ。

<?php echo $form->input(‘title’); ?>
これだけのPHPのスクリプトを書いただけで、なんとこれだけのソースが出力されます。

input type=”title”のソース

<div class="input text"><label for="PostTitle">Title</label><input type="text" id="PostTitle" maxlength="50" name="data[Post][title]"/></div>

これだけHTMLがずらずら書かれてしまうと、アレンジが効かせずらいと思いませんか？とりあえずフォームの部品だけ出したい、labelも余計なdivもいらない、maxlengthも自分で書きたい。そんな時はどうしたらいいでしょう。

input type=”text”のアレンジ

<?php echo $form->input('title',array(

'label'=>false,

'div'=>false,

'maxlength'=>false

)

);?>

この状態でソースをプレビューしてみましょう

<input name="data[Post][title]" type="text" id="PostTitle" />

とってもシンプルになりました。これで色々アレンジしやすいですね。さらに、デザイン側の仕様でクラスを追加したいこともあるでしょう。

input type=”text” クラスの追加

classが一つの場合は下記のようになります。

<?php echo $form->input('title',array(

'label'=>false,

'div'=>false,

'maxlength'=>false,

'class'=>'hoge'

)

);?>

クラスが一つだけとは限りませんね。複数追加したい場合は以下のようになります。

<?php echo $form->input('title',array(

'label'=>false,

'div'=>false,

'maxlength'=>false,

'class'=>'hoge hogehoge'

)

);?>

ちょっと意外なのですが、クラスを複数指定したい場合はこのように半角をあけて続けて指定すればよいのです。これでinput type=”text”の詳しいアレンジ方法が分かりましたね。

formヘルパーでselectタグの作り方

残りはselectの作り方です。選択項目をarrayにて代入します。(一行目→７行目に代入)type’ => ‘select’,で、セレクトタグになってくれます。emptyを指定することで、何も選択されていない、デフォルトの値を指定することができます。
後のlabelや余計なdivの排除についてはinput type=”text”とやり方は一緒です。

<?php $category = array('検索エンジン', 'ブログ'); ?>

<?php

echo $form->input('category', array(

'label'=> false,

'div'=>false,

'type' => 'select',

'options' => $category,

''empty' => __('----', true),

'class' => 'styledselect_form_1 required'



))

?>

完成したadd.ctp

<?php echo $form->create('Post', array('type' => 'post')); ?>

  <table>
<tr>
<th>タイトル</th>

  <td><?php echo $form->input('title',array(

  'label'=>false,

  'div'=>false,

  'maxlength'=>false,

  'class'=>'hoge hogehoge'

  )

  );?></td>
</tr>
<tr>

  <th>URL</th>

  <td><?php echo $form->input('url',array(

  'label'=>false,

  'div'=>false,

  'maxlength'=>false,

  'class'=>'hoge hogehoge'

  )

  );?></td>
</tr>

  <tr>

  <th>カテゴリー</th>
<td><?php $category = array('検索エンジン', 'ブログ'); ?>

  <?php

  echo $form->input('category', array(

  'label'=> false,

  'div'=>false,

  'type' => 'select',

  'options' => $category,

  'empty' => __('----', true),

  'class' => 'styledselect_form_1 required'

  

  ))

  ?></td>

  </tr>


</table>
<?php echo $form->end('登録'); ?>

プレビュー

次回はコントローラーを利用して、この作成したフォームよりデータが追加出来るよう編集していきたいと思います。

2011年05月03日| 未分類 WEBSTA

WEB制作で役立つ情報をのクリップをまとめたWEBSTA

近頃サイトの更新がおざなりになっていましたが、その間あるサイトを作っていました。

その名も『WEBSTA(ウェブスタ)』

すっかり使いなれたCakephp1.3を使って作りました。

今後このWEBSTA(ウェブスタ)では、主にPhoshopや使えるJavascriptプラグインなど、すぐにWEB制作に役立つ情報を発信していきます。

『ブログで記事を書くほどのことではないけど、みんなに伝えたいWEB情報』を『クリップ』していきたいと思います。現在英語版も作成中で、グローバルに対応できるサイトにしていきたいと思います。

また、現在作成中なのがユーザー認証機能でして、私の情報がクリップされているだけなのですが、今後はユーザー登録したみんなが自分の好きな情報をどんどんクリップしていきたいと思います。

例えば自分で、自分のためのイケてるサイト集ってWEBデザイナーの方ならあったらいいのに！と思うはず。
私もローカルサーバー内にCakephpで作成はしたのですが、みんながみんなそれだけのものを作れるはずがありません。

はてブに代表されるソーシャルブックマークも使っているんですが、それだけではためた情報がごちゃごちゃしてしまい、
もう少しスッキリ別けて、画像付で見やすく作っていきたいと思います。

ソーシャルブックマークをもう少しヘビーに使いこなしたい人向けのツールに育てていくのが今後の目標です。

あと、別の角度なのですが　新しい取り組みとして初めてHTML5とCSS3でサイトを作ってみました。
ブラウザサイズに最適な表示ができるように作っています。

今後このITかあさんはWEBに役立つツールやプラグインがCakephp入門、HTML5入門など、あらゆるWEB関連の入門情報サイトにシフトしていこうと思います。

WEBSTAの更新情報や、おもしろいクリップ情報がありましたらこちらでも公開していきたいと思います。

今後もITかあさん、さらにはこのWEBSTA(ウェブスタ)をよろしくお願いします！

« めちゃめちゃおもしろい携帯小説(？)を見つけた cakephpでブックマークアプリを作る(4)-1 »