こんにちは、フリーランスのweb制作者として活動しているしょーごです。
このページでは、JavaScript,jQuery特訓編について解説していきます。
JavaScript,jQuery特訓編について

は、その名の通り「web制作に特化したjQuery,JavaScript教材」です。
・web制作で頻出のjQuery、JavaScriptによるDOM操作実践
・jQuery,JavaScriptの書き方の違い
・デバッグ方法、開発の進め方

・ハンバーガーメニュー
・ドロワーメニュー
・ローディング
・スムーススクロールでページトップに戻るのボタン
・アコーディオン
・モーダル
・タブ
web制作のjQuery,JavaScript学習における課題
今回の教材作成はとある問題意識からスタートしています。
それは「web制作に特化したJS教材がない」ということです。
特に「実際にものを作りながら学べる教材が少ない」と感じていました。
そこで、この教材はweb制作でよくあるパーツを実装しながら、jQuery,JavaScript両方学べる教材にしました。
web制作で頻出のパーツなので、今回の教材でのコードは実案件で即使うことができます。
特に、「ハンバーガーメニュー」「ドロワーメニュー」などは実案件での使用率は70%超えぐらいで頻繁に使うので、今回作ったものは確実に資産になります(もちろん解答コードを実案件でそのまま流用いただいても構いません)
この課題は私が販売している「デザインカンプからのコーディング」の課題の一部なので、ここからコーディング課題について解説します。
デザインカンプからのコーディング課題とは?

デザインカンプからのコーディング練習課題は、実案件と同様のプロセスを経て、サイトを完成品として公開するところまで行っていただく、本格的なコーディング実践演習式課題です。
実案件では実装後に担当者のチェックが入るのが基本です。
そこで、この課題では現役エンジニアによる「2回の表示確認特典」をつけています。

また、全課題ポートフォリオとして利用OKです!!
各コーディング課題の中身
実際に制作するものは以下になります。

同梱されている課題の違い
このサイトで販売している商品は大きく3つあります。
- 全部盛り→全ての課題を同梱
- 中級以上→中級以上の課題を同梱
- 即戦力編→中級Ex、上級、Photoshop編を同梱

実はnoteの方では各課題のバラ売りもしています。しかし、こちらでまとめて購入していただくことで
- バラ買いよりも大幅に安くなる(最大20%)
- 限定特典がつく(リンク先で解説)
こういったメリットを提供しています。
更に詳しい情報は以下の販売ページにまとめています!
デザインカンプからのコーディングが未経験の方はこちらから御覧ください。
\20%オフ!!初心者から即戦力レベルまで一気に!!/
すでにデザインカンプからのコーディング経験がある方は、以下を御覧ください。
\15%オフ!!実務即戦力レベルまで一気に!!/