jQueryが使えると、サイトにアニメーションなどのいろいろな動きを簡単につけることができます！
でもjQueryってプログラミング学習始めたばかりだと、いまいちよく理解できないですよね。
自身の学習のアウトプットと、これから学習をする初心者の方にもわかるように、まとめてみました！
jQueryとは、JavaScriptのライブラリです！
jQueryはHTML、CSS、JavaScriptと同じようなプログラミング言語ではありません。
jQueryとはJavaScriptのライブラリです。
こちらのサイトにわかりやすい例えがありました！
ライブラリというのは英語で「図書館・書庫」といった意味がありますが、ここで出てきたライブラリというのは「よく使う機能をパーツ化してまとめたもの」という意味です。
JavaScriptのライブラリ、と呼ばれているだけあってまさに「図書館」のようにJavaScriptの利用度の高いものをギュッとまとめたものなんですね。
jQueryを使うと、HTMLやCSSだけでは表現できない動きのあるサイトを作ることができます。
もちろんJavaScriptでもできるんですが、jQueryを使うメリットがあるんです！
説明していきます。
jQueryを使えば短いコードで実装でき、効率化アップ！
jQueryはJavaScriptで利用度の高いものを、jQuery専用の「命令文」として用意してあります。
そのためJavaScriptでコードを書くと長くなってしまうものも、短い記述で表現できるので簡潔かつわかりやすくなります！
書き手としては効率よくコードが組めます。
互換性があるのでブラウザを気にしなくていい！
ブラウザは1つではなく
✅FireFox
✅InternetExproler
✅Safari
と種類があります、JavaScriptの場合はそれぞれのブラウザに対応した記法を意識してコードを書かなくてはいけないので難易度が上がります。
その点jQueryはブラウザ間での差異が出ないよう作られているので、とても扱いやすいというメリットがあります。
jQueryの書き方の基本
jQueryはシンプルな作りになっています。
＄（’①セレクタ’）.②メソッド（引数）③；
①‥HTMLのタグ名やclass名を指定
②‥指定したセレクタをどのようにするかを書く
③‥JavaScriptなので文末のセミコロンを忘れずに！ちなみにコメントもJavaScriptと同様で//を用います。
jQueryのファイルをindex.htmlに読み込ませよう
jQueryのコードを書くまえにファイルを読み込ませる必要があります。
index.htmlの<head>タグ内に以下のコードを読み込ませましょう！
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
ちなみにファイルをjQueryのサイトから直接ダウンロードしてから読み込ませる方法もあるみたいですが、ひとまず今回はGoggleの配信しているものを使う方法を紹介しています。
jQueryのコードを書く場所を決めよう
jQueryのコードを書く方法は２種類あります
もう1つは別のファイルを作ってそこに書く方法だよ
①index.htmlの中に書く方法
</body>の直前あたりに以下のコードを書きましょう。
<script type="text/javascript"> /* この中にjQueryのコードを記述 */ </script>
②別のファイルを作る方法
<head>タグ内に以下のコードを書きましょう。
<head> <!-- 先にjQueryを読み込む記述を書く --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script type="text/javascript" src="js/sample.js"></script> </head>
ちなみに別ファイルを作った方がHTMLのコードが長くなりすぎず、わかりやすいのでオススメです。
実際にどのように書くのか例をみてみよう
今回はjQueryのメソッドの1つ「slideUp」を使ってみます！
このメソッドを使うと指定した要素がこんな動きをします↓
書き方は以下の通りです
index.html
<div class="name">つるぴよ</div>
nameクラスをつけた「つるぴよ」という文字に対して動きをつけます。
script.js
$('.name').slideUp(1500);
slideUpの後ろの（）に入れた「1500」は秒数を表しています。
jQuery学習のオススメな方法
jQueryの学習におオススメな方法をご紹介します！
YouTubeや学習サイトを使う
ブログでも情報が多いのでオススメですが、YouTubeだと動画で学べるので勉強になります。
動画を見ながら実際にコードを書いて手を動かすと身につきやすいです！
また、学習サイトなら「Progate」や「ドットインストール」が有名です。
無料でいくつか受講できるので、それをやってみてから有料に移行して学習していくといいでしょう。
プログラミングスクールに通う
ある程度独学で進めてみて行き詰まって来たらプログラミングスクールに通うという手もあります。
独学の方がお金はかかりませんが、プログラミングを勉強して稼ぐことを目標としている場合は時間がかかってしまうのでスクールに通う方が良い場合もあります。
スクールのオススメとしてはYouTuberとしても有名な「マコなり社長」が運営するプログラミングスクールの「TechAcademy（テックアカデミー）」です。
完全オンラインスクールなので、自宅でもプログラミングやアプリ開発を学ぶことができます。
受講生の転職サポートも行っているのでスキルを身につけてエンジニア職につきたい人にもオススメです。
無料体験、カウンセリングもあるので試しに受けてみて自分に合っているか確かめてみると良さそうです。
jQueryを使えば動きのあるサイト作りが楽になります！
私自身プログラミング学習を始めて、JavaScriptあたりでつまずきました。
HTMLとCSSと比べると複雑に感じたり難しいですが、それを助けてくれるのがjQueryです！
jQueryのことがわかってくるとサイトにつけたい動きが簡単につけられるようになるので楽しくなってきます。
プログラミング学習は暗記する必要はなく、実際は作りながらググって調べることができるので検索力をつけつつ学習していきましょう！
