100日プログラミングとは

100日かければなんとかプログラムが勉強できるのではないか、 という仮説から、100日間だけ がんばって勉強を続けられるようにする企画です。 基本的には5人1組でやっていき、 お互いに進捗を報告することで、モチベーションを高めていきます。

詳しくはこちらをご覧ください。

cakeがだいぶすすみましたよ

2007/11/28 水曜日 - 0:48:00 by kensuu

けんすうです。
月曜日更新なのに、忘れていました・・・。
しかし勉強のほうはすすんでおります。

さて、前回「何を書いたらいいのかわからない」
という声があったのですが
以下のブログでこんな言及をいただきました。


ソースが見たい - ANOTHER PIECES

「頑張った」、「苦労した」とかという話自体は結構どーでもよくて、むしろ大事なのは「頑張った結果こういうソースを書いた」、「苦労したけど、こういうソースが書けた」というのが欲しい。

ああ、おっしゃるとおりですね・・・。

ということで、ソースを貼り付けてみることにします。

しかし、1から説明するのも冗長になりすぎるし
説明が少なすぎても単にソース公開になってしまいます。
あまりに説明するのが下手すぎて
イヤになるのですが、お許しください。

僕が今、何をやりたいかというと

「個人の掲示板が持てるプロフィールサイトのようなもの」
をCakePHPで作るということです。

イメージ的には僕がやっているサイトである

自己紹介@milkcafe掲示板

を見てもらうと近いかもしれません。
個人の掲示板をたてて、そこで自由に交流するというものです。

というわけで、必要なDB。
これは

User
→ユーザー認証のために、メールアドレスとパスをいれる

Profile
→ユーザーの名前やプロフィールを入れる

Post
→掲示板への投稿データが入る。

というわけで、まずはユーザーページ周りです。
ユーザーページとは、mixiなどでいう、
他のユーザーから見た、ユーザーのトップページのことですね。

profiles_controller.phpは以下の通り。

<?php 
 
class ProfilesController extends AppController
{
 
    var $name = 'Profiles';
    var $uses = array('Post','Profile','User');
    
    //ページング用の数値
    public $view_default_limit = 5;
    
    //プロフィールのテンプレを上書き〜
    public $layout = 'profile_default';
    
    function index()
    {
        //セッション情報からログイン中のuserのidを取得
        $auth = $this->Session->read("auth");
        $cond = array('user_id' => $auth['id']);
        $this->set('profile', $profile = $this->Profile->findByUserId($auth['id']));
 
        //ページタイトル
        $this->pageTitle = $profile['Profile']['name'] . "のページ";
    }
 
    function view($to_user_id = null,$page=1)
    {
        //セッション情報からログイン中のuserのidを取得
        $auth = $this->Session->read("auth");
        $cond = array('user_id' => $auth['id']);
        $this->set('my_profile', $my_profile = $this->Profile->findByUserId($auth['id']));
        
        //ユーザーidをセットしておく
        $this->set('to_user_id', $to_user_id);
        
        //ユーザーIDの投稿画面&表示
        $cond = array('to_user_id' => $to_user_id);
        
        //データの数を数える
        $count = $this->Post->findCount($cond);
        $this->set('count', $count);
        
        //取り出すレコードの開始位置
        $st = 0;
        
        //ページング限界数をセット
        $lim = $this->view_default_limit;
        $this->set('lim',$lim);
                
        $page = !isset($_GET["page"]) || $_GET["page"] <1 ? 1 : intval($_GET["page"]);
        
        $st = ($page - 1) * $lim;
        //次の10件
        $next = $page + 1;
        //前の10件
        $prev = $page - 1;
        $prev = $prev <1 ? 1 : $prev;
        
        //ページングのやつを配列にいれてsetしちゃうよ
        $pages = array(
                'page' => $page,
                'prev' => $prev,
                'next' => $next
                );
 
        $this->set('pages',$pages);
 
        //とりあえず$postsにデータを入れる(最後の2はなんだ?調べる)
        $posts = $this->Post->findAll($cond, null, 'Post.created DESC', $lim, $page,2);        
        
        //新しいものを下にしたいので配列を逆にするよ
        //あきやん曰くarray_reverse使えのことなのであとで直す
        //$created = array();
        //foreach ($posts as $v) $created[] = $v['Post']['created'];
        //array_multisort($created, SORT_DESC, SORT_NUMERIC, $posts);
        
        //セット
        $this->set('posts', $posts);
 
        //pr($posts);
 
        //名前のためにprofilesをsetしないと
        $this->set('profiles', $profiles = $this->Profile->findByUserId($to_user_id));
        
        //ページタイトル
        $this->pageTitle = $profiles['Profile']['name'] . "のページ";
    }
 
}
    
