【Webプログラミング入門】ブラウザですぐに実行できるHTML、CSS、Javascript

Webプログラミング入門として、ブラウザ上で実行できるHTMLとCSSそしてJavascriptの環境を用意しています。サイトを作るイメージをすぐに掴めます。
ロード中...

【Webプログラミング入門】ブラウザですぐに実行できるHTML、CSS、Javascript

まとめ (TL;DR)

ここでは Web ページを作成する最も基本的な3つの要素、HTML・CSS・Javascript を簡単にすぐに実行することができます。これで Web ページがどのように動くのかを理解するきっかけになります。

Search and Replace Text

バックグラウンド

ブラウザで表示されるこのサイトも含めた Web についての技術は、OSI 参照モデルをベースに説明するととてもとても大変になってしまい、挫折してしまうレベルです。今回は Web ページってどうやって作っているんだろうかという最初の手がかりとしての一助となれば幸いです。何はともあれ、まずは自分で書いて、その結果をすぐに確認できる。すぐにフィードバックが得られることは学習するうえでとても大切なプロセスです。

使い方

  • HTML、CSS、Javascript それぞれ3つの入力欄があります。そこにそれぞれの言語に合わせて入力すると、右側の結果エリアにすぐに反映されます。ただし、Javascript の場合は入力が終わったら、実行ボタンを押してください。
  • Ctrl ボタンとスペースキーを同時に押すと、入力候補が表示されます。これを活用すると、正確に素早くプログラムを書くことができます。
  • 結果がうまく表示されない場合は、プログラムの内容に不備がある可能性があります。例えば HTML のところでタグを閉じ忘れがないかなどです。注意してみてみましょう。

HTML、CSS、Javascript を書くためのヒント

HTML

CSS

Javascript

さいごに

ごくごく簡単なものになります。 何かのお役に立てれば幸いです。

Updated at: Wed Jun 03 2020

© 2020-presentTerms|Privacy