プログラミングを学びたいけど、何から手を付けたら良いか分からない、準備が面倒で中々始められないという方はいないでしょうか。
また、書籍で勉強しても理解できず、手を動かすことができないということもあると思います。
僕はプログラミングを学ぶために、最も重要なことは手を動かしてたくさんプログラムを書くことだと考えています。
本記事では、最も手軽にプログラミングを始められるJavaScriptを題材に、最初のプログラムとなるHelloWorldを作るまでを解説します。
最も手間の少ない手順で解説しますので、中々始められない人もまずは手を動かしてみてください。
最初のうちは意味が分からなくても大丈夫です。まずはプログラミングによって動くことを確認しましょう。
必要なもの
- ブラウザ
- エディタ
以上です。
JavaScriptは、ブラウザがJavaScriptを動かす仕組みを持っているので、特別なツールなどをインストールする必要はありません。
HelloWorldとは
プログラミングの前に、HelloWorldとは何かについて説明します。
Wikipediaでは以下のように書かれています。
（出典: フリー百科事典『ウィキペディア（Wikipedia）』）
プログラミングにおけるはじめの一歩が、HelloWorldです。
JavaScriptの最速HelloWorld
では、JavaScriptのHelloWorldを作成します。
手順はたったの２つです。
②作ったプログラムをブラウザで開く
①エディタでHelloWorldのプログラミングをする
最初はエディタの種類は何でも構わないので、新規に開きます。
以下の内容をプログラミングしてください。意味が分からなくても大丈夫です。
<script>
alert("Hello World!!");
</script>
書けたら、名前を付けてファイルを保存します。
ファイル名は、「HelloWorld.html」とします。
②作ったプログラムをブラウザで開く
①で保存したファイルをブラウザで開きます。
ブラウザの種類により表示のされ方は異なりますが、「Hello World!!」と書かれたポップアップが表示されたら成功です。
以上でJavaScriptのHelloWorldは完了です。
プログラムの解説
プログラムが動くことを確認できたら、目的は達成できたのですが、何をプログラミングしたのか分からないとこの先に進めないと思いますので、簡単に解説をします。
今回は3行のプログラムを書きました。
1行目の
<script>
は、「ここからJavaScriptのプログラムが始まります」ということを表すタグと呼ばれるものです。
これはプログラムを動かすブラウザに知らせるものであり、いわゆるおまじないというやつです。
他のプログラミング言語も、プログラムを動かすための準備のようなお作法（おまじない）があったりします。
2行目の
alert("Hello World!!");
は、「Hello World!!」という文字列をポップアップで表示するためのプログラムです。
alertという関数を使っています。
JavaScriptには、こうしたブラウザが標準で提供している関数がたくさんあります。
このような関数を組合せていくことで、様々な動作をするプログラムを作っていくことができます。
3行目の
</script>
は、「これでJavaScriptのプログラムが終わります」ということを表すタグです。
1行目とセットで使います。
まずは手を動かすことが重要
書籍などでは、説明がHTMLとセットになっていたりして、HelloWorldのプログラムがもっと長く、複雑だったりします。
僕は、まずはシンプルなプログラムを、早く手を動かして確認することが重要だと考えています。
HelloWorldをきっかけとして、プログラムを色々と書き換えながら動作結果を確認していくと、プログラムごとの違いが分かり、理解も早くなります。
はじめから書籍を見ながら大きなプログラムを書いても、プログラムが何をやっているのかが分からなくなるので、小さく変更して、都度結果を確認していく方法をおすすめします。
そして、たくさん手を動かして、詰まったら書籍で勉強したり調べたりするほうが上達も速いと思います。
今回はJavaScriptの最速HelloWorldを紹介しました。参考になれば幸いです。
コメント