絶対他力

凡人の凡人による凡人のためのWebサービス開発

enchant.jsでJavaScriptの勉強をする事にしました_PWDD-160227

      2016/03/23

チームPocoです。
ポコ帳ワイヤーフレーム開発日記(PWDD)です。

JavaScriptの勉強に興味が持てず、どうすべきか迷ったのでGoogle先生に聞いてみました。

その結果、最終的に↓のサイトにたどり着いた…というか戻ってきました。
(最初の日記(PWDD-151225)での方針決定時にも参考にしています)

 

上記サイトでは…「enchant.js」というフレームワークを使って、ゲームを作りながらJavaScriptを勉強する事を提案しています。

現時点で、作りたいゲームは特に無いのですが…
それでもストップウォッチ等よりは面白そうなので、提案通りにやってみる事にします。

 

また、忘備録も兼ねて、今回の方針に至った経緯も記載しておきます。

まず、私たちが当初やりたかった事は、↓の画像のような「いいね!ボタン」を作る事でした。

いいね!ボタンを作りたかった

そこで、Google先生にそのやり方を聞いてみたのですが…
見つけられたのは↓のサイトぐらいでした。
(独自のいいね!ボタンではなく、本家Facebookのいいね!ボタンとの連携の情報ばかり出てきて困りました)

 

上記サイトによると…
以下の手順で作成すれば良いようです。

①ボタンのクリックイベントをJavaScriptのイベントリスナーに追加する
②イベント発生時に、個別ページのプライマリーキーをボタン自身やコンテナ等のdata属性orその他タグ情報から取得しておく。
③POSTまたはPUTリクエストにてバックエンドのリクエストを呼び、②で取得したパラメーターを送信する
④パラメーターをもとにデータベースやCSVなど一定のフォーマットに沿った保存領域に「オススメ数」を上書きする
⑤同一人からの多重投票を防ぐために、同一日・同一IPor同一ホストの重複をチェックしておくとなお良い
⑥単に上書きしたオススメ数のみをかえすのならtextを、URLなど複数情報を返す場合にはJSONをバックエンドから返す
⑦ボタンを設置したフロントサイドにて⑥のコールバックを受け取り、コールバック変数をもとにHTMLを再描画する
⑧これだけだと別サイトからのPOSTまたはPUTリクエストも通してしまうので、別途CSRF対策を施す

言ってる事が分かるのは➀だけで、➁以降はサッパリ分かりません(汗)

ただ、サイト内の前後の文章から類推すると、「jQuery」というライブラリと、「PHP」というプログラミング言語の話なんだと思われます。

そのため、それらの勉強を開始しようかとも思ったのですが…
JavaScriptの勉強を放置したまま、さらに新しい事に手を出すのは無謀だと判断し…冒頭に記載した通り、ゲーム作りをしながらJavaScriptを勉強する方針にしました。

この方針がベストなのかどうか正直よく分かりませんが、とりあえずやってみます。
(何か良い方法をご存知の方がいたら、アドバイス頂けると幸いです)

本日のPWDDは以上です。

 - PWDD