?>

こんな感じ。

苦労したところは、アソシエーション部分です。

CakePHPでは、DBに対応するview、controller、model
を作っていくのですが、
当然、ページによっては複数のDBのデータを扱いたいときがあります。
それらをつなげるのがアソシエーションなのです。(たぶん)

アソシエーションの結びつきはmodel部分でやるのですが、
このユーザーページでは、ProfileとPostをつなげなくてはいけません。
さらに、ProfileはUserとつながっているという状態でした。

というわけで、各modelは以下の通り

Userモデル

<?php 
 
class User extends AppModel
{
    var $name = 'User';
    
      var $validate = array (
        'email' => VALID_EMAIL,
      );
    
    var $hasOne = array('Profile');
    
    var $hasMany = array(
                    'Post' => array(
                        'className' => 'Post', //クラス名
                        'conditions' => '', //抽出条件
                        'order' => 'Post.created DESC', //取得順
                        'limit' =>'3',    //最新3件までをUserと同時に取得
                        'foreignKey' => 'user_id',    //Post.user_idとこのモデルのidを条件に統合
                        'dependent' =>true,
                        'exclusive' =>false,
                        'finderQuery' =>''
                    )
                );    
 
}
 ?>

Profileモデル

<?php 
 
class Profile extends AppModel
{
    var $name = 'Profile';
    var $belongsTo = array(
        'User' => array(
            'className' => 'User',
            'conditions' => '',
            'order' => '',
            'foreignKey' => 'user_id'
            )
        );
}
 
?>

Postモデル

<?php 
 
class Post extends AppModel
{
    var $name = 'Post';
    var $belongsTo = array(
        'User' => array(
            'className' => 'User',
            'conditions' => '',
            'order' => '',
            'foreignKey' => 'user_id'
            )
        );
}
 
?>

という感じですね。

アソシエーションについての詳しい説明はしないとして、
一度ここでつなげてしまえば、
あとはcontroller内でデータを使えるようになりました。
ここまできて、今まで勉強してきた
PHPの知識とつながってきて
少し理解がすすんだなあ、と思います。

しかし、75日くらいの勉強内容として、
この進行度はどのくらいなのか少し不安になりますね。
100日終わるころには、
ある程度ストレスなくサイトができるようになっていればいいなあ、と。

※しかしプログラム勉強をブログで紹介するのは難しい。

エビにだめだしができるようになりましたよ。

2007/11/21 水曜日 - 6:00:33 by kazuhide

すっかり寒くなってエビの季節になりましたね。

今回は、エビのコメント機能を付けてみました。

shri.jpg

ShrimpME!

これでどんなに寒くなっても安心ですね。

いやぁ、本当に寒いですね

2007/11/20 火曜日 - 1:47:54 by kensuu

最近本当に寒いですね。
こんな日はプログラミングですね。

というわけで、今週はそこそこがんばりました!
12、3時間はやった気がします。
やっぱり一気にやると違いますね。

残り30日を切ってしまいました。
ラストスパートがんばりますよ!

というわけでやったこと。
現在、会員ごとのページがある
掲示板サイトを作ってみています。

必要な機能は

・会員ごとに掲示板を作れる
・会員登録している人だけが投稿できる
・会員は他の会員をお気に入りとして登録できる

あたりですね。
他にもやりたいことはありますが、基本的にはこれかと。

今回やったところは

・会員系機能を追加
・その会員ごとに投稿ができるように

主にこの二つです。

CakePHPでやっているのですが、
難しかったのが

1:複数のコントローラーをまたいだ処理
2:セッションを使ったログイン処理のデータの持ち方

あたりです。

いやぁ、しかしこのブログでどこまで技術の各論を書けばいいのか迷っています。
photoshopみたいにわかりやすく画像で説明できないのがもどかしい・・・。
読んでいてつまらないですよね、本当にごめんなさい。
やはり日々の記録はしていかないとダメですね。

次やることのメモとして

・会員機能のセキュリティ強化
・ログイン情報をクッキーで覚えておく
・ユーザーページの作成

あたりです。

で。

12月11日に新サービスをリリースすることにしました!
今しました!
最後の更新までにはリリースしちゃいます。
成果物としてこれを出そうと思っています。

