1.Liveweaveのサイトへアクセス

http://liveweave.com/

Liveweaveはリアルタイムで編集が出来るブラウザ上で動作するHTMLエディタです。

2.アカウントを作成しよう

右上のLogin→Sign up for a new acount

 

これでアカウント作成完了

メモを忘れずに!(先生にもメモしてもらおう)

3.Liveweaveの使い方

赤い部分にHTML、水色の部分にCSS、黄色の部分にJavascriptを書き込みます。
すると黄緑色の部分がコーディング結果のプレビュー画面となります。

練習課題のテキストをそれぞれの場所に実際に打ち込んで行きましょう。

4.練習問題の進め方

【01】〜の練習問題は入力内容のHTML、CSS、Javascriptを問題と同じように自分の画面に打ち込んで行きましょう。

【01-2】のようになっている問題は演習問題です。問題文を書き換えてみましょう。

5.注意点

プログラムの中に全角のスペースを入れないようにしよう。
→ ←これが全角スペース、→ ←これが半角スペース。
プログラムがうまく動かなくなります。

/*こんな記号に囲まれている部分はコメントアウトといってプログラムには関係のないメモ書きのようなものです。ヒントなどを書いてます。*/

入力内容のコードをなるべく忠実に書き写そう。
文字を右にずらすインデントも意識して書こう。
tabキーを押すと右に一つ分インデントが入ります。
これを意識すると構造が分かりやすくなります!