From CoderDojo Kata
Jump to: navigation, search

事前準備

参加者にお願いすること

  1. Dropboxのインストールとアカウント設定 ※保護者のメールアドレスでも構わないが、その場合、同一アドレスで既にDropboxを使っていないか確認。
  2. メールアドレスをメンターに伝える
  3. テキストエディタのインストール

メンターの作業

  1. Dropboxの /html/ ディレクトリ内に、個人用ディレクトリを追加 (例. /html/cognitom/)
  2. 追加したディレクトリの共有設定。参加者のメールアドレス(Dropboxの登録に使ったもの)を指定。
  3. Dropboxの /sozai/ ディレクトリの共有設定。参加者のメールアドレス(Dropboxの登録に使ったもの)を指定。
  4. shimokitaをダウンロードして、個人用ディレクトリに展開。

Dropboxについて

  • tokyo@coderdojo.com で取得したDropboxアカウントがあります。Webサーバ上にも、Dropboxのクライアントがインストールされており、各参加者のフォルダと自動同期されます。
  • Dropbox/html/ ディレクトリの内容は、 http://tokyo.coderdojo.com/html/ に自動的に公開されます。
  • 個人用ディレクトリ (例. /html/codnitom/) も、自動的にサーバと同期され公開されます。その点、注意して下さい。


授業の進め方

  1. CodeAcademyにアカウントをつくる。
  2. CodeAcademyで、「Heading」までをおさらい。
  3. CodeAcademyで、「Images」「Links」まで説明。
  4. 作成したHTMLコードを、テキストエディタに移してみる。ブラウザで開いて確認。
  5. 下北沢アドベンチャー」を見せる。
  6. 各人、個人用ディレクトリにある、shimokita/index.html をブラウザで開く。
  7. 今度は、エディタで開く。
  8. STYLEタグのコメントアウトを外す (スタイルを有効にする)。スタイルが変わるのを確認。
  9. 既存のページをコピーして、ページを追加。
  10. 写真や文言を変える。
  11. 自由制作 : ↓工夫の例
    • Game Over 画面を変える。複数用意する。
    • 写真を新しく撮る。
    • 他の人とストーリーを繋げる。


参考情報