Part6:投票機能の実装

海未「では仕上げです。前回までに作ったアプリケーションに投票機能を追加しましょう」

海未「まずはviews/index.jadeをこのように」

海未「グループ名をクリックすると1票入るようにします。それから、グループ名の横に得票数を表示します」
ことり「voteって新しいコントローラを作るんだね」
海未「はい。投票はhttp://localhost:3000/vote/5683cdd0bc0ed56cd0935ca4のようなURLにアクセスすることで行われるようにします」

海未「コントローラですが、routes/vote.jsを作る・・・のではうまくいかなかったので、routes/index.jsに書き足す形にしました」

海未「/vote/:idのように書くと、末尾に値のついたURLへのリクエストを拾うことができます」
穂乃果「じゃあ、どんなidがついててもこの1つのハンドラが呼び出されるんだ」
海未「はい。:idに相当する部分はハンドラ内でreq.params.idで取得できます」

海未「では最後、DBの更新処理です。Group.updateがそれですが、少々ややこしいですね」

海未「最初の引数は検索条件です。この場合、_idがURLで渡されたidと一致するデータを更新します。投票対象のグループの特定ですね」
ことり「うん、ここはなんとなくわかったんだけど・・・」
海未「次は得票数を増やす指定です。$incはincrement、指定されたプロパティの値を増やします。この場合、votesの値を1増やすよう指定しています」
ことり「ここが、値を変更する部分なんだね」
海未「その次はその他オプションの指定で、今回はおまけ程度ですが・・・検索条件に合致するデータが複数あった場合、1件しか更新しないようにしています」
穂乃果「あれ、そもそもidって重複しないようになるんじゃなかったっけ?」
海未「そうです。ですから、これは念のためレベルですね。最後は終了時のコールバックで、エラーがあったらそれを先の処理に伝播させています」

海未「これで投票機能もできました。トップページで適当にグループ名をクリックしてみてください」
ことり「・・・わっ、ちゃんと票も入るし並び順も変わる!」
穂乃果「デザインは寂しいけど、動きはそれっぽいね!」

海未「これで投票サイトとしての基本機能はできました。しかし、誰でもグループを追加できる仕様はあまり好ましくないですね」
ことり「こういう場合って、ユーザ登録とかするよね」
海未「そこで、投票は誰でもできることにして、グループ登録はログインが必要な仕様に変えてみましょう。次回はそのセッション管理機能を実装してみます」


LINEで送る
Pocket


返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です