【カレッジ体験記8日目】JavaScriptとjQuery

こんばんは。広報あーこです。
広報自ら、3ヶ月で未経験者をエンジニアに育成する自社のプログラミングスクール「プログラマカレッジ」を体験する企画の8日目です！

勉強を始めた経緯は、下記noteをご確認下さい。

9/13(学習8日目)の学習内容

まずは、今日の学習内容を振り返りから。

＜今日の学習内容＞
学習した言語：JavaScript／jQuery
学習範囲：JS演習課題の再提出、jQueryの書き方、イベントの種類、スライドショー作成
学習時間：4時間
達成率：29％(jQUery単元内達成率：100％）

JSの演習課題の再提出

Discordで講師から、先週提出したJSの課題に対して、下記のようなフィードバックが来てました。

講師からのフィードバックは、「出力結果が合っているか、合っていないか」という視点だけでなく、コードの書く上での心構えを合わせて教えてくれます！

今回は、「極力コードを少なく、シンプルに書くにはどうすればよいか」という点で、色々とフィードバックを貰いました。

また、課題の再提出には、「正解は、××です！もう一度直して再提出しましょう！」と教えて貰うわけではなく、「この問題をfor文を一回だけ使って、もう一度挑戦してみましょう！」というような形で、講師のヒントをもとに自分で再度チャレンジするというスタイルです。

結果、”正しい答えを自分自身で導き出すこと”を経験をできるため、記憶に残りやすいですし、何より達成感が大きいです！

そんなこんなで、課題を再提出をし、無事”合格”！
次のステージへ進むことができました！！

jQuery

簡単にJavaScriptの教材を見直した後、新単元のjQueryを勉強しました。

jQueryは、上記のように、Webページに様々な動きを加えることができるもの。JavaScriptでできることを、より簡単な記述方法で実現できように設計されたJavaScriptのライブラリだそうです。

講師のフィードバックにもあったプログラミングの大原則「よりシンプルに書くこと」を実現するためには、必要そうな知識ですね！

（１）ｊQueryの使い方・書き方

まずは環境設定を学び、それから基本的な書き方をマスター。
写経や練習問題で実際に書いてみて、記述方法に慣れていきます。

上記の動画は、「h1タグの色を青色に変える」を、jQueryの記述方法で書いたもの。「カッコ（）」や「；」の位置などが間違えやすいので、このように写経（＝右のエディターのコードを書き写す）をして身体に覚えさせます。

（2）様々なイベントの書き方

上記は、「クリックすると、フェードアウトする」というｊQueryですが、この「××すると」にあたる部分がイベントと呼ばれるもの。その他、「マウスをかざすと」「マウスを外すと」などがあり、その種類を学習しました。

これは書いている時より、動かした時が楽しいやつです（笑）

（3）スライドショーの作成

最後はスライドショーの作成。環境設定からやり、上記のようにプロっぽい動きをした時は、テンション上がります😊✨

まとめ

本日は、「いかにしてシンプルなコードを書くか」「それが何故大切か」を学びました。JavaScript然り、jQuery然り、動きはなんとなく理解できたので、あとは慣れと実践あるのみ！明日も頑張ります。