モナッピーカードをjquery対応しました

今回は、モナッピーカードを改良したお知らせです。

モナッピーカード

モナッピーのメモログを名刺風に表示するサービスです。最初は最新３０件のみでしたが、全メモが見えるようになりました。（R18は表示してないので、正確には全部ではないです）

モナッピーカード

前回からの改良点など

大きな変更はjqueryを用いた最新３０件でなく、過去のメモもさくさく見えるようにしたところです。

• 過去のメモを閲覧できるようにした。前は最新３０件のみだったが、３１件目以降も表示
• ページナビゲーションにより、最新ボタン、前へ、次へボタンで操作が可能。
• 新着メモ順は変わりなし。スクロールして見ていって上部へ戻るというユーザー操作を想定。

ソースコードというか中身はphp処理よりもjquery処理が多くなったのでコーディングとしてはそっちが大変でしたね。まあ勉強になったので全然楽しいです。

今後の課題

概ねやりたいことはやれたかなというところですが、前回の課題にもあったようなことは全部出来たわけではないです。

• メモのテーマは表示してない。仕様変更でテーマ→タグとなっており、８個の最大タグを想定するのは大変かも。ただbootstrapのタグボタンは使いたい衝動が出てきた（笑）
• jqueryでやってしまったけれど、そもそもphpフレームワークは勉強してみたい。書き直すというかphpフレームワークでやるとどうなるかそこらへんも勉強がてらやってみたい。モナッピーカードでやってもいいし、他の別のプログラムを作ってやってもいいしこれは気分次第。
• 現在1ページで最大30件表示であって、ページによっては28件とか30件表示されていない。これは30件が一回のAPIリクエストでの取得最大数のためで、かつR18投稿があるためそれを除外している処理を入れているため。解決策としては、例えば現時点の表示29件なら1件を再リクエストして取得して表示するなどが考えられる。ただ連続してR18投稿の可能性もなきにしもあらずなので、再リクエストの取得件数をいくつにするかは悩むところ。また、再リクエストで仮に30件取って1件を追加したところで、残りの件数をどう2ページ目に回すかは結構悩ましい。かなりごちゃごちゃしそうなので今回は放置。
• ページネーションを下部にもつけようとしたが単純に上のコードをコピーでは動かないっぽい。この動きのロジックなどはわからないため、下部でのページネーションはひとまずなしで。

気づきや学び

• jqueryやJavascriptまわりは非常に勉強になった。前よりはjqueryの理解が深まった気がする。イベントの発生順とか、グローバル変数とか、moment.js使ってみたりとか。
• bootstrap4での中央寄せやレイアウトなどは色々いじっていると分かってきたことも多い。意外に中央寄せが難しいというか分からないことが多い。
• 処理やロジック時でイケてない書き方も多数ありそうだが、一先ずは動いて完成させていくほうを優先するところは大事
• カード風レイアウトはbootstrapのサンプルコーディングなどでもあったのが衝撃的。まあそのサンプルレイアウトとかではないんだけど、なるほどなあと。逆にいえばレイアウト迷ったらサンプルを使って当て込んでいくことで一定のデザインにはなるのは便利。tipmusicは音楽投稿投げ銭サービスでbootstrapを使っている感じだけどキレイ目でいい感じ。
• 細かいことはもっとあるけど、一先ずアイデアを形にしていくことでプログラミングをもってする、ということはやりきらないとダメだなという感じ。やり切ったので後はこれを元に改良していけばいいのか、０から１なのかでは全然違ってくる。

おわりに

アウトプットネタが貯まってるのでまた書いていきますが、軽く言えばアイデアとプログラミングの関係は、アイデアは言葉で言えばコストはほぼゼロです。もちろんアイデアを思いつくとか練るなどはコストかかります。とはいえそれを１としたとき、プログラミングはどうなのかというと、具現化する行動は最低１０倍、完成していくには１００倍くらいかかるのではないかというところです。

つまり、アイデアを言うは１しかからないコストが、形にしていくというところで１０はいるわけですね。イメージとして、プログラミングスキルとか既に出来ているものにもよるわけですが、「ちょっと過去ページ見えるようにしてよ」は、ものすごい簡単です。以前のバージョンではできなかったので改良したわけですが、多分初めてということもあって軽く１０時間くらいはかかっています。人がどうでなく自分が言うのは簡単だけど、それをやるとしたらまあ１０時間はかかるよねという話でもあります。

ではこの１０時間かかった改良の価値は１０時間分の自分の時間をお金に変えてくれるのか？というと、まあそういう簡単な話ではありませんよね。ですが、学びと気付きからここからさらに色々とプログラミングで形に出来るわけですから、これは楽しそうだなと感じました。

次同様のことをやれば１０分の１とはいいませんが、それくらい時間が短縮出来ます。また同様でないけれど類似のことや近いプログラムも初めてであってもかなり時間を短縮出来ます。また見せ方を変えていくことで全然違う事もできそうですね。マネタイズを考えていくのもアイデアだけでなく実際に試せるので面白そうですね。

今回は以上です。