codequick-darkmode-logo
ログインサインアップ
ウェブ開発の基礎 | HTML | CSS | JavaScript

シラバス:

ウェブ開発の基礎 | HTML | CSS | JavaScript

28 レッスン 204 オンラインコーディングの質問


コースでどのトピックがカバーされますか?

Javascript入門パート1

  1. 開発の最初のステップ:

    • Printing action console.log

    • Defining a variable of type var

    • Combine variables with console.log

  1. 基本的な数学演算:

    • 数値変数の定義

    • 算術演算 - 足し算、引き算、掛け算、割り算

    • 算術演算でのconsole.logの使用

  1. 文字列:

    • 文字列とは何か

    • 文字列変数の定義

    • 文字列インデックスの理解

    • 角括弧 [] オペレーターの使用

  1. 条件とブール変数:

    • if条件の理解

    • より大きい操作

    • より小さい操作

    • 等価操作

    • 不等価操作(ノットイコール)

    • 以上の操作

    • 以下の操作

    • 単純な条件の使用

  1. 高度な条件:

    • 高度な条件と論理演算子 (&& と ||)

    • if と else の使用

    • else if を使った複雑な条件の使用

  1. モジュロ演算:

    • モジュロ演算 (%) を使用して余りを計算する

    • 数字の桁数を計算するメソッドの使用

    • 数値の結果を丸めるために parseInt を使用する

  1. Whileループ:

    • whileループの書き方

    • インデックスの概念とその使用法を理解する

  1. Forループ:

    • forループの定義とその用途

    • ループの初期化、インクリメント、終了の理解

  1. モジュロの応用トピックス:

    • より複雑なタスクのためのモジュロの使用

    • 数字の各桁の合計の計算方法

Javascriptの基礎 パート2

  1. 配列:

    • 配列の定義

    • 配列のインデックスの概念とその使用法を理解する

    • ループを使って配列を反復処理する

  1. オブジェクト:

    • 空のオブジェクトを定義する

    • オブジェクト内のキーを初期化する

    • ドット演算子を使用してキーにアクセスする

    • 動的にキーにアクセスする

  1. オブジェクトの高度なトピック:

    • オブジェクトの配列

    • オブジェクトの配列をループで繰り返す

    • Object.keys メソッド

    • Object.values メソッド

    • JSON.stringify メソッド

    • JSON.parse メソッド

  1. 関数 パートA:

    • 関数の定義

    • 関数の引数の定義

    • 関数の戻り値

    • より複雑な関数の作成

  1. 関数 パートB:

    • 複数の関数を呼び出す

    • 他の関数内で関数を呼び出す。

    • 関数のチェーン

  1. ネストされたForループ:

    • ネストされたforループの定義

    • インデックスの適切な使用

    • 配列を使用した複雑な例

HTML、CSS、JSの統合

  1. コードを使用して要素を構築する:

    • HTML、CSS、JavaScriptの領域を組み合わせる

    • DOM(Document Object Model)を理解する

    • コードを使用してシンプルなHTML要素を作成する

    • innerTextとclassListの使用

    • appendChild関数の使用

  1. ループを使用してリストを作成する:

    • 動的なul要素を作成する

    • 動的なli要素を作成する

    • 動的作成のための関数を使用する

  1. ページから要素を取得する:

    • getElementById関数を用いた取得について理解する

    • getElementsByClassName関数を用いた取得について理解する

    • getElementsByTagName関数を用いた取得について理解する

    • querySelectorAll関数を用いた取得について理解する

    • querySelector関数を用いた取得について理解する

    • createElement関数を用いた要素の作成について理解する

  1. 動的なテーブルの構築:

    • テーブル要素を動的に作成

    • 配列と関数を使用してテーブルを構築

  1. イベント パートA:

    • ボタンに click イベントをバインドする

    • addEventListener の使用

    • ユーザーとのイベント後にページにコンテンツを動的に挿入する

  1. イベントパートB:

    • 入力とイベントの使用

    • 動的要素の統合

    • より複雑な例

JavaScriptの高度なトピック

  1. コールバック関数:

    • コールバック関数とは何か

    • いつ使用するか

    • 引数の渡し方

    • コードの正確性をチェックする方法

  1. タイマー:

    • setTimeout関数を理解する

    • setInterval関数を理解する

    • 言語における非同期の性質を理解する

  1. サーバーとの通信 パートA:

    • xmlHttpRequestオブジェクトの理解

    • 実際のサーバーとの通信を作成してデータを取得する

    • ページ上で動的な要素を構築する

  1. サーバーとの通信 パートB:

    • イベントと通信の使用

    • サーバーと対話する動的ページのための複雑なフローの作成

    • JavaScriptにおける非同期動作の理解

  1. プロミスの使用:

    • Promiseオブジェクトの理解

    • thenとcatchの使用

    • プロミスを使用した通信の作成

    • プロミスを使用した複雑なフローの作成

  1. 締めの言葉