Node.js + Express File and Folder Structure [Best choice]

この記事は約6分で読めます。
ミミウサ
mimi

Now I understood that the file/folder structure of Node.js+Express can be arranged by users.
Is there the most practical its structure?

The file structure of Node.js plus Express

Let’s think about the most practical folder structure for Node.js + Express projects when installing Express on the Node.js environment and creating an application.

The most practical folder/file structures after installing Express and npm

Top
app.js  :A main file of the application. It includes setting and procedure related to whole part of an app.
package-lock.json
package.json : A file setting a project name and its version information.

├─bin :A directory saving the process of starting a server.
│  www  :  The “www” file is generated as default and set to run it at port 3000.

├─node_modules  : A directory containing all Express modules. Files installed via npm are also saved in this directory. Users do not need to edit these files in this directory.
│ ├─.bin
│ ├─accepts
│ ├─array-flatten
│ ├─basic-auth
│ ├─body-parser
│ ├─bytes
│ ├─content-disposition
│ ├─content-type
│ ├─cookie
│ ├─cookie-parser
│ ├─cookie-signature
│ ├─debug
│ ├─depd
│ ├─destroy
│ ├─ee-first
│ ├─ejs
│ ├─encodeurl
│ ├─escape-html
│ ├─etag
│ ├─express
│ ├─finalhandler
│ ├─forwarded
│ ├─fresh
│ ├─http-errors
│ ├─iconv-lite
│ ├─inherits
│ ├─media-typer
│ ├─merge-descriptors
│ ├─methods
│ ├─mime
│ ├─mime-db
│ ├─mime-types
│ ├─morgan
│ ├─ms
│ ├─negotiator
│ ├─on-finished
│ ├─on-headers
│ ├─parseurl
│ ├─path-to-regexp
│ ├─proxy-addr
│ ├─qs
│ ├─range-parser
│ ├─raw-body
│ ├─safe-buffer
│ ├─send
│ ├─serve-static
│ ├─setprototypeof
│ ├─statuses
│ ├─type-is
│ ├─unpipe
│ ├─utils-merge
│ └─vary
├─public : Static resources (JavaScript, CSS, img, .etc) are saved in this directory. 
│ ├─images
│ ├─javascripts
│ └─stylesheets
│ style.css

├─routes: The directory contains processes of routing (processes managing  to judge what processing should be executed or returned in response to client request). A controller on the server side.
│ index.js
│ users.js

└─views  :  A directory containing UIs. It outputs all contents by following selected template engine. “views” is a template on the server side to draw display .

│ error.ejs
│ index.ejs

About Middle Ware

The feature of application development using Express is the concept of middleware.

Each application is created by connecting “routing” and “processing”, and the “processing” part is called middleware.

In the following code,  the part below “function” corresponds to middleware.

router.get('/', function(req, res, next) {

 var p1 = req.query.p1;
 var p2 = req.query.p2;
 var msg = p1 == undefined ? "" : p1 + "," + p2;
 res.render('helo',
  {
   title: 'HELO Page',
   msg: msg
  }
 );

});

 

Which file should we write middleware in?

  • Write a common middleware related to requests for the entire application in “app.js” that includes main processing.
  • Write the middleware for each request in .js files in a “routes” directory.

This way seems to be the simplest and most manageable.

コメント

タイトルとURLをコピーしました