JavaScriptとは
HTML/CSSで作られたサイトは静的なものになってしまします。
※突き詰めるとCSSでアニメーションのようなものも作れるみたいですが、僕は初学者なのでまだ理解していません、、すみません。
ただ、JavaScriptを用いることで、サイト自体に『動き』を出すことが可能になります。
例えば、、、
- 入力の際に間違いや、空欄があったときのエラーメッセージ
- googleの検索フォームで、文字を入力時に予測変換で出てくる
- 地図の拡大や縮小
その他にも様々な場面で使われています。
2021年時点ですが、世界的に見てもJavaScriptは一番習得されている技術のようです。
また移り変わりの激しいITの業界でもこの言語だけは変化することなく、常に求められている言語のようです。。
現在のWebサイトには欠かせないプログラミング言語としてJavaScriptは習得した方がいいと思いました。
基礎から勉強していきたいと思います。
まず第一歩目として
まず実際にchrome表示させてみたいと思います。
使用する物
- Visual Studio Code
- Google Chrome
この2つでやっていきたいと思います。
まず、sample.htmlというファイルを作成し、同じディレクトリ内にsample.jsというファイルを作成してください。
そしてそのファイルをデスクトップなどに保存して準備完了です。
JavaScriptで"こんにちは"と表示させてみる
方法としては2つあります。
１つ目はHTMLファイルに直接記述する
sample.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
</head>
<body>
#scriiptタグで囲み、その中に記述する
<script>
alert('こんにちは');
</script>
</body>
</html>
２つ目は、javascriptファイルを作り、そこに記述する
sample.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
</head>
<body>
#ファイルパスを指定してあげる
#今回は同一のフォルダ内にjsファイルを作成
<script src = "sample.js"></script>
</body>
</html>
sample.js
alert("こんにちは");
上記２つのやり方で表示内容は同じです。
まとめ
javascriptがいかに重要な言語かがわかりました。
ちなみに2つ紹介しましたが、基本的には2つ目のjsファイルを準備する方が後々のメンテナンスなどで修正がしやすくなるのでそちらを用いた方がいいみたいです。しょうがない場合などはあるのでしょうか、、、勉強していきたいと思います。