こんにちは。
仙台市青葉区にある就労継続支援B型事業所imukat Lab.(イムカラボ)でITのお仕事をしているラボメンの「午後のゴート」です。
今回もJavaScriptをWebブラウザで実行する為の準備についてお話したいと思います!
はじめに
これから学習していく上において様々なファイルを作ることになります。
ですので、まずは学習用のフォルダをどこかに作成してください。
各々の章について学ぶ時はその章ごとのフォルダを中に追加で作成、
章ごとのフォルダの中でプログラムを作成していきましょう。
今回は学習用フォルダの中に「04」の名前でフォルダを作成してください。
(01からスタートしたい所ですが、この章が4章目なので…)
フォルダの用意ができたら、VS Codeからそのフォルダを開きましょう。
ですので、まずは学習用のフォルダをどこかに作成してください。
各々の章について学ぶ時はその章ごとのフォルダを中に追加で作成、
章ごとのフォルダの中でプログラムを作成していきましょう。
今回は学習用フォルダの中に「04」の名前でフォルダを作成してください。
(01からスタートしたい所ですが、この章が4章目なので…)
フォルダの用意ができたら、VS Codeからそのフォルダを開きましょう。
最初に作成するファイルはJavaScriptのファイルではない
JavaScriptを実行するのに一番手軽な方法はWebブラウザでの実行ですが
なんと、表題の通り「WebブラウザはJavaScriptのファイルを直接実行できない」のです。
直接実行できないので間接的に実行する必要があります。
間接的に実行するためにはHTMLを使います。
それではこれから、VS CodeでHTMLファイルを作成する準備をしていきましょう。
今はHTMLが読めなくとも大丈夫です、コピー&ペーストで済ませます。
なんと、表題の通り「WebブラウザはJavaScriptのファイルを直接実行できない」のです。
直接実行できないので間接的に実行する必要があります。
間接的に実行するためにはHTMLを使います。
それではこれから、VS CodeでHTMLファイルを作成する準備をしていきましょう。
今はHTMLが読めなくとも大丈夫です、コピー&ペーストで済ませます。
HTMLファイルの作成をしよう
まずはVS Codeで「Ctrl + N」を押して新しいテキストファイルの作成をしましょう。
そして「言語の選択」から、HTMLを選択します。
HTMLの入力画面になりました。
それでは、以下のHTMLコードをコピーして入力画面にペーストしてください。
そして「言語の選択」から、HTMLを選択します。
HTMLの入力画面になりました。
それでは、以下のHTMLコードをコピーして入力画面にペーストしてください。
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>title</title>
</head>
<body>
<p>01.HTMLからJavaScriptを呼び出す</p>
<script src="script.js"></script>
</body>
</html>
ペーストしたら「Ctrl + S」を押してファイルを保存しましょう。
ファイル名は「index.html」としてください。
左側のサイドバーにindex.htmlの項目が新しく現れているかと思います。
これで「script.js」というファイル名のJavaScriptを呼び出すHTMLファイルができました。
次からようやくJavaScriptに触れる事ができます!
ファイル名は「index.html」としてください。
左側のサイドバーにindex.htmlの項目が新しく現れているかと思います。
これで「script.js」というファイル名のJavaScriptを呼び出すHTMLファイルができました。
次からようやくJavaScriptに触れる事ができます!
はじめよう、JavaScript
初心者が最初に学ぶ用途に使うならばJavaScriptが良いと私は考えます。
理由は以下の通りです。
理由は以下の通りです。
(1) ブラウザ上で実行可能
JavaScriptはWebブラウザで直接実行できるため、複雑なパソコンの設定が不要です。
ブラウザとテキストエディタがあれば、すぐにプログラムを書き始めることができます。
「自前のパソコンじゃないけど今すぐちょっとしたプログラムが必要だ…」
そんな時でもJavaScriptなら即座にプログラムを書いて実行する事ができるのです。
Webブラウザでプログラムを実行する利点は他にもあります。
Webブラウザには様々なセキュリティや制限が施されており、プログラムが危険な動作を行えないようになっています。
間違ったプログラムを書いたせいで、大事なファイルを失ったりパソコンを壊してしまうような心配がないのです。
ブラウザとテキストエディタがあれば、すぐにプログラムを書き始めることができます。
「自前のパソコンじゃないけど今すぐちょっとしたプログラムが必要だ…」
そんな時でもJavaScriptなら即座にプログラムを書いて実行する事ができるのです。
Webブラウザでプログラムを実行する利点は他にもあります。
Webブラウザには様々なセキュリティや制限が施されており、プログラムが危険な動作を行えないようになっています。
間違ったプログラムを書いたせいで、大事なファイルを失ったりパソコンを壊してしまうような心配がないのです。
(2) 情報源が多い
JavaScriptは多くの人に使われている言語であり、検索したり質問して疑問を解消する際の苦労が少なく済みます。
マイナーな言語を扱う場合は、書籍を手に原因を探ったり、英語の文章を読んで問題を解決する必要にしばしば迫られます。
マイナーな言語を扱う場合は、書籍を手に原因を探ったり、英語の文章を読んで問題を解決する必要にしばしば迫られます。
(3) Web開発に役立つ
JavaScriptはWeb開発の中心的な要素であり、ウェブサイトやWebアプリケーションの開発に不可欠です。
初めてのプログラミング言語として学ぶことで、即座に実用的な物の作成に取り組むことができます。
初めてのプログラミング言語として学ぶことで、即座に実用的な物の作成に取り組むことができます。
(4) GoogleAppScriptとして使える
まず、ExcelのマクロはVBAという言語で動作しています。(最新のExcel環境ならPythonも使えます)
そしてGoogleスプレッドシートではGoogleAppScriptという言語が使えます。
GoogleAppScriptはJavaScriptをベースに、独自の仕様を少し追加したプログラミング言語です。
JavaScriptが書けるならば、少し知識を追加するだけでGoogleAppScriptも活用できるようになるのです。
そしてGoogleスプレッドシートではGoogleAppScriptという言語が使えます。
GoogleAppScriptはJavaScriptをベースに、独自の仕様を少し追加したプログラミング言語です。
JavaScriptが書けるならば、少し知識を追加するだけでGoogleAppScriptも活用できるようになるのです。
他の言語との比較
JavaScriptは初心者向けに優れた選択肢ですが、他のプログラミング言語も利点があります。
以下は一般的なプログラミング言語との比較です。
以下は一般的なプログラミング言語との比較です。
Python
Pythonも初心者向けの入門情報が豊富にあり、良い選択であるとされています。
便利で高度な追加機能が様々開発されており、それらを使う事で初学者でも高度に見える物を作る事ができます。
便利で高度な追加機能が様々開発されており、それらを使う事で初学者でも高度に見える物を作る事ができます。
Scratch
Scratchは視覚的なブロックプログラミング言語環境で、子供たち向けに設計されています。
これは実際に問題を解決する為の手段ではなく、初心者がプログラミングの基礎を学ぶ事が要点であるツールです。
これは実際に問題を解決する為の手段ではなく、初心者がプログラミングの基礎を学ぶ事が要点であるツールです。
Java
Javaはオブジェクト指向プログラミング言語として広く知られており、大規模なアプリケーションの開発に利用されています。
よく名前が知られている資格試験があり、IT業界で勤める目的に向いたスキルです。
よく名前が知られている資格試験があり、IT業界で勤める目的に向いたスキルです。
おわりに
今回はプログラミングとは何か、そしてJavascriptを勧める理由についてお話させていただきました。
次回からJavascriptについてお話していきたいと思います。
次回からJavascriptについてお話していきたいと思います。