【開発環境 Mac OS編】Node.jsの導入方法とバージョン管理
Node.jsってなに？
よく「Node.jsを使って〇〇を制作する」というのを見たり聞いた事はありませんか？
Node.jsって何をするのか全くわからないという方もいると思います。
結論から言うと、Node.jsの正体は「JavaScriptを利用した開発環境と実行環境」を提供してくれるものです。
決してJavaScriptの新しいフレームワークではないのでご注意ください。
JavaScriptを使って開発や制作を効率化したり、実行できる環境を作るためのツールと考えて下さい。
Node.jsが動く環境
まず最初に確認ですが、JavaScriptは「ブラウザ」で実行する事ができます。
パソコンやスマホなどの端末(クライアント側)のブラウザで動作する、フロントエンド言語に分類されます。
【フロントエンド: ブラウザ】
・ HTML
・ CSS
・ JavaScript
【バックエンド: サーバー】
・ PHP
・ Ruby
・ Go
・ Java
・ Python
Node.jsは「クライアント側」と「サーバー側」の両方でJavaScriptを扱えるようにする環境を用意してくれます。
クライアント側のNode.jsは、主にWebサイトを制作する時に効率良く作れる環境を提供してくれます。
サーバー側のNode.jsは、PHPなどのバックエンド言語で書かなくても、バックエンドの処理をJavaScriptで実行出来る環境を提供してくれます。
つまり、 Node.jsはクライアント側とサーバー側の両方で動かす事が出来るのです。
Node.jsで出来ること
Node.jsは、クライアント側とサーバー側の両方でJavaScriptを実行可能な環境を提供してくれるものとわかりました。
ですが、具体的に何が出来るのかは、まだ想像できないですよね。
Node.jsは主にこのような事が出来ます。
【クライアント側】
・ローカルファイルの取得と書き換え
・ ファイルサイズの削減(minify化)
・ 画像の圧縮
・ Sass(SCSS)からCSSの変換
・ VueやReactのプロジェクト作成
【サーバー側】
・ JavaScriptの実行
・ サーバーの構築
このように、クライアント側で出来る事が多いです。
おそらく、ほとんどの方は開発時の効率化が目的でNode.jsを導入するのでないかと思います。
また、JavaScriptだけでSNSログインやデータベースを使ったWebアプリを作ることが出来るので、用途に合わせて柔軟に対応してくれるのがNode.jsです。
ここでNode.jsの注意点も一緒に説明したいと思います。
Node.jsは頻繁に改善されていて、バージョンがどんどん変わります。
以前使ってたNode.jsのバージョンでは動いていたけど、新しいバージョンではエラーが出るようになって動かなくなる事が割とよくあります。
なので、Node.jsのバージョンをアップデートする際は注意して行うようにして下さい。
Sass(SCSS)からCSSの変換する方法はこちらで紹介しています。
- 【環境構築 Mac OS編】Gulpで開発環境を自動化!?Sassの導入と便利な使い方
Node.jsの導入
Node.jsについてわかったところで、さっそく導入方法について解説していきます。
まず、Node.jsをどこに導入するかについてですが、今お使いのMac本体の中に入れます。
そして、導入する際は「コマンド」と呼ばれる文字でパソコンを操作する方法で進みます。
少し難しい部分があるかも知れませんが、細かく解説していくので一緒に頑張っていきましょう。
導入手順
さっそく、MacにNode.jsを導入するのですが、その前にいくつか準備をする必要があります。
まず導入するものは下記の2つです。
【導入するもの】
1. Homebrew
2. Node.js
いきなりNode.js以外にも「Homebrew」というのが出てきました。
この「Homebrew」は、Node.jsのバージョンを変更したり消去するといった管理を簡単にしてくれるツールです。
正直「Homebrew」が実際なくてもNode.js本体を導入する事は出来ますが、管理が面倒くなる可能性があります。
なので、まず「Homebrew」を入れてから「Node.js」という順番で進めていきます。
