Node.jsの環境構築はたったの数分!驚くほど簡単にできる環境構築の手順まとめ

2018.11.09  /  2019.06.16 Node.js
Node.jsの環境構築はたったの数分!驚くほど簡単にできる環境構築の手順まとめ

私が勤めるWEB系の会社で、Node.jsをベースにしたgulpが導入されました。

コードに触る人数が増えたことを受けて、コードの質を保つために先週から試験導入していましたが、ついに来週月曜日からの正式導入となりました。

一昨日、自分のPCに導入する際に先輩プログラマーから簡単な仕組みについて教えてもらったのですが、その説明がほとんど日本語に聞こえませんでした(笑)。

gulpどころかNode.jsについても全く知識がない…。
そこで、これを機にNode.jsに触れてみようと思い立ちました。

そこで、まずは環境構築をしてみたのでその手順をまとめます。

Node.jsとは?gulpとは?ざっくり説明

Node.jsとは

JavaScriptといえばWebページに動きをつける(スムーススクロール、ポップアップ表示など)クライアントサイドとして活用される場面が多いですが、実はサーバーサイドでも動かせます。

サーバーサイドJavaScriptの中でも一番有名なのがNode.jsで、MicrosoftやYahoo!など大手企業でも推奨されています。

もともと、クライアントサイドもサーバーサイドもJavaScriptで統一できたら、開発が楽じゃん?ということで脚光を浴びました。

gulpとは

Node.jsをベースにしたビルドシステムヘルパーで、様々なタスクを自動化できるツールです。
具体的には、CSSやJavaScriptの圧縮や、Sassの自動コンパイルなどを自動で行ってくれるもの

私の会社では、Sassのコンパイル、各種コードのインデント調整、FTP接続・アップロードなどを行ってもらうことになりました。

Node.jsの環境構築

個人的にJavascriptに少し苦手意識があったので、Node.jsも難しそう……と勝手に思ってしまいました。

そして新しい言語を触ってみるにはそれに合わせた開発環境の構築が必要なんですが、私は開発環境の構築が大の苦手。
(まあ、あまり環境構築が好きな人もいないと思いますが)

苦手意識 × 苦手意識。

さぞや苦労するだろうな、と思ったのですが、実はNode.jsの環境構築はめちゃくちゃ簡単でした。

それはもう拍子抜けするくらい簡単。

まずざっと必要な手順はこちら。

  1. 公式サイトからNode.jsをダウンロードしてインストール
  2. Node.jsと一緒にインストールされるnpmにお任せしてpackage.jsonを自動作成
  3. npmに必要なものをインストールしてもらう

以上。

各種インストールは半自動なので、あまり考えることはありません。

公式サイトからNode.jsをダウンロードしてインストール

Node.jsの公式サイトはこちら。

こちらで、自分の環境にあったものをダウンロードします。
特別な理由がなければ、最新版ではなくLTS(推奨版)を選びます。

以下、画面はmac OS 環境のものになりますが、Windows環境も必要な手順は変わりません。

Node.js公式サイト

案内にそって次へ進んでいくだけで、基本的に特別な設定などは必要ありません。
インストールが完了したら、ターミナルで以下のコマンドを叩きます。

node -v

その結果、バージョンが表示されたら成功です。
私は、v10.13.0をインストールしました。

Node.jsと一緒にインストールされるnpmにお任せしてpackage.jsonを自動作成

Node.jsをインストールすると、一緒にnpm(Node Package Manager)もインストールされています。
これは、Node.jsのライブラリやパッケージを管理してくれるスグレモノ。

作業用フォルダを用意したら、ターミナル(Windowsならコマンドプロンプト)でそのフォルダを開き、初期化コマンドをたたきます。

npm init

すると、下記項目を順に聞いてくるので答えていきます。

  • package name – パッケージ名
  • version – バージョン名
  • description – 概要説明
  • entry point – 初期表示させるファイル名
  • test command – テストコマンド
  • git repository – Githubに保存するリポジトリ情報
  • keywords – npmの公開時に使用されるキーワード
  • author – 作者情報
  • license – npmの公開時に適用する権利情報

やや面食らうかもしれませんが、一般にリリースするものでなければ適当でいいようです。
私はすべてEnterを押して初期設定のままにしました。

すると「package.json」というjsonファイルが自動で作られます。

npmに必要なものをインストールしてもらう

ここまでで最低限必要な準備が整いました。
かかった時間は3分ほど。

あとは、開発するのに必要なパッケージなどをnpmを使ってインストールするだけ。
試しに、mysqlをインストールしてみます。

package.jsonのあるフォルダで、以下のコマンドをたたきます。

npm install mysql

npm install [インストールしたいパッケージ名] です。

すると、「package-lock.json」ファイルと、インストールされたものが入った「node_module」フォルダが生成されます。

パッケージをインストールした状態

インストールの際、以下のような警告がでることがあります。

npm WARN nodejs@1.0.0 No description
npm WARN nodejs@1.0.0 No repository field.

初期設定項目の入力時にいくつかの項目を空白にしていたためですが、開発に関係ないので無視して構いません。

これで環境構築は終了。
もう開発にはいれます。

トータルの所要時間は5分かかりませんでした。

ちなみに、インストールしたパッケージをアンインストールするときも、以下のコマンド一発でいけます。

npm uninstall [パッケージ名]

まとめ

実際に設定してみて、なにこれ、めちゃくちゃ簡単じゃん!と心底思いました。

以前windows環境にRubyとRuby on Railsをインストールしたときには、よくわからないエラーがでて丸一日潰したことがありますが、それとは雲泥の差。
あの時は、根気よくエラーを告げてくるコマンドプロンプトに悪態をつきながら、何度投げ出そうと思ったことか……。

調べてみると、ネット上でも気軽にNode.jsの勉強ができるサイトやツールが多数あるようで、学習の敷居はかなり低いですね。

これからいろいろ試してみます。

スキルアップしたいサイト制作者
向けの情報をつぶやくよ 藤ミヤチのTwitter
(ここをクリック/タップ)



LINE@で特別レクチャーなどの情報を発信中!
友だち追加

シェア