超初心者向け、プログラミング講座

超初心者向け、プログラミング講座

2022年8月23日






超初心者向け、プログラミング講座

もう少し簡単なプログラミングの話をと言うリクエストに答えて、初めてプログラミングを学習する型向けの連載を始める事にしました。講座のゴールは、簡単な Web プログラミングができるようにと言うのがゴールです。Web プログラミングなので、使用するプログラミング言語は Javascript(Node.js)を利用します。第一回は、まずは、プログラミングをするための準備です。

プログラミングをするための準備

最初に行うのは、コンピュータの準備です。スマホではできません! コンピュータも色々ありますが、今回の連載では、Windows の PC を利用するのを前提でお届けします。 Mac をご利用の方でも、ほぼ同じような事が可能なのですが、今回は「超初心者」向けで、本当に初めてプログラミングをやってみようと言う方を対象にしていますので、混乱を防ぐ意味で、Windows10(もしくは Windows11)を使って進めていく事にします。最新の PC は、2022 年現在だと、Windows11 を搭載した物が殆どだと思いますが、少し古い PC だと Windows10 の場合もあると思いますが、どちらも似ているので取り敢えずこの二つを利用するのを前提で進めて行きます。

プログラミングをするのに必要な物は、今回は二つのアプリです。インターネットにアクセスするための Web ブラウザは、PC にすでに入っていると思いますので、まずは以下の二つを用意します。

  • Microsoft Visual Stadio Code (VSCODE)
  • Node JS

です。どちらもインターネットから無料でダウンロードできます。

インストールは、Web ブラウザでダウンロードサイト(以下をご覧ください)からダウンロードして、インストールします。 大抵のブラウザは、ダウンロードしたファイルがブラウザの下の方に表示されるので、その名前をダブルクリックすればインストールできます。インターネットにインストールのやり方の記事もありますので、この連載ではインストール方法の詳細には触れません。どうしても、インストールできないようならばお問合せください。別途記事を書くことを検討します。

Visual Stadio Code

これは、プログラムを PC 上で入力するのに必要なアプリです。文章を入力するのにワープロを利用された方も多いと思いますが、同じようなイメージです。 ダウンロードは、Visual Stadio Code のサイトからダウンロードできます。

Windows 版をダウンロードして、インストールしてください。最近の PC の場合、ほとんどが64ビット版で良いかと思います。

Node JS

Node JS は、作成したプログラムを実行するためのアプリです。 Javascript(Node JS)のプログラムを実行できます。

これから学習するプログラミング言語は Javascript と呼ばれる言語で、元々は、Web ブラウザで動作するように開発されたプログラミング言語です。 Node JS は、Web ブラウザでプログラムを実行する部分だけを取り出して、PC 上でも実行できるようにした物です。

今回の連載のゴールは、Web プログラミングなので、最終的には、Web ブラウザで実行できるプログラムを作成しますが、最初は Node JS を使ってプログラムの基本を学習します。こちらも、Node JS のサイトからダウンロードできます。

これも Windows 版をインストールしてください。

学習の進め方

この連載では、一つのプログラムを作成する事を目標にします。 一般的なプログラミング言語の解説ではなく、プログラムの作成を中心に「必要な事を解説する」と言う方法で進めて行きます。

作成するプログラムは「電卓」のプログラムを作ります。実際は、PC やスマホにもすでに標準で入っているアプリなので、自分でプログラムを書くメリットは余りないと思いますが、プログラムの学習には良い題材なので採用しました。まずは、電卓のプログラムに着手する前に事前準備として、簡単なプログラムから学習して行きます。

最初は、簡単なプログラムの例を紹介しますので、まずは「何をやっているのか」、「どのように書くのか」を理解して、それを元にして、似たような部分をご自分で実際に書いてみると言うステップで進めて行きます。

今回は、プログラムを実際に書いて実行してみると言う部分をやってみます。

「Hello World」を表示する

今回のプログラムは、「Hello World」を表示するプログラムを実際に入力して実行します。

今回のプログラムは以下の1行だけです。

console.log("Hello World")

これを、Visual Stadio Code (VSCODE)のアプリを開いて入力して「HelloWorld.js」と言う名前で保存してください。 保存したフォルダの場所と名前を確認しておいてください。

例として、ホームフォルダの「Documents」の下に、「HelloWorld.js」で保存します。 (英語版の Windows では、ホームフォルダの下に「Documents」と言うフォルダがあります。日本語版の場合は、「ドキュメント」になっているかと思います)

実行は、Windows では「Power Shell(パワーシェル)」を利用して行います。スタートボタンを押して、「Windows Power Shell」を開きます。これは、「コマンドライン」と呼ばれるもので、必要なコマンドをタイプして PC に伝えて利用するための仕組みです。

今回は、ホームホルダの「Documents」と言うフォルダの下に「HelloWorld.js」と言う名前で保存したので、実行する場合は以下のような「コマンド」をタイプして実行します。 (Node JS がインストールされているのが前提です)

PS C:\Users\TH>
PS C:\Users\TH> cd Documents
PS C:\Users\TH\Documents> node HelloWorld.js
Hello World
PS C:\Users\TH\Documents>

最初は、「cd」(Change directory)コマンドを実行して、保存したフォルダに移動します。移動すると、現在のフォルダの場所に表示が変わります。Power Shell を開いた時には標準では、ホームフォルダ(この場合、「\Users\TH」です)になっています。

作成したプログラムを実行するには、「node」の後に作成したプログラムのファイル名を指定します。エラーがある場合には、エラーメッセージが表示されます。エラーがない場合には、「Hello World」が表示されます。

今回のポイント

今回のポイントは以下の三つです。

  • VSCODE でプログラムの入力
  • console.log("xxxx")
  • node xxxx.js

VSCODE でプログラムを入力して、ファイル名を指定して保存します。 プログラムの中身は、「console.log("xxxx")」だけです。 これは、実行したコマンドラインに、「"」と「”」で囲った文字「xxxx」を表示すると言う指示を PC にするための書き方です。

実行は、Power Shell を開いて、プログラムのファイルを保存したフォルダに「cd」を使って移動して、「node [保存したプログラムのファイル名]」をタイプすると実行できます。

まとめ

超初心者向けに、プログラミングの連載を始める事にしました。 第一回目は、「Hello World」を表示するプログラムを作成して実行してみました。 Power Shell など、普段使い慣れない方法でプログラムを実行するので、分かりにくくて、面倒な印象を受けたかと思います。

最近の PC やスマホでは、「アイコン」と呼ばれるシンボルをクリックすれば、アプリを実行できるので、とても不便で面倒だと思います。しかし、プログラムは至ってシンプルで、1行で「Hello World」を表示できます。実は、アイコンをクリックして実行できるプログラムは、もっと複雑で色々な事をプログラムでやらないと作れません。

そこで、最初は、利用者には多少不便でも、まずは、一番シンプルなプログラムということで、実行は面倒ですが、一番簡単なプログラムとして、「Hello World」を取り上げてみました。

まずは、VSCODE と Node JS をインストールして、このシンプルなプログラムを実行する方法を覚えてください!

Copyright(c) 2017-2021 by Silicon Valley Super Ware, all rights reserved.

コメント

このブログの人気の投稿

ユーザーインターフェースの設計

足し算以外もできるようにする

改良版足し算プログラム