Node.jsってナンダ？JavaScriptってナンダ？

JavaScriptを使う時に絶対聞くこいつ

Node.jsについてしっかり理解していますか？

なんかReact,Vue.js,Next.jsで出てくるなあ

と思っている方...その通りです．

サーバーサイドのJavaScriptだよね

ほぼ正解です．

とりあえず

Javascriptで書くんじゃないの？

これが共通認識でしょう．

そもそもJavaScriptってナンダ？

そもそもjavascriptとはブラウザで動くことを想定とした言語である．一方PythonやJavaなどいわゆる一般的な言語はPCのOS機能にアクセスできる．

ブラウザで動く，とはPCのローカル上にアクセスせず，ChromeやSafari,Firefoxでしか動作をしないということである．

例えばJSがPCのOSの機能にアクセスできるとなると外部からサイトにアクセスしてきた人がOSにアクセスできるというとんでもないことになってしまう．

JavaScriptはブラウザを経由して限定的にOSへのアクセスをしている．

ここでNode.jsを使ったことがある人は以下のように思うのではないか？

Node.jsはJSで書かれているのにガッツリOSの機能触れるじゃないか

その通りです．

Node.jsってナンダ？

JSのみではブラウザ上でしか動かない仕様上どうしても使いにくい欠点があった．また，せっかくWebアプリを作るのならばブラウザで動く機能とOSで動く機能両方を1つの言語でかけるとすごく便利ですよね？

これを解決してくれたのがNode.jsである．

Node.jsとはよくサーバーサイドのJSと言われるがちょっと違って，先ほど述べた通り，ブラウザ＆サーバーの機能を持つため，サーバーサイドのJSとは限らない．
そのため，
Node.jsはWikipediaにも書いてある通り，Webフレームワークでもなく，フロントエンドのライブラリでもない，JavaScript実行環境である．

つまり，これでPythonやJavaのようにwebアプリが作れたり，APIが作れたりする．

ここで

じゃあReact,Vue.js,next.jsって...つまり...

と察した方，その通りです．

Node.jsは、React、Vue.js、Next.jsなどのフレームワークやライブラリと密接に関わっている．
ですが...それぞれの関係性を紹介する前にまずNode.jsと繋ぐためのものnpmについて紹介する．

npmってナンダ?

npm（Node Package Manager）は，Node.jsのパッケージマネージャーのこと．

パッケージマネージャー
ソフトウェアの開発に必要なライブラリ，フレームワーク，ツールなどのパッケージを管理するためのツール．

npmは以下のような役割がある．

パッケージの管理
プロジェクトで使用するパッケージ（ライブラリ）を簡単にインストール，更新，削除できる．
パッケージの依存関係も自動的に管理されるため，手動でパッケージをダウンロードしたり，依存関係を解決したりする必要がない．

パッケージの共有
npmは，オープンソースのパッケージレジストリを提供している．開発者は自身のパッケージを公開することで，他の開発者と共有できる．他の開発者が公開したパッケージを使うことで，開発の効率が大幅に向上する．

スクリプトの実行
npmを使って，プロジェクトに関連するスクリプト（コマンド）を定義し，実行できる．
例えば、開発サーバーの起動、テストの実行、ビルドの実行などのスクリプトを package.json ファイルに定義し，以下のnpm run コマンドで実行できる．

npm run

バージョン管理
npmは，パッケージのバージョン管理を行う．これにより，プロジェクトで使用するパッケージのバージョンを固定できる．
バージョンを固定することで、，パッケージの更新によって意図しない動作変更が起きることを防げる．

つまり，npmはNode.jsの開発において欠かせないツールであり，Node.jsの中心的な存在であると言える．React、Vue.js、Next.jsなどのフロントエンド開発でも，npmは広く使われている．

フレームワークとライブラリの違い

さらにNode.jsを知るためにはフレームワークとライブラリの違いを知っておく必要がある．

フレームワークは，アプリケーションの全体的な流れや構造を制御する．開発者は，フレームワークが提供する規約やルールに従ってコードを書くことになる． フレームワークは，開発者が書いたコードを呼び出す形で動作する．

ライブラリは，特定の機能を提供するツールである．アプリケーションの流れや構造は開発者が決定し，必要な時にライブラリの機能を呼び出して使う．

フレームワークとライブラリの区別は絶対的ではないと思う．例えば，Reactはライブラリと呼ばれることが多いが，Reactを中心にアプリケーションを構築する場合，Reactがアプリケーションの構造を大きく規定することになるため，フレームワークに近い性質を持つと言えるのではないかと思う．

つまり絵で表すとこのようであると言える．

