はじめに

HTML5でWebアプリをつくってみませんか?

 HTMLは単なる文書の電子配信用のための記述言語だと思っていませんか?HTMLは「HTML5」となって 大きく進化しました.スタイルの設定や表示の制御に関する高度な機能が盛り込まれ, Webブラウザのみでもかなりの機能を持った,しかもかなり高性能なアプリケーションプログラムを 実現することができます.しかもWebアプリケーション開発のために特別なツールは必要ありません. 最新のWebブラウザと,メモ帳などのテキストエディタがあれば開発環境は整ったも同然です.

入門用テキスト:
   「JavaScript入門」(第0.64版:88ページ:2.7Mバイト)
を作りました.
無料で差し上げますが, よろしければ感想や要望をください.

---------------------------------------
 本書の目次は下のとおりです.また掲載されているサンプルプログラムを
左に挙げておきますので試してみてください.

【目次】
1 JavaScript とは
 
2 学習に必要なもの
 
3 JavaScript を学ぶ前に
 3.1 HTML の基本
  3.1.1 基本構造
  3.1.2 GUI コンポーネント
 3.2 CSS の基本
  3.2.1 基礎事項
  3.2.2 設定できるスタイルの種類
  3.2.3 コンテンツの配置に関する基礎
  3.2.4 HTML のspan タグについて
  3.2.5 CSS を別のファイルに分離する方法
 
4 JavaScript の基礎
 4.1 まずは体験
  4.1.1 JavaScript プログラムを別のファイルに分離する方法
  4.1.2 プログラム開発やデバッグのための機能
 
5 JavaScript の重要な機能
 5.1 変数とデータ型
  5.1.1 データ型の変換
  5.1.2 文字列の操作
 5.2 制御
  5.2.1 条件分岐(1)  : if 文
  5.2.2 条件分岐(2)  : switch 文
  5.2.3 繰り返し(1)  : while 文
  5.2.4 繰り返し(2)  : for 文
 5.3 配列とオブジェクト
  5.3.1 配列
  5.3.2 オブジェクト(連想配列)
 5.4 日付・時刻
 5.5 GUI の扱い方
  5.5.1 GUI のコンポーネントの名前と値
  5.5.2 ボタンのクリック
  5.5.3 テキストフィールド/パスワードフィールド/テキストエリア
  5.5.4 チェックボックス
  5.5.5 ラジオボタン
  5.5.6 選択ボックス
  5.5.7 スライダ
 
6 canvas グラフィックス
 6.1 canvas とコンテキスト
  6.1.1 コンテキスト
 6.2 図形の描画
  6.2.1 線
  6.2.2 円,円弧,楕円
  6.2.3 四角形
  6.2.4 文字列描画
 6.3 画像ファイルの読み込みと表示
 6.4 拡縮,平行移動,回転など
  6.4.1 拡縮
  6.4.2 平行移動
  6.4.3 回転
  6.4.4 コンテキストの保存と復元
 6.5 ピクセル(画素)の操作
  6.5.1 ImageData オブジェクトについて
  6.5.2 ピクセル描画の手順
  6.5.3 サンプルプログラム
 
7 Web アプリケーション開発に必要なこと
 7.1 イベント駆動型プログラミング
  7.1.1 イベントの種類
 7.2 プログラムの記述と実行の流れ
  7.2.1 イベントリスナの設定
  7.2.2 座標系や要素のサイズに関すること
 7.3 メディアデータ(音声,動画)の再生
  7.3.1 audio/video タグを用いたメディアデータの読込み
  7.3.2 再生と一時停止
  7.3.3 audio タグを使用せずに音声を再生する方法
  7.3.4 再生の時刻に関すること
  7.3.5 再生の音量に関すること
  7.3.6 再生の速度に関すること
 7.4 タイミングイベント
 7.5 データの保存
  7.5.1 値の保存
  7.5.2 値の参照
  7.5.3 値の消去
  7.5.4 その他(データの管理に関する機能など)
 7.6 表示環境の取得と設定
  7.6.1 表示領域のサイズの取得
  7.6.2 サーバとブラウザに関する情報の取得
 7.7 JavaScript によるスタイルの設定
  7.7.1 id 名によるHTML 要素の参照
  7.7.2 スタイルの設定
 7.8 その他の工夫
  7.8.1 オフライン動作のための設定
 
8 付録:ブラウザ付属の開発機能
 8.1 ソースプログラムの自動整形
  8.1.1 Firefox の場合
  8.1.2 Google Chrome の場合
 8.2 プログラムのステップ実行
  8.2.1 Firefox の場合
  8.2.2 Google Chrome の場合
---------------------------------------

※ 本書のサンプルプログラム作成にあたり,下記のサイトの素材を使わせていただきました.
 ● 「フリー効果音素材 くらげ工匠」
 ● 「甘茶の音楽工房」
お礼申し上げます.