フロント関連の用語まとめ

フロントエンド開発を始めた時に、よく耳にした用語をとっても簡単にまとめています。
Next.jsやReactは今後もっと詳しくまとめたいなと思っています。

Node.js

• Node.jsは、JavaScriptをブラウザ以外の環境でも動かせるようにするためのツール
• 元々、JavaScriptはブラウザ内でWebページに動きをつけるための言語だったが、Node.jsによってサーバーやローカル環境でも利用できるようになった

主な使用例

1. フロントエンド開発:
   • ローカルサーバーを起動し、ブラウザでHTML、CSS、JavaScriptを動かす際に利用
   • 開発環境を整えるためのツールの実行にも使われる
2. サーバーサイド開発:
   • サーバーサイドの処理にもNode.jsを使用することで、フロントエンドとバックエンドの両方をJavaScriptで統一できる

npm (Node Package Manager)

• npmは、Node.jsに付属している「パッケージ管理ツール」
• パッケージとは、再利用可能なコードのまとまりで、npmを使うことでこれらを簡単に管理できる

主な特徴

• 必要なライブラリをインストールし、その依存関係も自動で管理してくれる
• コマンド一つでプロジェクトに必要な外部ツールやライブラリを導入できる

yarn

• yarnは、Facebookが開発したnpmの代替ツール
• npmよりも高速で信頼性が高いとされている

主な特徴

• パッケージの管理を効率化
• npmと同様にライブラリの依存関係を管理
• 使用するには別途インストールが必要

---

React

• Reactは、JavaScriptの「UIを作るためのライブラリ」（※フレームワークではない）
• コンポーネントベース（画面の要素みたいなもの）で作成するのが特徴

Next.js

• Next.jsは、Reactをベースにしたフレームワーク
• ReactでWebアプリケーションを開発する際の作業を効率化してくれるツール一式が揃っている