最低限の知識を身につけよう！

• 環境を整えよう
• VScodeを導入しよう
• Google Chromeを導入しよう

Webサイト作るために

• Webサイトの仕組みを人に説明できますか
• HTML, CSSと何か？
• 実際の仕事にどう関わってくるか

コーディングに必要なものを揃えよう

• コーディングの環境構築

HTMLとは

• HTMLの書き方を覚えよう
• HTMLの書き方の３つのルール

HTMLでよく使う18個のタグを覚えよう

• 見出しタグ h1~h6
• 段落タグ p
• 改行タグ br
• 強調タグ strong
• 画像タグ imgとsrcとalt
• 箇条書きタグ olとulとli
• 表タグ tableとtrとthとtd
• コメントアウト

提出課題

• 指定されたタグでシンプルなWebページを作ろう

CSSとは

• CSSとは
• 実際にCSSファイルでコードを書いてみよう
• 親要素と子要素について理解しよう

CSSとは

• colorプロパティ　文字色変更
• font-sizeプロパティ　文字のサイズ変更
• font-weightプロパティ　文字の太さ変更
• text-alignプロパティ　文字の整列
• background-colorプロパティ　背景色
• borderプロパティ　線
• marginプロパティ　余白
• paddingプロパティ　余白

提出課題

• シンプルなWebページを作ろう

フォームで使うタグやプロパティを覚えよう

• フォームで使うHTMLタグを覚えよう

提出課題

• 簡単なフォームを作ってみよう

ややこしいものの解説

• divとspanについて理解しよう
• divについているidとclassの使い分け

提出課題

• divとclassをうまく活用しよう

CSSのセレクタでよく使われる７つ

• ブロック要素とインライン要素の違い
• paddingとmarginの違いとボックスモデルの理解
• flexを使ってレイアウトの基礎を身につける
• Gridを使ってFlexとの使い分けをマスターする
• スマホ対応の概要を理解しよう

デベロッパーツールを使いこなそう

• デベロッパーツールとは

HTMLとCSSを組み合わせてコーディングしてみよう

• ECサイトのトップページを作成してみよう

JavaScriptとは

• Webを中心に広範囲に使用されるJavaScript

Webサイト作るために

• 基本的なデータと計算
• 変数について知ろう
• データの種類に気を配る
• 命令と条件分岐
• 少し高度なデータ
• 処理を繰り返す
• 関数を作る
• オブジェクトをさらに理解する
• HTMLを操作する
• JavaScriptの新しい構文
• 公式ドキュメントとエラーを読む
• プログラミング学習が続けられる人の特徴

コードを見るのに疲れた時

• 図解で理解しよう
• さらっと復習に使える読み物