Node.js, ExpressでWebApplication
Node.jsを使って、Webアプリを作ってみようと思います。
使いたい技術、要件としては、以下の通り。一般的なWebアプリで使われる要素＋IoTの要素を取り入れておきたいと思います。
・フレームワークは王道のExpressを使う
・MQTTを使ってメッセージを受信する
・Databaseに保存する
・UIはcssフレームワークのbootstrapを使ってみる
まずは、環境構築から。
AWSのアカウント作ったので、無料枠範囲内で実施してみます。
※ -----
この無料枠、よく調べておかないとすぐ超えてしまうかもしれません。
EC2インスタンスは750時間で、1か月連続稼働がOKという文言が目に入りますが、これは1台の場合であることに注意！つまり、インスタンス時間です。2台であれば375時間になります。EC2インスタンスは、何台でも簡単に作れてしまうので、ついつい作ってしまいがちなので注意です。
※ -----
AWSのEC2のインスタンスタイプ（スペック）は、無料のt2.microを作成しました。
vCPU : 1core, Strage : 8G, Memory : 1Gと、無料だけあってやや非力ですね。。。
OSは、Amazon Linuxで作成しました。Amazon LinuxはRedHat系ですね。（個人的には、Ubuntu/Debian系のお手軽さが好みですが。）
|||■||| Node.jsセットアップ |||■|||
Node.jsのセットアップ方法はいろいろありますが、nvmからインストールします。
Gitリポジトリが以下にあります。
Installationに書かれている通りcurlでインストール。
$ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.5/install.sh | bash
~/.nvmにインストールされて、~/.bashrcにコマンドが追加されます。
初回はコマンドを使えるようにsourceします。
$ source ~/.bashrc $ nvm --version 0.33.5
Node.jsはnvmで好きなVersionをインストールできます。ls-remoteでNode.jsのVersionを確認できます。
$ nvm ls-remote
2017.10.22時点最新のv.8.7.0をインストール。同時にNode.jsのPackageManagerのnpmもインストールされます。
npmについてはこちらが参考になります。
$ nvm install v8.7.0 $ node -v v8.7.0 $ npm -v 5.4.2
完了です。Node.js自体はとても簡単にインストールできます。
|||■||| Expressのインストール |||■|||
Node.jsのWebアプリケーションフレームワークのExpressをインストールします。
Express - Node.js web application framework
まずは、npmのベースとなるpackage.jsonを作成。
$ npm init
対話形式で質問に答えていくと、package.jsonができます。
{
"name": "my-web-app",
"version": "0.0.1",
"description": "sample web application",
"main": "app.js",
"scripts": {
"test": "test"
},
"author": "Tuna",
"license": "MIT",
}
Expressのインストールは、以下の通り。
$ npm install express --save
npm5からpackage.jsonとpackage-lock.jsonが生成されるようになったようです。
package-lock.jsonは、環境の違い、Versionの違いによるエラーを回避するために作成されるようです。詳しくはこちら。
yosuke-furukawa.hatenablog.com
|||■||| お試しアプリ作成 |||■|||
Expressのお試しアプリを作ってみます。
$ vi app.jp
/*!
* My Web Application Sample
*/
// requires
let express = require('express');
// express instance
let app = express();
// start web server
let server = app.listen(3000, () => {
console.log('web server start');
});
// responce greating page
app.get("/", (req, res, next) => {
res.end("Hello Web Server");
});
EC2インスタンスのセキュリティグループで3000番ポートを開放し、
http://EC2-IP-address:3000/
にアクセスすると、Hello Web Serverが表示されました。
次回は、express-generatorを使って、フレームワークを生成し、Web Applicationを作りこんでいきたいと思います。
■ その他参考
Google Web Starter Kit
ES6
