細かすぎて伝わらない #金子本 の工夫ベスト5

pixivエンジニアが教えるプログラミング入門 (星海社新書)

pixivエンジニアが教えるプログラミング入門 (星海社新書)

『pixivエンジニアが教えるプログラミング入門』で多分細かすぎて伝わってないだろうけどやった工夫ベスト5を紹介します.

第5位 グローバルの.gitignoreで.DS_Store・Thumbs.dbを登録する

Mac だとこれをコミットするミスを犯しがちなので最初からミスするとわかっているなら防ぐべきです.初心者はどこかでハマればプログラミングが嫌いになります.少しでもハマりどころは少なくすべきです.

catatsuy/support_programming

またここでさりげなくエディタを nano にしています.

第4位 CSSの指定にはclassをさりげなく推奨

本書の CSS の部分にさらっと以下の記述があります.

CSS の指定には class の方が使い勝手が良いので常に class を使うことをおすすめします。

id と class を紹介すると初心者はどちらを使えばいいのか迷います.迷うくらいなら何も考えずに class を使うべきなのでそれを常識にしてもらうためにさり気なく書きました.意外とこのことが書かれている本は少ないと思います.

第3位 条件を限定して断定する

初心者に教えると物事を簡略化しすぎてしまい少し嘘が交じることもあります.嘘をつきたくないがあまりに思わず『ほぼ』とか『大体』とか付けてしまいがちです.ただそういう言葉を付けると信用をなくしますし教えられている側のやる気がなくなります.極力言い切った方がいいです.

そこで言い切るために条件を加えて言い切りました.技術書ではなく新書なので完全なる正確性よりもわかりやすさや実用的であることが重要だと思っているのでこのような選択をしました.

具体例を挙げると以下の文章です

ブラウザが送るリクエストには GET と POST の 2 種類があります。

Mac だと curl も使えるので GET と POST 以外も送れますがブラウザの HTML からでは GET と POST しか使えないので基本的に初心者にはそれ以外のメソッドの存在は示唆しない方がいいです.GET と POST しかないと言い切るために前に『ブラウザが送る』と付けました.

他にもいくつかありますが極力新書のレベルで言い切れるものは言い切りました.叩かれる危険性は高まりますがそれよりも読者に対するわかりやすさを取りました.

第2位 CSSのcontentで★を付ける

本書では最後には◯なスターみたいな機能を付けますがこの時数字の横に書かれている★は以下のように CSS で付けています.

.add-star:before {
  content: "★";
  color: yellow;
}

どうしてこうやって HTML に直接書くのではなく CSS で付けるのかは本書に書かれていませんがこれには重要な意味があります.それは span タグの中をスター数のみにすることで JavaScript を短くすることができます.どれくらいかというとたったの 16 行です.

sinatra_keijiban/main.js at master · catatsuy/sinatra_keijiban

★を CSS で付けることで成功時の処理は $this.text(data['star_count']); の一行のみです.これ以上短くすることは不可能と思います.

これをひらめいたときはこれで JavaScript を極限まで短くすることが出来るということに気付いて笑いが止まらなくなりました.CSS にこんな使い方があるということを頭に入れておくとどこかで役に立つかもしれません.

第1位 max-widthとmax-hightを使って画像のサイズを柔軟に指定する

当初研修内容を考えているときに私が試しに作った画像投稿掲示板はサムネイル画像を作成するなどの概念がなかったために画像サイズがバラバラな上に写真などを投稿すると大きすぎて満足する動きをしてくれませんでした.

どうすればサムネイル画像を作らずに様々なサイズの画像に対応できる画像投稿掲示板をサーバーサイドの処理を複雑にせずに動かすことが出来るのか?を真剣に考えてひらめいたのがこの max-width と max-hight でした.言われれば当然ですがこれを思いついたときは感動してプログラミング研修の成功を確信しました.これを使うことでとりあえず画像を表示しさえすればいい感じになるという初心者が作る画像投稿掲示板としては都合の良すぎる動きをしてくれます.

このことに気付かなければ書籍化は間違いなくなかったでしょう.

まとめ

今回金子本で行った細かすぎる工夫を紹介しました.

細かいながらもやらなければこの本が成立しない重要な要素です.既に気付いた人もいるようなのでそんなに細かすぎないかもしれませんが

というわけで興味があればご購入よろしくお願いします.

pixivエンジニアが教えるプログラミング入門 (星海社新書)

pixivエンジニアが教えるプログラミング入門 (星海社新書)