前書き

これは、TSG の 2025 年度 WEB 初心者分科会の資料です。 HTML, CSS, JavaScript の基礎を学ぶことを目的としています。

この講義で学ぶこと

HTML, CSS, JavaScript を学ぶといったときに、 では、どのレベルまで学ぶのでしょうか。 あるいは、何を学べば、十分なことを学んだと言えるのでしょうか。

この講義は、およそ 1.5h ~ 2h を 5 回程度行う予定ですが、 高々 7.5h ~ 10h の時間で、HTML, CSS, JavaScript の全てを学ぶことはできません。 そのため、要素を取捨選択することになります。 この講義では、簡単なウェブアプリケーション X を作るために必要な要素を基準として、 学ぶ内容を取捨選択します。

簡単なウェブアプリケーション X とは、前期卒業要件判定のアプリです。 このアプリは、HTML, CSS, JavaScript を使って作成され、 ユーザーが履修している授業を選択しると、 前期課程の卒業要件を満たしているかどうかを判定することができます。

このアプリを作ることを通して、 HTML の構造や代表的なタグ、 CSS のプロパティやセレクタ、 JavaScript の基本的な文法や DOM 操作を学んでいきます。 その過程で、今後の発展性や有用性を考えて、 ウェブアプリに直接的に必要な要素だけでなく、 寄り道的なトピックにも言及していきます。

ふんわりした説明ではあまりイメージがつかないと思うので、 いくつか用語を挙げておきます。網羅的ではありません。

  • HTML
    • タグ / 木構造
    • 属性
    • head / body
    • div
    • p
    • span
    • img
    • form
  • CSS
    • style タグ
    • フィールド / プロパティ
    • セレクタ
    • font-size
    • background-color
  • JS
    • script タグ
    • 四則演算
    • const / let
    • if
    • for
    • object
    • array
    • function
    • DOM 操作
    • イベント
    • fetch
    • ランタイム / node
    • npm
    • JSON
  • その他
    • domain
    • URL
    • HTTP
    • スクレイピング
    • HTML Living Standard

この講義で学ばないこと

この講義は、以下のことは学びません。

  • 基本的なパソコンの操作
    • 自分が作ったファイルがどこに保存され、どのように開くのかがわかれば大丈夫です
  • Git / GitHub
  • UI / UX
  • Frontend フレームワーク
  • サーバーサイドプログラミング / データベース
  • CTF

講義で使用する端末やツールについて

初心者は以下の利用を推奨します。

  • OS
    • Windows
    • Mac
    • (Linux)
  • ブラウザ
    • Chrome
    • Firefox
    • Edge
  • エディタ
    • VSCode

ただし、有識者は何を使っても構いません。 特定の環境に依存する内容は扱わないつもりです。

講義設計、あるいは LLM について

この講義の裏目的として、 LLM 時代の講義をどうするかを考えてみる、というものがあります。 単純にいえば、LLM に聞けば全部教えてくれるじゃん、みたいな話が（本当か嘘かは置いておいて）あるわけです。

そして、プログラミングでは、それが一定正しいと思います。 少なくとも、何かを動かすという点では、 出てきたコードをコピーして実行してみれば、それが正しいかどうかは（おおよその場合）判明するからです。 その場で事実検証ができるというのは、ハルシネーションの影響を受けにくいということです。

一方で、LLM に聞けばなんでもわかるし、できるようになる、というわけでもありません。 この講義では、そのような部分を中心に設計しようと思っています。

results matching ""

    No results matching ""