プログラム歴70日くらいになったわけですけど、
90日目くらいで、ここまでのサービスができるようになったよ、
というのを見せられればいいなぁ、と。
3ヶ月あればそこそこできるとつたえられるようにしたい!

がんばります!

※いや、しかし今回の更新本当につまらないですね。
どうやっていけばいいんだろう。むむう。

こんな僕でもphotoshopでライトセイバーが作れた

2007/11/16 金曜日 - 4:22:27 by saiso

さいそうです。

前回さぼりました。
てへ(^▽^)

けんすう先生がかなりご立腹されていた模様なので、
今日はいつもより三時間早くアップしてみたいと思います。

今日はライトセイバー作りました。

春先ごろからずっとマスターレプリカ製のライトセイバーが欲しかったのですが、
永遠に学生をやりつづけている僕としてはお金がなさすぎて買えませんでした。
そんな中、僕から僕に朗報が入ったのです、さっき。

スターウォーズ ライトセイバーを描く方法

おおおおお!
こんなにすばらしいtipsなのに(しかもphotoshop系ではかなりわかりやすい方!)、
はてぶが僕だけ!
どんだけ!

というわけで、これなら余裕で作れるぜ思いながら作ってみました。

苦戦しました。

細かい作り方は上記の記事に任せるとして、
僕が苦戦したところだけお伝えしたいと思います。

その前に今回加工した写真の元です。

light.jpg

まずはstep2から。

四角形ツールを使って、イメージのどこかに長方形を作成します。

四角形ツールとは長方形選択ツールです。
意外とネーミングの違いだけでも初心者は心が折れるので、一応。

私は、30×1000としました。

いまだに
photoshopでピクセル幅とかどこで見たらいいのかわかりません。
Fireworksならすぐに見れるのに!
誰か教えてください!
という感じだったのでアバウトに長さを決めました。

step3から。

ここで、ライトセーバーの先端を少し丸めて、持ち手の角度に合わせて回転させます。
選択 > 変形へと移動してください。

選択変形じゃなくて、
編集変形でした!
これはバージョンの違いなのかな。

・step3にある最後の画像
選択範囲を移動したのはわかるのだけれど、
僕のCSだと選択範囲を指定したら
背景まで一緒に移動しちゃいました!
これが一番困った。

これが正しい方法なのかわからないけれど、
僕は選択範囲を右クリックして
“選択範囲をコピーしたレイヤー”
というのを選び、
選択範囲だけ逃がしてあげました。
そうすると背景がついてこず、
選択範囲だけきれいに移動できるという。
むずかしかった、、、

step6から。

前のレイヤーから選択範囲を表示します(Ctrl+Click)。

そういえばこれも迷った。
ググッたらでてきたので見事解決したのですが、
ここでいう前のレイヤーから選択範囲を表示とは、
右下のほうにあるレイヤーが同時に見れる箇所で、
前に選択範囲を指定したりして使ったレイヤーを選び、
選ぶ際のクリック時に
ctrl+クリックをするという意味だったのだ。
僕はてっきり前のレイヤーをとりあえず表示させ、
選択範囲を戻って出させて画像の上でクリックしてました。

一見あほっぽいのですが、
意外とひっかかりそう。
photoshop使いな人たちには常識かもしれないけれど。

step7から。

(オプション)このレイヤーを何回か複製していけば、さらに光彩が顕著になります。このようなイメージが作れましたか?

省略びつくり!
いきなり完成へ!
と思ったのですが、
この過程は試行錯誤しながら自分でやるのが
楽しいかもしれないと思いました。
しかし、数字を変えて二回いじっているレイヤーの工程を何回かやるのか、
最後のレイヤーの工程を複数やるのかは謎です。

とりあえず以下が完成作品です。

lightsaber.jpg
#握っているのはリモコンです

俺のライトセイバー、太!
短!
でも、固!
バリバリ日本人!

ヨーダ君のほうが、スタイリッシュだし、ジェダイぽいし、
なんか見ててむかつきます。
ああ、僕はやっぱりダークサイドなのね。

というわけで、
思いのほか楽しかったのでまた作ります。

さようなら!

エビが消えるイリュージョン

2007/11/14 水曜日 - 22:40:04 by kazuhide

もうすぐ年末ですね。御節にはエビが欠かせません。

大エビ、中エビ、小エビとエビもたくさんの種類があって迷いますね。かずのこと合うエビも要れば、雑煮とあうエビもいるのでTPOに分けてエビは使い分けたいものです。いそぎんちゃくと合うのもエビですよ。

さて、そんなエビは韋駄天くりびつイリュージョン。消えちゃうようになりました。

