Nodejs 開発環境について何を学びますか?-フロントエンドQ&A-php.cn

Nodejs 開発環境について何を学びますか?

PHPz

リリース： 2023-04-18 09:42:22

オリジナル

613 人が閲覧しました

Node.js 開発環境学習メモ: インストールから開発実践まで

Node.js は、Chrome V8 エンジンをベースにした JavaScript 実行環境で、コードの開発や JavaScript アプリケーションの実行を簡単に行うことができます。サーバーサイドのものを含む Web アプリケーション。 Node.js 開発を始める前に、まず開発環境を準備する必要があります。この記事では、Node.js 開発環境の準備方法と基本的な開発実践方法を紹介します。

Node.js のインストール

Node.js を開発するには、まず Node.js をインストールする必要があります。 Node.js 公式 Web サイトから最新バージョンの Node.js をダウンロードしてインストールできます。インストール中にデフォルト設定を選択できます。

IDE のインストール

適切な IDE を選択すると、開発効率が大幅に向上します。一般的に使用される IDE には、Visual Studio Code、WebStorm、Sublime Text などが含まれます。自分の好みやニーズに応じて選択できます。この記事では、開発ツールとして Visual Studio Code (以下、VS Code) を選択します。

Node.js プロジェクトの作成

VS Code で空のフォルダーを開き、メニューバーの [ターミナル] - [新しいターミナル] からターミナルを開くことができます。ターミナルで次のコマンドを入力して、単純な Node.js プロジェクトを作成します:

mkdir my-node-project
cd my-node-project
npm init

ログイン後にコピー

このコマンドを実行すると、いくつかのプロンプトが表示されます。対応する質問に答えて package.json ファイルを作成できます。このファイル名前、バージョン、依存関係など、プロジェクトに関する基本情報が含まれています。依存関係フィールドは、プロジェクトの依存関係を説明するために使用されます。Node.js はこのフィールドを使用して、必要なモジュールを自動的にダウンロードしてインストールします。

モジュールのインストール

npm コマンドを使用してモジュールをインストールできます。ターミナルでプロジェクトのルートディレクトリを入力し、次のコマンドを実行して Express モジュールをインストールします。

npm install express

ログイン後にコピー

Express アプリケーションを作成する

Node をよりよく理解するために.js 開発の練習のために、簡単な Express アプリケーションを作成できます。 VS Code のターミナルで、次のコマンドを入力して app.js ファイルを作成します:

touch app.js

ログイン後にコピー

app.js に次のコードを入力します:

// 引入 express 并创建一个 express 对象
const express = require('express')
const app = express()

// 定义路由
app.get('/', (req, res) => {
  res.send('Hello World!')
})

// 监听端口
app.listen(3000, () => {
  console.log('应用程序已启动，访问 http://localhost:3000')
})

ログイン後にコピー

コードは次のように説明されます:

行 1: require を使用して Express モジュールを導入し、初期化して Express オブジェクトを作成します。
行 4 ～ 6: ユーザーがルートパスにアクセスしたときに「Hello World!」という文字列を返すルートを定義します。
行 9: Express オブジェクトの listen() メソッドを使用して、ポート 3000 をリッスンします。ユーザーがこのポートにアクセスすると、定義されたルートが実行されます。

アプリケーションの実行

アプリケーションを実行するには 2 つの方法があります。1 つはターミナルからコマンドラインを入力してプログラムを開始する方法、もう 1 つはターミナルからコマンドラインを入力してプログラムを開始する方法です。もう 1 つは、VS Code でプログラムを開始することです。デバッグ機能を使用します。以下は 2 つのメソッドの具体的な実装です。

方法 1: ターミナルからコマンドを入力します。

VS Code のターミナルで、次のコマンドを実行します。

node app.js

ログイン後にコピー

次に、ブラウザを開いて http:// にアクセスします。 localhost:3000 では、「Hello World!」応答が表示されます。

方法 2: VS Code のデバッグ機能を使用する

VS Code の左側のパネルで、デバッグアイコンをクリックしてデバッグパネルを開きます。次に、[構成の追加]をクリックし、Node.jsを選択します。 VS Code は、プロジェクトのルートディレクトリに .vscode フォルダーを作成し、その中に launch.json ファイルを作成します。 launch.json ファイルで、構成項目を次のように変更します。

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Node: Launch Program",
      "program": "${workspaceFolder}/app.js",
      "restart": true,
      "protocol": "inspector"
    }
  ]
}

ログイン後にコピー

コードの説明は次のとおりです。