jQuery学習のステップアップ用に「作りながら学ぶjQueryデザインの教科書」

スポンサーリンク

作りながら学ぶjQueryデザインの教科書」は、2014年5月発売の最新のjQuery本です。PC本としては、増税後に初めて購入。

jQueryデザインの教科書

jQueryの本としては、以前に取り組んだ「ドーナツ本」として有名な「Web制作の現場で使うjQueryデザイン入門レビュー)」に続いての2冊目です。従って、両者を比較しながらレビューしたいと思います。

もくじ

  1. 1冊目としては厳しい?
  2. スマホ対応で、すぐ使えるレシピ集的な印象
  3. ダウンロードデータがめちゃ丁寧
  4. この本で学べること
  5. まとめ

1. 1冊目としては厳しい?

英語の勉強を例えに本書とドーナツ本を比べると、私は以下のような印象を持ちました。

「作りながら学ぶjQueryデザインの教科書」(本書)

1章毎にひとつの長文。それをいくつかのセクションにわけ、少しずつ読みながら、その中に出てくる単語や文法を解説。章が進むに従って、長文(及び単語と文法)のレベルが上がる。

「Web制作の現場で使うjQueryデザイン入門」(ドーナツ本)

前半で単語・文法・例文を学び、後半でその知識を使って長文読解の練習。


  • 長文→jQueryプログラムの実例
  • 単語・文法・例文→jQueryの作法や命令の基礎

作りながら学ぶjQueryデザインの教科書」とタイトルに謳っているだけのことはあります。実用的なjQueryコードを追いながら、その合間合間にセレクタやら命令やらを学ぶ方式です。

この学習方法としては、「鶏が先か、卵が先か」な議論になると思いますが、私は1冊目ならばこちらではなく、先に単語や文法を一つずつ学ぶドーナツ本のほうがいいと思いました。

こちらはドーナツ本。前半にjQueryの命令や文法を学ぶ。

こちらはドーナツ本。前半にjQueryの命令や文法をまとめて学ぶ。

というのも、本書を進めている間にも、「あれ?これってどうだったっけ?」と、ドーナツ本に立ち戻ることも結構あったからです。この本は、リファレンスとしてjQueryの書き方や基本的な命令を探すのには向いていないと思います。

こちらが本書。先にjQueryコードがあって、その後に解説。

こちらが本書。先にjQueryコードがあって、その後に解説。

レベル的にも若干難しく感じる部分もあり、全くの基礎がないとスムーズに進めにくい。

逆に言えば、「1冊目を終えてそれなりにjQueryは理解出来たけれど、まだまだ自分でろくなプログラムが書けない」人向けのように感じました。

2. スマホ対応で、すぐ使えるレシピ集的な印象

ドーナツ本の後半では、レシピ集を通してjQueryコーディングの実践を学びますが、それを更に実用的にした学習が本書では出来ます。

ドーナツ本ではjQueryレシピはスマートフォン対応になっていませんが、こちらは全ての章に於いて「どうやってスマホに対応させるか?」が細かくカバーされています。これは有難い。

jQueryデザインの教科書 スマホ対応

例えば、hoverの効果やサイドバーの固定など、スマホでは不要となる場合に、それらを無効化するjQueryコードなど。結構重要です。

ナビゲーションバーの固定・サイドバーの固定・モーダルウィンドウ(lightbox的効果)・スライダーなど、よく使うであろうjQueryを厳選して紹介。Ajaxの使い方についても深く掘り下げられています(ドーナツ本ではさわりのみ)。

jQueryデザインの教科書 ajax

ドーナツ本に比べるとより実践に近い上に、「プラグインに頼らなくてもいい」実用的なコーディング方法なので、自作サイトにもがっちり使えそうです。

ちなみに私は早速、この本で学習した「スマホ画面サイズでの振り分け」を、趣味のHTMLサイトで活用してみました。WordPressで言うwp_is_mobile等のPHPでないと出来ないと思い込んでましたが、いやはや、jQueryでも出来たとは。これだけでも買った甲斐ありました。

「サイドバー固定」に関しては、当サイトでも取り入れたかったのですが、本で紹介されている方法ではフッターがない場合のみだったので、すぐに実用出来ず。もう少し勉強して、自分でコーディングが出来るようになりたいところです。

3. ダウンロードデータがめちゃ丁寧

今やPCの参考書は実習用のダウンロードデータがついていることが当然ですが、こちらの本はそれがとても丁寧に作られています。

jQueryデザインの教科書 サポートサイト

具体的に言えば、全ての章の全てのステップ毎に、「before」と「after」が用意されている点。

同じ章の間であれば、前のステップから続けてコードの入力練習をしてもいいし、途中から始めたければそのステップから始めることも可能です。自分で打ったコードがうまく動かなかったら、「after」を見て違いを見比べればすぐです。

サポートサイトでもサンプルを見ることが出来ます。

作りながら学ぶjQueryデザインの教科書 ー 実習用サンプル

4. この本で学べること

  • スライダー・LightBox・ナビゲーション固定等の、普通に使える実用的なjQuery(しかもスマホ対応)
  • 最終的には、自分でjQueryを書けるようになるのが目標
  • ちょっとしたCSS3のテクニック

最後に挙げた「ちょっとしたCSS3のテクニック」も、結構細かいことですが「あれってこうやればよかったのかー」と目から鱗的なものもありました。

レベルとしては、やはりHTMLとCSSの基礎があることは必須で(jQueryを使おうとする人は皆さん出来ると思いますが)、jQueryは基礎から脱却したい人向けだと思います。

5. まとめ

たまたまjQuery参考書の2冊目として買いましたが、順序的にはやはり2冊目でよかったかなと思います。もう何周かこの本をやれば、レベルアップ間違いなしでしょう(英語などの勉強もそうですが、何冊もやるより1冊を何度もやるほうがよい)。

jQueryが全く初めてという場合は、ドーナツ本を1冊目として基礎を学んでから取り組んだほうが、よりスムーズに進むと思います。ただ、ドーナツ本は悲しいことに誤植がひどい(2013年7月の第2刷。その後は改善されていることを望む)ので、なるべく新しいバージョンの方がよいかと。

ちなみに、私はテキストエディタに最近話題?のAdobe「Brackets」を使用。リアルタイムでブラウザ上で変更が反映されるので、非常に便利です。もう一つ話題のSublime Textじゃなくても全然いいかも。

作りながら学ぶjQueryデザインの教科書

  • 出版社 SBクリエイティブ
  • 著者 狩野 祐東
  • 価格 ¥ 2,916
  • 発売日 2014/05/22

One Response to “jQuery学習のステップアップ用に「作りながら学ぶjQueryデザインの教科書」”

Copyright© 2017 Welcart カスタマイズ ブログ All Rights Reserved.