削除機能を付けました。しかも、誰でも消せちゃうというひどい機能です。こんな状態のまま公開していいのでしょうか。

sjh.jpg

↑各詳細ページの「削除」を押すと、削除できますですよ。

ShrimpME!

ということで、ラブリーなエビちゃんが消えちゃうマジックでした♪

ATARI SHOCK

- 1:18:36 by sokenpico

どもっ。そうけんびこです。
さぼりまくりまくりすてぃです。というかコミケムリ!!!
ってことで目標変えます。

とりあえずCGを一枚仕上げる!!!
下方修正ーッ☆コミケは来期の夢とする。

ということで、なんとかモティベーションを保ちたいのです。
モティベーターって馬がいたなそういえば。

で、びこたん全く絵を描く時間も作らず、OL稼業にばっかりいそしんでおりました。昼はルミネ、夜はエステ。
そんな丸の内のOLであるびこたん。
で、ペンタブです。

もう紙やだ!!
ってことでペンタブレットを使って書いてみました。
dameyan.gif
むずかしい、っていうかズイムー。こんなのムリ!!
ってことで、がんばってPOSE MANIACSしてみた。

のが、これね。ぱっと見違いが解らないじゃない。
よく見てもわからないのよ。
っていうか違うのはわかるんだけど、どう違うかわからない。

で、照らし合わせてみました。
dameyan2.gif
ちょっwwwww
顔だけwwwww

っていう、私の目視の甘さ。なんだろう、全然場所が違うのね。
これでもアタリを付けてやってみたんだけど、なんというか
全然だめ。アタリショック!
びこたん目の付けどころがSANYOっていうか。
いや、サンヨーって結構センスいいのよね。
なので、目の付けどころがフナイっていうかまあそんなことどうでもよくて。

場所が全然違う!
ということで、もうちょっと見た方がいいのかもしれない。
空間把握能力がかけてるとしか言いようがないよネ。

いちおうパソ子でも絵が描ける事はわかったので、
ほんとに精進します。ほんとに・・・

ちょっと!みんなさぼりすぎ!

2007/11/13 火曜日 - 2:52:37 by kensuu

けんすうです。

ちょっと!最近全然更新されていないじゃないの!
みんなもっとがんばろうよ!ごめんなさい!

ということで、先週落として、
しかも最近ぐだぐだの僕が言ってみました。
残り36日ということで、ここは一番中だるみがするところ。
気合いを入れたい。

しかし、意外と最近やる気になってきていて、
cakePHPをすごい勢いでやっています。いい感じ。
100日プログラミングの45日〜60日目あたりは
かなりだらけるということがわかったので、
次回があれば、このあたりのてこ入れが必要そうですね。

さて、今週なにをやっているかというとですね、
cakePHPで新しいアプリケーションを作っています。

ideamiをcakePHPで作り直して
もっと機能改善!とか思ってたんですが
今動いているものを作り直すとなると
手間がかかりすぎて効率が悪いので、やめました。

代わりに作るのはプロフィールサイトです。
若者に人気のあれですね。

やりたいことは以下みたいな感じ。

1:プロフィールが公開できる
2:プロフィールはタグで追加して、タグでつながる
3:一言だけ書ける簡単ブログみたいなのがついている
4:気になる人をつっつける機能

こうなると、ログイン機能など必要となってきて
かなり、挑戦になってきます。
プログラム歴60日あまりの僕が出来るのでしょうか。

で、成果ですが、以下みたいな感じです。

milfile.png

できたことは

・ログインできる
・日記らしきものを投稿できる

です。いやぁ、感動。
生まれて初めて会員機能(ぽいの)を作れました。

たとえば、PostsControllerは以下みたいな感じ。

<?php 
 
class PostsController extends AppController
{
    var $name = 'Posts';
    
    function index($page=1)
    {
        //セッション情報からログイン中のuserのidを取得
        $auth = $this->Session->read("auth");
        $cond = array('user_id' => $auth['id']);
        
        //1ページに出す記事数
        define('LIMIT',5);
        
        //データの数を数える
        $count = $this->Post->findCount();
        $this->set('count',$count);
        
        $before = "";
        if($page>=2)
        {
            $before = $page -1;
        }
        
        $this->set('before',$before);
        
        //もしもリミット数×ページ数がデータ数より少なかったら
        $after = "";
        if( $page*LIMIT <$count ){
            $after = $page + 1;
        }
        $this->set('after',$after);
        
        $this->set('posts', $posts = $this->Post->findAll($cond,null,'Post.created DESC',LIMIT,$page));
 
        //ページタイトル
        $this->pageTitle = $posts[0]['User']['mail'] . "のページ";
        
    }
 
