Node.jsとは？

Node.jsは、Googleが開発したV8 JavaScriptエンジンを使用し、サーバーサイドのJavaScriptアプリケーションを実行するためのランタイム環境のこと。わかりやすくすると、本来ブラウザ上でのみ動作するJavaScriptを、パソコン上で実行できる環境を作れるということ。
これにより、ブラウザ上では実現できなかったサーバーサイド（OS機能等）へのアクセスを実現し、自由にファイルの読み書きやネットワーク通信を実現できる。
また、Node.jsでは、高速でスケーラブルなネットワークアプリケーションを開発するための豊富なツールとライブラリが提供されているのも特徴の一つで、ウェブサーバーやAPIサーバー、ストリーミングサーバー、リアルタイム通信アプリケーションなど、さまざまな種類のアプリケーションの開発に利用できる。

Expressとは？

Expressは、複雑なWebアプリを効率よく開発できるようにさまざまなモジュールが統合されたフレームワークで、特に、独自のサーバー開発やGET/POST通信などを簡単な記述で実現できるフットワークの軽さは魅力的。

環境開発

ディレクトリを作成する

mkdir　<プロジェクト名>

package.jsonを作成する

npm init -y

expressとnodemonをインストールする

npm i express nodemon

server.jsを作成する

touch server.js

expressを使いローカルサーバーを立ち上げる

server.jsを下記のように編集する

server.js

//express を呼び出す
const express = require('express');
//インスタンス化をする
const app = express();
//PORTを指定する
const PORT = 3000;
//expressを使い、ローカルサーバーを立ち上げる
app.listen(PORT, () => console.log('サーバーが起動しました'));

npm run devを実行し、『サーバーが起動しました』の表示を確認する

npm run dev

routesフォルダを作成する

routesディレクトリを作成する

mkdir routes

routes内に user.jsを作成する

touch user.js

routes/user.js

//express を呼び出す
const express = require('express');
//expressでルーティングの設計をするためにrouter関数を用意する
const router = express.Router();

router.get('/', (req, res) => {
  res.send('ユーザーです');
});

router.get('/info', (req, res) => {
  res.send('ユーザー情報です');
});
//ランダムの文字列をエンドポイントに設定する
router.get('/:id', (req, res) => {
  res.send(`${req.params.id}のユーザー情報を取得しました`);
});

//ルーターの情報をserver.jsにインポートする
module.exports = router;

server.js

//express を呼び出す
const express = require('express');
//インスタンス化をする
const app = express();
const useRouter = require('./routes/user');
//PORTを指定する
const PORT = 3000;
//静的な画面を作成する
app.use(express.static('public'));
//getメソッド　ルートディレクトリを指定してページを表示する
app.get('/', (req, res) => {
  //console.log('hello express');
  //res.send('<h1>こんにちは</h1>');
  res.status(500).json({ msg: 'エラーです' });
});
//ルーティング
app.use('/user', useRouter);

//expressを使い、ローカルサーバーを立ち上げる
app.listen(PORT, () => console.log('サーバーが起動しました'));

publicフォルダを作成する

ディレクトリを作成する

mkdir public

publicフォルダ内にindex.htmlを作成する

touch index.html

server.js

//express を呼び出す
const express = require('express');
//インスタンス化をする
const app = express();
const useRouter = require('./routes/user');
//PORTを指定する
const PORT = 3000;
//静的な画面を作成する publicフォルダの中にHTMLファイルを作成する
app.use(express.static('public'));

//テンプレートエンジンを使うことができる"ejs"
app.set('view engine', 'ejs');

//getメソッド　ルートディレクトリを指定してページを表示する
app.get('/', (req, res) => {
  //console.log('hello express');
  //res.send('<h1>こんにちは</h1>');
  res.status(500).json({ msg: 'エラーです' });
});
//ルーティング
app.use('/user', useRouter);

//expressを使い、ローカルサーバーを立ち上げる
app.listen(PORT, () => console.log('サーバーが起動しました'));

テンプレートエンジンをインストールする

npm i ejs

viewsフォルダを作成する

ディレクトリを作成する

mkdir views

publicフォルダ内にindex.ejsを作成する

touch index.ejs

views/index.ejs

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>
  <body>
    <!-- テキスト情報を読み込む -->
    Hello, World!　<%= text %>
  </body>
</html>

server.js

//express を呼び出す
const express = require('express');
//インスタンス化をする
const app = express();
const useRouter = require('./routes/user');
//PORTを指定する
const PORT = 3000;
//静的な画面を作成する publicフォルダの中にHTMLファイルを作成する
//app.use(express.static('public'));
//テンプレートエンジンを使うことができる"ejs"
app.set('view engine', 'ejs');

//getメソッド　ルートディレクトリを指定してページを表示する
app.get('/', (req, res) => {
  //console.log('hello express');
  //res.send('<h1>こんにちは</h1>');
  //res.status(500).json({ msg: 'エラーです' });
  res.render('index', { text: 'NodejsとExpress' });
});
//ルーティング
app.use('/user', useRouter);

//expressを使い、ローカルサーバーを立ち上げる
app.listen(PORT, () => console.log('サーバーが起動しました'));

ミドルウェアを作成する

※ミドルウェアとは？
ミドルウェア（middle ware）とは、業務遂行に必要な機能を提供するアプリケーションとコンピュータの基本機能を提供するOSの間に位置し、さまざまな働きをするソフトウェアのこと。

server.js

//ミドルウェアを宣言する
app.use(mylogger);

//ミドルウエア
function mylogger(req, res, next) {
  console.log(req.originalURL);
  next();
}

参考サイト

【Express入門】Node.jsでWebアプリケーションの作り方を１から学ぼう！
Node.js とはなにか？できることを初心者にもわかりやすく解説
 【Node.js入門】初心者のためのExpress入門（GET / POST）
【Express】Node.jsを学んでみる　最初の一歩
 ミドルウェアとは？ミドルウェアの種類や機能を徹底解説