初心者のjQuery学習におすすめ!『jQueryデザイン入門』【プログラミング学習記録⑦】

プログラミング学習記録シリーズ

この記事は、プログラミング初心者がHTML/CSS/PHP/Wordpressを学習して、仕事にするまでの過程を綴るシリーズです。

こんばんは、プログラミング初心者の氷犬です。

 

前回の記事はこちら⇒自分のブログをコーディングしてみました【プログラミング学習記録⑥】

 

HTML/CSSを使うとWebページのデザインができます。

しかし、HTML/CSSだけではWebページに凝った動きをつけることができません。

「Webページに動きをつけたいな」と思ったときに使うのが、JavaScript/jQueryです。

 

この記事では、初心者がjQueryの学習を始めるのにおすすめな『jQueryデザイン入門』をご紹介します。

Web制作の現場で使うjQueryデザイン入門[改訂新版]

こんな人におすすめ

  • HTML/CSSの基本は理解している
  • 簡単なWebページのコーディングはある程度できる
  • Webページに動きをつける方法を学びたい

jQueryとは?【JavaScriptのライブラリ】

Webページを作っていると、「この部分ちょっと動かしてお洒落にしたいな~」と思うことがあります。

しかし、HTML/CSSはあくまでも「構造」と「デザイン」を作るための言語なので、ページ自由に動かすことができません。

そこで使うのがJavaScriptというプログラミング言語です。

 

JavaScriptとは、単純にいうと「HTML/CSSを動かすための言語」ですね。

HTML/CSSでは、タグにclassやidという属性を記述しますが、JavaScriptを使えばそのタグや属性のCSSを書き換えたり、付け外しできたりします。

 

しかし、JavaScriptはプログラミング言語なので、初心者には扱いが少し難しいです。

さらに少しの動きでもコードの量が長くなってしまうことがあります。

 

JavaScriptでよく使うコードをまとめたものをライブラリといいます。

そのライブラリの中でも、世界でよく使われているものが「jQuery」です。

jQuery公式サイト

まあ、最近ではjQueryの人気も落ち着いてきたようですが、まだまだ使われているライブラリなので学習しておいて損はありません。

まずはProgateで学習するのをおすすめします【Javascript/jQuery】

jQueryはJavaScriptのライブラリなので、扱うにはある程度JavaScriptの基礎知識が必要です。

「JavaScriptのことなんてまったく知らない」という方は、まずProgateでJavaScriptとjQueryのレッスンを1,2周することをおすすめします。

JavaScriptとjQuery、合わせて8レッスンなので、1周につき8時間もあれば終わるかなと。

(この記事を書いている現在では、JavaScriptのレッスンの仕様が少し変わっています。)

1周だけだとなんだかよくわからないと思いますので、2週するとなおいいですね。

 

Progateがいいのは、ブラウザ上で学習・コードを書く・動かすの3つがすべて完結すること。

環境の構築などの余計な手間がかからず、大事なポイントだけサクッと学ぶことができます。

ドットインストールを使ってもOK

「Progateだけではちょっと不安が残るなぁ」という人はドットインストールも合わせて使うといいでしょう。

ただ、ドットインストールは自分でフォルダを用意したり、ブラウザで確認したりする必要があるので、Progateと比べるとスピード感に欠けるかもしれません。

初心者におすすめな『jQueryデザイン入門』

Web制作の現場で使うjQueryデザイン入門[改訂新版]

Progateやドットインストールで、JavaScriptの基礎とjQueryを軽く学習したら『jQueryデザイン入門』を購入しましょう。

『jQueryデザイン入門』は2013年に改訂された本で、2018年現在には少し古い内容もありますが、とてもよい本です。

 

値段が3,000円ほどしますが、中古で安く出品されてるのであえて新品で買わなくてもいいと思います。

僕は配送料込みで1,000円ほどで購入しました。

汚れや書き込みなどなく、とても綺麗なものが届きましたよ。

 

この本ではこんな内容が学べます↓

『jQueryデザイン入門』で学べる内容

  • jQueryとは?【jQueryの基本】
  • セレクターの使い方
  • メソッドでHTML/CSSを操作する
  • タイミングの取得:「~した時にHTML/CSSを動かす」
  • 現場で使えるデザインレシピ【実践編】

実際に手を動かしてコードを書いてみることで、「jQueryって意外と難しくないなぁー」と感じることができます。

実際に使ってみた感想【メリット・デメリット】

実際に買って使ってみた素直な感想はこちら↓

  • 全編カラーでとても見やすい
  • コードの内容がしっかり解説されているので、難しく感じない
  • 2013年改正なので、内容が古いところがある
  • ボリュームが少ないので、もう1冊別の本をやってもいいかも

全体的に綺麗でよくまとまったいい本だと思います。

ただ、内容が少し古いのと、ボリュームが少なく感じたので、この1冊だと足りないと思いました。

 

jQueryはWebページ全体ではなく、使いたいところにポイントで使うものなので、あまり連続でスラスラ進める感じはありません。

  1. HTMLで構造を書く
  2. CSSでデザインする
  3. jQueryのスクリプトを書く

本当ならゼロから書くのが1番いいのですが、時間がかかりすぎるので、僕はjQueryの部分だけゼロから書く形で勧めました。

まあ、HTML/CSSを学ぶ本でもないですからね。

内容がわかれば十分OKかと思います。

本の内容はこんな感じです

カラーで見やすい

コードの内容も1行1行丁寧に解説されています

『jQueryデザイン入門』はよくまとまっていて良い本です

JavaScriptやjQueryはプログラミング言語ということもあり、取っつきにくい印象がありますが、この本を1周するだけで「jQueryは簡単」と思えるようになりました。

とにかく手を動かしてやってみるのがコツです。

「jQueryって何で学べばいいんだろう?」と悩んだ方には、ぜひこちらの本をおすすめします。

Web制作の現場で使うjQueryデザイン入門[改訂新版]

 

次回はこちら→【Flexboxも】Webページの模写コーディングをしました【プログラミング学習記録⑧】