狼読

2021/06/03

【Mac】Node.jsを使ってみよう

前回、Node.jsをインストール（最新バージョンへのアップデート）をしたので、Node.jsを使ってみたいと思います。

Node.jsのインストールや最新バージョンへのアップデートがまだの場合は、下記の記事を参考にしてみてください。
【Mac】nodebrewでNode.jsをインストール（アップデート）する方法

npmのアップデート

npmとは、「Node Package Manager」の略で、名前のとおりNode.jsのパッケージを管理するパッケージマネージャーです。

npmは別段インストールしなくても、Node.jsのインストール時に一緒にインストールされます。知らず知らずのうちにインストールされていることが多いので、バージョンが古い可能性があります。
そこで、npmでパッケージをインストールしていく前に最新バージョンにアップデートしておきましょう。

まず、npmのバーションを確認してみましょう。

$ npm -v

7.13.0

現在のバージョンは、7.13.0みたいです。では、アップデートしていきましょう。

$ npm update -g npm

アップデートが完了したら、再度バージョンを確認してみましょう。

$ npm -v

7.15.1

アップデート前：7.13.0　→ アップデート後：7.15.1　アップデートされたことが確認できます。

npm init で初期化

npm init とは、初期化するための処理です。結論から言うと npm init を実行することで、 package.json が生成されます。パッケージを管理するうえでpackage.jsonは必要となります。

$ npm init

上記コマンドを実行すると設定を色々と聞かれますが、全て無回答でもそれ自体が問題になることはありません。

今回は以下のようにpackage.jsonを作成しました。

{
  "name": "sampleapp",
  "version": "1.0.0",
  "description": "node.js_sample",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "roudoku",
  "license": "ISC"
}

これで初期化は完了です。

npm でパッケージをインストール

今回は、Node.jsの有名なフレームワークExpressをインストールしてみましょう。

$ npm install express

インストールが完了すると新たに「node_modules」というディレクトリが生成されます。また、先ほど生成したpackage.jsonの中身も確認してみましょう。

# package.jsonの中身
{
  "name": "sampleapp",
  "version": "1.0.0",
  "description": "node.js_sample",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "roudoku",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.1"
  }
}

インストールしたExpressの内容が追記されていると思います。（以下の部分）

"dependencies": {
    "express": "^4.17.1"
  }

ブラウザにテキストを表示してみよう

以下のような内容でjsファイルを作成しましょう。今回は、ファイル名をindex.jsとしています。

var express = require("express");
var app = express();
const http = require("http").createServer(app);

app.get("/", function(req, res){
  res.send("表示されれば成功です！！");
});

http.listen(3000, ()=>{
  console.log("listening on *:3000");
});

index.jsが作成できたら、サーバーを起動しましょう。