node、express4使用時のルーティングについて

###前提・実現したいこと
最近node、express4のフレームワークを使ってwebプログラムを組む練習をはじめました。
express-generatorで雛形を作って開発しています。
urlアクセスに対してのルーティングサンプルを見ると

・viewsフォルダにejsファイルを配置

html
1<!DOCTYPE html>
2<html>
3  <head>
4    <title><%= title %></title>
5    <link rel='stylesheet' href='/stylesheets/style.css' />
6  </head>
7  <body>
8    <h1><%= title %></h1>
9    <p>Welcome to <%= title %></p>
10  </body>
11</html>

・routesフォルダにjsを配置してexports

javascript
1var express = require('express');
2var router = express.Router();
3
4/* GET home page. */
5router.get('/', function(req, res, next) {
6  res.render('/index', { title: 'Express' });
7});
8
9module.exports = router;

・上記のjsファイルをサーバー起動側のapp.jsなどでrequire
・expressのuse、getでurlパスを指定

javascript
1var express = require('express');
2var app = express();
3
4//ここがview毎にどんどん増える？
5var index = require('./routes/index.js');
6app.use('/', index);

大体こんなような感じで書いてあるのがわかりました。
しかし上記のやり方は画面数が増えたとき等を考えると管理がやっかいなのでは
すでに感じてしまっております。一応フォルダの構造を変更して

views/
 └ index/
     └ index.ejs
     └ index.js

みたいな形で「フォルダをurlパスにしてその下のjsファイルをrequire、use」し
起動時にviews配下のフォルダやファイルを順番に処理していく関数を
組もうと思っているのですが、そのようなアプローチはオッケーなのでしょうか？
正直routesフォルダの存在意義がよくわかりません…。
若干質問内容がわかりにくい状態になって申し訳ありませんがnodeでルーティングが
多岐に渡る場合どのようにコーディングされているのか気になりますのでよくわかる方が
いらっしゃれば意見をお聞きしたいです。よろしくお願いします。

###補足情報(言語/FW/ツール等のバージョンなど)
windows 8.1
node v8.9.3
express ~4.15.5

行動規範の内容に同意します

回答1件

ベストアンサー

そのindex.jsは少なくともViewではありません。
Viewとは、「私に値を投げ込んだら、その値に応じたHTMLを自動生成するよ！」というものであり、
リクエストを捌くものはエンドポイントやコントローラといったロールになります。

従ってディレクトリ構成はこんな感じになるはずです。
今回はrouterを使っているので、routesというディレクトリに突っ込んでみました。

- app.js
- router/
  - index.js
  - routes/
    - index.js
- views/
  - index.ejs

JavaScript
1//ここがview毎にどんどん増える？
2var index = require('./routes/index.js');

確かにこれが課題になります。
そもそもこれ手動で書けと言い始めるexpressを窓から投げ捨ててSails.js等を使い始めるのも一案ですが、
npmのライブラリを利用して解決する案もあります。

再帰的にディレクトリを掘れれば楽になりそうなので、
こんな感じで作ってみました。

JavaScript
1// app.js
2const express = require('express');
3const router = require('./router');
4const app = express();
5const router(app);
6
7// router/index.js
8module.exports = app =>
9  readdir(`${__dirname}/endpoints`)
10    .filter(it => /¥.js$/.test(it))
11    .map(it => it.replace(/¥.js$/, ''))
12    .forEach(name => {
13      const endpoint = require(`./endpoints/${name}.js`);
14      if (endpoint.get) {
15        app.get(name, endpoint.get);
16      }
17      if (endpoint.post) {
18        app.post(name, endpoint.post);
19      }
20    })
21
22// router/routes/index.js
23module.exports = {
24  get: function (req, res, next) {
25    res.render('/index', {title: 'Express'});
26  }
27}

投稿2018/01/04 00:24

編集2018/01/04 00:38

miyabi-sun

総合スコア21158

sousuke

2018/01/04 00:38

ご回答いただきありがとうございます。sampleで提示した「index.js」は仰る通りviewではないのですがそのviewを捌くエンドポイントが別の場所にあるというのは管理上問題になると思います。 viewの階層を下げたりした場合や、ファイルが複数になった場合「viewとエンドポイントが別のフォルダにある」というのは「このviewのエンドポイントはどれだったか」ということになりそうです。そうなるとエンドポイントやroutesのフォルダは同一の構造を持つしかなく、無駄を感じます。 app/ - endpoints/ - index/ - index.js - views/ - index/ - index.ejs

行動規範の内容に同意します