-本日のアジェンダ-
1限目
学科 jQuery基礎
jQueryの使い方について
2限目
学科 jQuery基礎
jQueryの導入
3限目
学科 jQuery基礎
課題制作
4限目
学科 jQuery基礎
課題制作
5限目
学科 jQuery基礎
課題制作
【講師用カリキュラム情報】
※このブロックは公開時は非表示になります。削除しないでください。
※講師用の情報（注記）を追記して頂いても大丈夫です。
ストーリー：それ以外の動きについて
内容1：jQueryの使い方
内容2：WEBページ作成⑬
内容3：
課題：なし
本日のテーマ
JavaScript(jQuery)についてです
jQueryについて
jQueryを利用する時の基本事項を理解し、自分のサイトに導入して動きのあるサイトを作りましょう。
参考サイト
【資料】
カリキュラム資料 ダウンロード用サイト
https://cu-doc.deau-ac.com/
下記のファイルをダウンロードしましょう。
JavaScript（jQuery）の教科書.pdf
【動画】
- JavaScriptとは？
https://youtu.be/H8dTOgqh8G4 (3:06) - JavaScriptあれこれ
https://youtu.be/QWzdF2_wGvI（14:59） - jQueryとは？jQueryの読み込み方法
https://youtu.be/RSQAgv0Y8ko（13:35） - jQueryの実装例
https://youtu.be/1m2TgevpIFU（10:01） - 覚えておくのはこの3点・ソースを見てサイトの仕組みは、もう分かる
https://youtu.be/dI8HTOjMSEU（10:23） - よく使うキーワードの一例とCSS
https://youtu.be/-KITTC1tBWI（13:58）
jQueryの利用方法（復習）
jQueryを利用する時は実装するための参考サイトを検索し利用方法を理解しましょう。
検索は、「jQuery （実装したいキーワード）」で検索します。
良く使うキーワードの例は、以下の通りです。
- スライダー
- カルーセル
- ハンバーガーメニュー
- ライトボックス
- ドリルダウン
- フェード
- スクロール など
参考サイト
- 動くWebデザインアイディア帳
- jQuery サンプル集 / Web Design Leaves
- 7つのサンプルでjQueryを学ぼう！「jQueryが全く分からない人のため」の超初級者向け入門講座
- jQueryでできること10選。動的サイトの制作やプログラミングを簡略化！
- 初心者でも簡単！jQueryのWeb制作術と自作プラグイン活用法 | 侍エンジニアブログ
- jQuery を用いたWeb デザイン
ワンポイントアドバイス
見本となるサイトがたくさんあるのがWebページの良いところです。
「こんな動きのページ作れますか？」のような依頼はよくあります。
その見本のサイトを解析できれば実装が可能です。
本日の課題
提出課題はありません。
就職活動に応じた作品制作、ポートフォリオのまとめやコーディングの続きを進めましょう。