Help us understand the problem. What is going on with this article?

Node.js Expressフレームワークを使用する(ひな型作成)

はじめに

前回の投稿でExpressフレームワークを前準備しましたので、次にexpressコマンドでひな型を生成します。

環境

OS:Windows 10 Pro 64bit
node.js:v12.16.1
npm:v6.13.4
Express:v4.16.1

ひな型の生成

expressコマンドで生成します。
あらかじめコマンドプロンプトで作業フォルダに移動します。
今回は「D:\Node\ExpressTest01」を作業フォルダにします。

D:
CD Node\ExpressTest01

移動しましたら、次のコマンドでひな型を生成します。

express --view=ejs

「--view=ejs」オプションはテンプレートエンジンにEJSを使用すると言う意味になります。

D:\Node\ExpressTest01>express --view=ejs

   create : public\
   create : public\javascripts\
   create : public\images\
   create : public\stylesheets\
   create : public\stylesheets\style.css
   create : routes\
   create : routes\index.js
   create : routes\users.js
   create : views\
   create : views\error.ejs
   create : views\index.ejs
   create : app.js
   create : package.json
   create : bin\
   create : bin\www

   install dependencies:
     > npm install

   run the app:
     > SET DEBUG=expresstest01:* & npm start

これでひな型は生成されました。
Visual Studio Codeで開きますとこのようになります。
express01.jpg

使用するライブラリの一括インストール

次のコマンドを実行して、ライブラリの一括インストールを行います。

npm install

npmはpackage.jsonの「dependencies」に指定されているライブラリを一括インストールする機能があります。
ひな型を生成した際に、必要なライブラリ情報が全て記載されるので便利です。

D:\Node\ExpressTest01>npm install
npm notice created a lockfile as package-lock.json. You should commit this file.
added 53 packages from 38 contributors and audited 141 packages in 5.167s
found 0 vulnerabilities

動作確認

コマンドプロンプトで次のコマンドを実行します。

npm start
D:\Node\ExpressTest01>npm start

> expresstest01@0.0.0 start D:\Node\ExpressTest01
> node ./bin/www

ブラウザで「http://localhost:3000」にアクセスします。
次のキャプチャが表示されればOKです。
express02.jpg

コマンドプロンプトには次のように表示されます。

GET / 304 14.612 ms - -
GET /stylesheets/style.css 304 1.752 ms - -

停止したい時は「Ctrl + C」です。
「バッチ ジョブを終了しますか (Y/N)?」と聞かれますので、「Y」を入力します。

バッチ ジョブを終了しますか (Y/N)? Y

まとめ

このような流れでひな型を生成します。

t_skri
OS、ネットワーク、プログラミング、何でもやる社内SEです。
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away