HPを作ってみる 4
今回の変更点。
・全体
herokuでデプロイ
・TOP
ボックスでリンクを並べる
railsのときちょっとheroku触ったからスムーズにデプロイ完了。
しかしデータベースはローカルの設定しかしてないのでまだ。
HPを作ってみる 3
今回、実装した機能。
・全体
ロゴ作成
リンクを画像に置き換える
マウスオーバーで透過させる
デザインを背景赤に変更
HPを作ってみる 1
ページ構成
振り返り
ブログチュートリアルを写経してから長いこと画面とにらめっこしてなんとなくどういう仕組で動いてるかは理解できた。
ビューとコントローラーの関係性を理解するのにだいぶ時間を取られた気がする。
public functionでアクションを作っておけばビューを表示できる。
で、アクションの中に何か書いてあればその処理を先にやってからビューを表示するという流れ。$this->requestとかあったらそこ以降の処理はビューを表示してユーザーがリクエストを送ってからとなる。
鬼門だったのは $this-> とそのあとに続くPost。
Postはモデルのことを表しているそうだ。
あと、getとpostの違いがいまいちわからない。
一度、バリデーションが機能しないという事態に陥ってしまった。モデルのPost.phpがPosts.phpというように複数形になってたことが原因だったようだ。
今は自分のバンドHOT AICEのHPを作っている。
ブログチュートリアルを終えたら次はドットインストールをやればいいんじゃないかというアドバイスを頂いたのだが、「早く形として残るものを作りたい」という衝動に勝てず、今に至る。
次回からは、HPを作る過程を書いていく予定。
cakePHP-ブログチュートリアル 3日目
前回までで記事の一覧表示ができた。
今回は記事の投稿、編集、削除を実装していく。
addコントローラーを作成。
/app/Controller/PostsController.php
public function add() {
if ($this->request->is('post')) {
$this->Post->create();
if ($this->Post->save($this->request->data)) {
$this->Session->setFlash(__('Your post has been saved.'));
return $this->redirect(array('action' => 'index'));
}
$this->Session->setFlash(__('Unable to add your post.'));
}
}
addビューを作成。
/app/View/Posts/add.ctp
<?php echo $this->Form->create('Post'); echo $this->Form->input('title'); echo $this->Form->input('body', array('rows' => '3')); echo $this->Form->end('Save Post'); ?>
indexに"add"ボタンを追加。
/app/View/Posts/index.ctp
<?php echo $this->Html->link( 'Add Post', array('controller' => 'posts', 'action' => 'add') ); ?>
バリデーションの設定。
/app/Config/routes.ctp
public $validate = array(
'title' => array(
'rule' => 'notEmpty'
),
'body' => array(
'rule' => 'notEmpty'
)
);
editコントローラーを作成。
/app/Controller/PostsController.php
public function edit($id = null) {
if (!$id) {
throw new NotFoundException(__('Invalid post'));
}
$post = $this->Post->findById($id);
if (!$post) {
throw new NotFoundException(__('Invalid post'));
}
if ($this->request->is(array('post', 'put'))) {
$this->Post->id = $id;
if ($this->Post->save($this->request->data)) {
$this->Session->setFlash(__('Your post has been updated.'));
return $this->redirect(array('action' => 'index'));
}
$this->Session->setFlash(__('Unable to update your post.'));
}
if (!$this->request->data) {
$this->request->data = $post;
}
}
editビューの作成。
/app/View/edit.ctp
<h1>Edit Post</h1> <?php echo $this->Form->create('Post'); echo $this->Form->input('title'); echo $this->Form->input('body', array('rows' => '3')); echo $this->Form->input('id', array('type' => 'hidden')); echo $this->Form->end('Save Post'); ?>
indexに"edit"ボタンを追加。
/app/View/index.ctp
<th>Action</th>
...
<td>
<?php echo $this->Html->link('Edit',
array('action' => 'edit', $post['Post']['id'])); ?>
</td>
deleteコントローラーを作成。
/app/Controller/PostsController.php
public function delete($id) {
if ($this->request->is('get')) {
throw new MethodNotAllowedException();
}
if ($this->Post->delete($id)) {
$this->Session->setFlash(__('The post with id: %s has been deleted.', h($id)));
return $this->redirect(array('action' => 'index'));
}
}
indexに"delete"ボタンを追加。
/app/View/index.ctp
public function delete($id) {
if ($this->request->is('get')) {
throw new MethodNotAllowedException();
}
if ($this->Post->delete($id)) {
$this->Session->setFlash(__('The post with id: %s has been deleted.', h($id)));
return $this->redirect(array('action' => 'index'));
}
}
ここまでで記事の投稿、編集、削除ができるようになった。
最後に、
ルーティングの設定。
/app/Config/toutes.php
Router::connect('/', array('controller' => 'posts', 'action' => 'index'));
cakePHP-ブログチュートリアル 2日目
/app/ModelにPosts.phpを追加。
class Post extends AppModel {
}
/app/ControllersにPostsController.phpを追加。
class PostsController extends AppController {
public $helpers = array('Html', 'Form');
public function index() {
$this->set('posts', $this->Post->find('all'));
}
}
/app/Views/Postsにindex.ctpを追加
<h1>Blog posts</h1>
<table>
<tr>
<th>Id</th>
<th>Title</th>
<th>Created</th>
</tr>
<?php foreach ($posts as $post): ?>
<tr>
<td><?php echo $post['Post']['id']; ?></td>
<td>
<?php echo $this->Html->link($post['Post']['title'],
array('controller' => 'posts', 'action' => 'view', $post['Post']['id'] )); ?>
</td>
<td><?php echo $post['Post']['created']; ?></td>
</tr>
<?php endforeach; ?>
<?php unset($post); ?>
</table>
ここで
http://localhost:8888/cakephp/Posts/indexで表示を確認してみると、
日本語の部分が文字化けしてしまう。
/Config/database.phpの前回編集した部分の一番下に
//'encoding' => 'utf8',
とあるので、
'encoding' => 'utf8',
このように'//'を消してコメントアウトを解除して有効にしたら解決した。
/app/Controllers/PostsController.phpに以下を追加。
public function view($id = null) {
if (!$id) {
throw new NotFoundException(__('Invalid post'));
}
$post = $this->Post->findById($id);
if (!$post) {
throw new NotFoundException(__('Invalid post'));
}
$this->set('post', $post);
}
/app/Views/Postsにview.ctpを追加。
<h1><?php echo h($post['Post']['title']); ?></h1> <p><small>Created: <?php echo $post['Post']['created']; ?></small></p> <p><?php echo h($post['Post']['body']); ?></p>
ここまででデータベースから記事を引っ張ってきて見ることができるようになった。
記事一覧は
http://localhost:8888/cakephp/Posts/index
記事を見るには記事一覧のリンクから飛ぶか
http://localhost:8888/cakephp/posts/view/1 （末尾の数字は記事のid）
にアクセスする。
とりあえずここまで。