Node.jsとReact,Vue.js,next.jsの関係性

これでやっと Node.jsとReact,Vue.js,next.jsの関係性について話せるので1つずつ説明する．

Node.js と React の関係

React はフロントエンドのJavaScriptライブラリで，UIの構築に使われる．
Reactの開発環境を構築する際に，まず，Node.jsが使われる．

例えば、Create React App (CRA) というReactプロジェクトの雛形を作成するツールは，Node.js上で動作する．

また、ReactコンポーネントをJSXで記述する際，BabelというトランスパイラがJSXをJavaScriptに変換するが，このBabelもNode.js上で動作する．

つまり，ReactはNode.jsが不可欠であり，実行環境としてガッツリ使っている．

Node.js と Vue.js の関係

Vue.jsは，フロントエンドのJavaScriptフレームワークである．
Vue.jsの開発環境の構築にもNode.jsが使われる．

例えば，Vue CLI というVue.jsプロジェクトの雛形を作成するツールは，Node.js上で動作する．

また，Vue.jsでもBabelが使われることがあり，その場合はNode.js上で動作する．

つまり，Vue.jsもガッツリNode.jsで実行している．

Node.js と Next.js の関係

Next.jsは，ReactをベースにしたフレームワークでSSR（サーバーサイドレンダリング）を実現できる．

Next.jsも，Node.js上で動作する．
つまり，Next.jsもガッツリNode.jsが必須である．
Next.jsを使ってSSRを行う際、サーバーサイドの処理はNode.jsで行われる．

ReactとVue.jsの違い

Reactは、UIを構築するためのJavaScriptライブラリである．コンポーネントベースのアプローチで，仮想DOMを使って効率的にDOMを更新する．Reactはビューに特化したライブラリで，状態管理やルーティングなどの機能は別のライブラリ（Redux, React Router）を使って実現する．

Vue.jsは，包括的なフレームワークと呼ばれることが多い．Vue.jsは，UIの構築に加えて，状態管理（Vuex）やルーティング（Vue Router）などの機能も公式ライブラリとして提供している．これらのライブラリはVue.jsと深く統合されており，シームレスに使うことができる．

混乱するかもしれないが...（私個人の意見としては）
Vue.jsのコアライブラリ自体はビューに特化しており，その意味ではライブラリと呼ぶこともできるだろう．また，Reactも，Reduxなどの状態管理ライブラリと組み合わせることで，フレームワークのような使い方ができる．

コンポーネントベースについては以下の記事で
[鋭意製作中]

Node.jsで何ができるのか

ここでNode.jsってUIなどフロントエンドからサーバーサイドのバックエンドもできることがわかった．結局何ができるのかまとめてみた．

Webアプリ

例えばPythonでwebアプリを作るのであればDjango,Flaskなどがフレームワークとして挙げられる．
RubyならRuby on Railsというように，
Node.jsならNext.jsを使う，といった形でWebアプリを作れる．

Wikipediaにも書いてあるが，元々，Node.jsは大規模な同時接続を処理できるためのプラットフォームとして開発された．極端に言えばnginxやApacheのようなことも可能である．つまり，HTTPリクエストの受け取り，処理も可能だ．

モバイルApp

Node.jsはモバイルアプリケーションを作るためのフレームワークであるReactNativeがある． JS自体がReactのようにUI面において多くの機能を持っていることから，同じようにモバイルアプリに転用できる．また，JSで書かれていることもあり，Kotlin,JavaベースのAndroidアプリ開発やSwiftベースのiOSアプリ開発に手を出しづらい開発者にも人気である．Android,iOSの壁を感じることなく開発でき，クロスプラットフォームでのアプリケーションを作成できる．

ほとんどのネイティブ機能（Android,iOS独自の機能）はJavaScriptから使えるが，一部の高度な機能（例：ARKit、Android Fragment）を使うにはネイティブのコード(KotlinやSwift)を書く必要があ流．

デスクトップアプリ

Node.jsは他にもデスクトップアプリケーションを作るためのフレームワークであるElectronがある．ElectronもWindows，Mac，Linuxでのクロスプラットフォーム開発が可能である．
有名アプリだと，VSCode，Discord，Slackはこれで作られている．

コード検証ツール

Eslintといった静的コード検証ツールが使える．コードを実行せずにコードを解析し，潜在的なバグ，スタイルの不一致，アンチパターンなどを検出できる．

以下の記事で詳しく説明する
[鋭意製作中]

他にも，もっと多くの使い方があるNode.jsはとんでもないものだと思った．とりあえずNode.jsさえ使えれば(大抵のことは)なんでもできるのではないだろうか？