jQueryを学ぶ - コーディング講座

DOM、イベント、エフェクト、AJAXを通じてjQueryを学ぶためのアプリです。jQuery 3.7.1を内蔵し、オフラインでも端末上でページをプレビューできます。

収録内容

• 22のjQuery講座、48レッスン、A1–C1レベルに対応。アプリは22言語に対応

• ライブJS editor/IDE：HTML、CSS、jQueryを実行し、ページをプレビュー

• 20のデバッグミッション

• セレクターを練習する、ガイド付きHTML/CSSウェブページ制作プロジェクト20件

• 面接対策問題50問、クイズ50問、91項目のチートシート

• AIメンター：セレクター、エラー、AJAXをわかりやすい言葉で解説。必要に応じて、よりやさしい説明を繰り返し確認

• 修了証試験（Pro）

• ワールドコーディングチャレンジ：JavaScriptなどの言語で参加する世界共通のラウンドを毎日3回開催

• 連続学習記録、進捗管理、リマインダー

講座の流れ

• はじめの一歩：$関数と初めてのチェーン

• セレクター：基本、応用、DOMの走査

• DOM：要素の作成、挿入、移動、削除

• スタイリング：CSSとクラス

• イベント：.on()、委譲、カスタムイベント

• エフェクト：fadeIn、slideDown、animate()、カスタムエフェクト

• 動的コンテンツ：データ属性とテンプレート処理

• フォーム処理と入力検証

• $.ajax()：再読み込みせずにデータを取得・送信

• 非同期コードのためのDeferredオブジェクトとPromise

• カスタムセレクターと高度な絞り込み

• 堅牢なプラグイン

• パフォーマンスと推奨される手法

• モダンなJavaScriptとの連携とテスト

実践で学ぶ

• jQuery講座の各レッスンは、短い解説と自分でコードを書く練習を組み合わせた構成

• 入力を止めるとeditorがコードを再実行。サーバーもビルド手順も不要

• 現場で起こりがちなバグを修正：クリックハンドラーの「this」がwindowになる、チェーンの結果が文字列になる、古い行しか削除できない、カーソルを離してもメニューがスライドし続ける、保存が2回実行される

• クイズと面接対策問題で、フロントエンドの面接や既存のjQueryコードへの対応に備える

• チートシートで、セレクター、イベント、エフェクト、AJAXのメソッドをワンタップで確認

学ぶ理由

• 慣れ親しんだCSSセレクターをjQueryでも活用できる

• チェーンで4つの文を読みやすい1行にまとめられる

• 多くの既存サイトで使われているため、読み解いて修正する力がウェブ開発の実務に役立つ

• DOM、イベント、非同期JavaScriptの基礎にやさしく触れながらjQueryを学ぶ

対象となる方

• HTML/CSSの基礎を知り、インタラクティブなページ作成のためにjQueryを学ぶ初心者

• 授業に向けてJavaScriptとDOMを練習する学生

• jQueryを使ったサイトを保守するウェブ開発者

• フロントエンド職の面接を控えている方

無料版とPro

無料版：最初の講座（jQueryへようこそ）、最初のガイド付きプロジェクト、2つのミッション、editor、クイズ、面接対策問題、チートシート、AIメンターへの質問を毎日3回。広告あり。

Pro：すべての講座、プロジェクト、ミッション、修了証試験、AIメンターの無制限利用。広告なし。週単位・月単位・年単位の定期購入、または1回の購入で永続的に利用できる買い切り。

jQueryはOpenJS財団の商標です。このアプリは独立した学習アプリであり、OpenJS財団とは提携しておらず、同財団の推奨も受けていません。