プロジェクトを作る
ゼロから本物の Node.js プロジェクトをセットアップする
⏱ 想定 ~9 分
01 · 読む
あなたが触ってきたソフトウェアはすべて — スマホアプリから巨大なウェブサイトまで — こうやって始まりました。誰かが空のフォルダを作り、その中にプロジェクトを立ち上げたのです。あなたもこれからやるのは、まさにそれです。
最初にプロジェクトをきちんとセットアップすると、あとで大量の手間を省けます。Node.js の プロジェクト とは特別なものではなく、package.json という設定ファイルを持つフォルダのことです。これがプロジェクト名、バージョン、依存パッケージを記録します。これがないと、npm のようなツールはプロジェクトが何を必要としているか、どう動かすかを知る手がかりがありません。
新しいアパートに引っ越すと考えてください。内装を整えたり友達を招いたりする前に、まず賃貸契約を結び、鍵を受け取る必要があります。npm init がその賃貸契約に当たります。それが正式な書類(package.json)を作り、「このフォルダは本物のプロジェクトです」と宣言します。
💡 想像してみてくださいプロジェクトを始めるのは、新しいアパートに引っ越すようなものです。内装も改築もできるようになる前に、賃貸契約(npm init)を交わし、それを有効にする正式な書類(package.json)を受け取る必要があります。
ポイントまとめ
- Node.js プロジェクトはすべてフォルダと package.json から始まります
- package.json はプロジェクトの身分と依存パッケージを記録します
- 最初に正しくセットアップしておくと、プロジェクトが大きくなっても散らかりません
02 · 実機演習
プロジェクトはフォルダから始まります。my-server というフォルダを作って、中に入りましょう。次の 2 つのコマンドでディレクトリを作り、移動します。
mkdir my-server && cd my-server
03 · 実機演習
では npm でプロジェクトを初期化しましょう。-y フラグは「すべてデフォルトで」という意味で、質問をスキップして設定ファイルをすぐ作ります。
npm init -y
04 · クイズ
npm init -y の -y フラグは何をしますか？
- 最新版の npm をインストールする
- yarn.lock ファイルを作る
- すべての質問をスキップしてデフォルト値を使う
- Yes、既存ファイルを削除する
05 · 実機演習
npm が何を作ったか見てみましょう。package.json はすべての Node.js プロジェクトの心臓で、プロジェクトを説明し、依存パッケージを管理します。
cat package.json
06 · 空欄補充
プロジェクトの依存パッケージを管理するファイルは _____ という名前です。
07 · 読む
package.json の各フィールドの意味は次のとおりです。- name — プロジェクト名(デフォルトはフォルダ名) - version — プロジェクトのバージョン番号(1.0.0 から始まります) - description — プロジェクトの目的を簡潔に書いたもの - main — エントリーポイントのファイル(他の人があなたのプロジェクトを import するときに動くファイル) - scripts — npm run <name> で実行できるカスタムコマンド - keywords — npm に公開したときの検索タグ - license — 他の人がコードをどう使えるか
まもなく使うことになる、もっとも重要なフィールドは dependencies です。これがプロジェクトに必要なパッケージを並べます。今はまだ何もインストールしていないので空です。
ポイントまとめ
- package.json はすべての Node.js プロジェクトの設定ファイルです
- npm init -y は妥当なデフォルト値で作成します
- dependencies フィールドはプロジェクトが使うパッケージを記録します
08 · クイズ
npm install express を試したら、package.json がないというエラーが出ました。何を先にすべきですか？
- Node.js をもう一度インストールし直す
- express.js というファイルを手動で作る
- 代わりに node install express を実行する
- npm init -y を実行して package.json を作る
⚠ 全機能のインタラクティブ体験には JavaScript が必要です。JavaScript を有効にして再読み込みしてください。
※ このサイトは独立した教育プロジェクトで、Anthropic の公式製品ではありません。Claude™ は Anthropic, PBC の商標です。