    function view($id = null)
    {
        $this->Post->id = $id;
        $this->set('post',$post=$this->Post->read());
        //pr($this->Post->read());
        
        //ページタイトル
        $this->pageTitle = $post['Post']['body'];
    }
    
    function add()
    {
        
        //セッションからログイン中のuserのidを取得
        $auth = $this->Session->read("auth");
        
        //入力データの形式を整える
        
        $data = array(
                'Post' => array(
                    'user_id' => $auth['id'],
                    'body' => $this->data['Post']['body']
                    )
                );
        
        if (!empty($this->data))
        {
            if ($this->Post->save($data))
            {
                $this->flash('投稿が完了したよ','/posts');
            }
        }
        
        //ページタイトル
        $this->pageTitle = 'ぴちぱくするページ';
    }
}
?>

全部を公開しようとおもったんですが、さすがに長くなるので、
これだけ公開してみます。
もうちょっと整理してしっかりと書ければいいのですが
とりあえず今は公表することよりも
自分のスキルアップ優先で・・・。

しかしcakePHPはすごいですね。
楽々書けてしまいます。
こんなんでスキルアップするの?
という不安はあるものの、
やり方を学んで、それから掘り下げるのも
一つの手かと思いますので、ちょっと引き続きやっていきます。

今週の目標としては

・プロフィールが編集できる
・プロフィール画像がアップできる
・気になるユーザーをつっつける機能搭載

あたりを目指します!

エビのロゴが入りましたよ。

2007/11/7 水曜日 - 22:16:28 by kazuhide

もうすっかり街はエビ祭りですね。

いずれにせよハロウィンではジャコやブラックタイガーになった人々が街を埋め尽くしました。こういうエビネタを引っ張れるのも2週まで。来週あたりがつらそうです。

ということで、今日はシュリンプミーも装いを変えました。冬装束ですね。

エビのロゴができました。さいそう大臣が作ってくれましたよ。

詳細

エビらしく、赤く、そしてはねている感じが好感をもてますね。本当いえばヒゲが欲しかったですが、あんまり欲を出してもいけないので我慢します。

m1.gif

あと、詳細ページにもテンプレートをはめ込みましたよ。エビだけに大量ですね。もうエビまっしぐら。

ShrimpME!

さて、シュリンプミーも、もはやクライマックス。最後までがんばります。

全然だめだったー!

2007/11/5 月曜日 - 23:54:18 by kensuu

いやぁ、今週は反省だ。反省しかない。

日曜日以外、ロクに勉強できなかった。中だるみとしかいいようがない。これはやばい。日曜日に焦って5時間くらいしたけど、それだけだった。

30分でもいいから毎日しないと!それだけは守らないと!と強く思った月曜日の深夜。

とりあえず今はcakePHPをやっているところ。PHPだとはわかっているんだけど、まだ自分の頭の中のPHPとcakePHPが結びついていない気がするんだ。これをなんとかつなぎあわせたい。

そして作りたいものが決まってきた。とりあえずはtwitterみたいなサイトを作れるようにしよう。コミュニティサイトがさくさくと作れるような自分になりたいのだ。

というわけで、全然勉強報告できずに申し訳ない、、がんばります、今週こそ!

エビのロゴを作ろうとしました

2007/11/2 金曜日 - 6:46:39 by saiso

さいそうです。

FFTA2をやっていたら危うくやり忘れるところでした。
またもや6時台。
あともう50日を切っているというのにいいのかこのままで。
いやしかし、この木曜日という日のためになにかを用意しようという心意気が大切だって最初に誰かが言ってたもん。

いいわけはこの辺にして、今日はロゴを作ってみたんです。
いまさらながら、WEB2.0ぽいロゴ制作とかしてみました。
なんかもう、恥ずかしいですね。WEB2.0とか。

というわけでとりあえず公開です。

ebi6.jpg

参考:
http://www.fxdesigning.com/web2txt.php

なんだかフォントは「Arial Rounded MT Bold」というのがWEB2.0っぽいと書いてあったので、
急いで探しにいきました。

これいいなあと思った画像からフォント検索ができちゃう以下のサイトが便利です。
WhatTheFont?!

さくっと10分くらいでできちゃいました。
こだわってみたポイントは、色です。
茹でたてのエビを表現したかったのですが、色でてるかなあ。

次はh2の小見出しみたいな素材でも作ろうと思います。