OVERVIEW
JavaScriptは、Webページに動きやインタラクションを加えるためのプログラミング言語です。ブラウザに標準で組み込まれており、ボタンのクリックに反応したり、入力内容をチェックしたり、表示を切り替えたりといった処理を書けます。
HTMLがページの構造を、CSSが見た目を定義するのに対し、JavaScriptは操作に応じた処理を担当します。クリックしたボタンや入力された値をもとに、表示する内容やスタイルを変えられます。
ブラウザはHTMLからDOMというデータ構造を作って画面を表示します。JavaScriptでDOMの要素を追加したり、テキストを書き換えたりすると、その変更が画面にも反映されます。
モーダルの開閉やタブの切り替え、カルーセルの画像の移動などは、JavaScriptで実装できる身近な例です。また、Fetch APIを使えば、外部から取得したデータをページに表示できます。
WebブラウザにはJavaScriptを実行する機能が備わっています。HTMLからスクリプトを読み込むことで、ページ上で処理を実行できます。
JavaScriptでは、数値や文字列を扱い、条件分岐や繰り返しを使って処理を組み立てます。条件演算子、論理演算子、スコープなどの仕組みもあります。
モーダルの開閉やカルーセルの画像切り替えなど、Webページで使われるUIを実装できます。乱数やタイマーを使えば、スロットのようなミニアプリも作れます。
ROADMAP
最初に小さなプログラムを動かし、JavaScriptでどんなことができるのかを体験します。
小さなプログラムを動かしながら、JavaScriptでどんなことができるのか、ページにどのように動きがつくのかを体験します。
変数や関数、配列やオブジェクトを順に学び、DOM操作でページの内容を書き換える方法を身につけます。
変数、条件分岐、繰り返しなど、プログラムを書くうえで欠かせない基礎文法をひとつずつ学びます。
処理をまとめて再利用できる関数の書き方と、引数や戻り値の考え方に慣れていきます。
配列やオブジェクトを使って、複数のデータをまとめて扱う方法を学びます。
ページの要素を取得して書き換えたり、クリックなどのイベントを受け取ったりする、動きの基本を学びます。
基礎文法とDOM操作を学んだあとは、参加型の課題で自分でコードを書く練習をします。
参加型の課題で、学んだ文法を使って手を動かし、自分でコードを書いてアウトプットする力を鍛えます。
数値や文字列、日時の操作、タイマー、クラス、外部データの取得などを詳しく学びます。
数値の計算や丸め、乱数など、数を扱うときに役立つメソッドを学びます。
文字列の連結、検索、置換、切り出しなど、テキストを加工する方法を学びます。
日付や時刻を取得したり、表示形式を整えたりする方法を学びます。
一定時間ごとの処理や、指定した時間後の処理を実行するタイマーの使い方を学びます。
真偽値を使った条件分岐、undefinedとnullの違い、typeofでデータ型を調べる方法を学びます。
データと処理をまとめて扱うクラスの書き方と、インスタンスの考え方を学びます。
外部からデータを取得して、ページに反映させる非同期処理の基本を学びます。
モーダルやメニュー、カルーセルなど、実際のサイトでよく使われるUIを自分の手で実装します。
クリックで開閉するモーダルウィンドウを実装しながら、表示の切り替えを学びます。
スマートフォンでよく見るハンバーガーメニューを実装し、メニューの開閉を学びます。
クリックで内容を開いたり閉じたりするアコーディオンUIを実装します。
タブを切り替えて表示内容を出し分けるタブメニューを実装します。
画像などを横にスライドさせて見せるカルーセルを実装します。
ENVIRONMENT
体験編では動画横のブラウザ実行環境を使います。この実行環境はプレミアムプラン限定です。基礎文法編以降は、パソコンにVS CodeとChromeを用意し、HTMLやJavaScriptのファイルを作って動作を確認します。
体験編の動画は無料です。基礎文法編以降はプレミアム限定ですが、ユーザー登録すれば各講座の最初の数レッスンを無料で視聴できます。
NEXT STEP
FAQ
初めてなら「JavaScriptを体験しよう」から始めるのがおすすめです。全体像をつかんでから基礎文法に進むと、あとから学ぶ内容を理解しやすくなります。
はい。このロードマップのレッスンは、HTML/CSSの基礎を学んだ方を対象にしています。HTMLのタグやCSSのセレクタを使うので、まだ学んでいない方は、先にWebサイト制作入門で基礎を学ぶのがおすすめです。
基礎文法とDOM操作をひと通り学んだあとがおすすめです。分からない部分が出てきたら、必要な基礎レッスンに戻りながら進められます。
HTML/CSSの基礎を学んでいれば、プログラミング未経験でも始められます。体験編でJavaScriptの動きを見たあと、変数や条件分岐、関数などの書き方を基礎から学べます。
動画の視聴だけなら、1本約3分として全225本で約11時間が目安です。1日20〜30分なら約3〜5週間に相当します。コードを書く時間や復習、ミニクイズ、256timesの課題に取り組む時間は別に必要です。
コードを書くためのパソコンが必要です。体験編のブラウザ実行環境を使うにはプレミアムプランへの登録が必要です。基礎文法編以降では、無料で使えるVS CodeとChromeを用意してください。
体験編の動画は無料で視聴できます。基礎文法編以降はプレミアム限定ですが、ユーザー登録すれば各講座の最初の数レッスンを無料で視聴できます。ブラウザ実行環境の利用はプレミアムプラン限定です。
モーダルウィンドウ、ハンバーガーメニュー、アコーディオン、タブメニュー、カルーセルを実装できるようになります。
LEARN NOW
JavaScriptを体験するところから始め、基礎文法、課題への挑戦、応用、よく見るUIの実装まで順に学べます。
1本3分前後の短い動画とミニクイズで区切られているので、すきま時間にも少しずつ進められます。
3分動画でマスターできるプログラミング学習サービスです。あなたもプログラミングを始めてみませんか？
Copyright © 2011-2026 dotinstall.com. All Rights Reserved.
