Express.js Project Structure

Question

I found that Express has an application generator, however the documentation does not explain the purpose of each directory and file. If someone could just give me a short explanation of which files I should be putting where, that would be much appreciated. Here's the generated app structure:

├── app.js
├── bin
│   └── www
├── package.json
├── public
│   ├── images
│   ├── javascripts
│   └── stylesheets
│       └── style.css
├── routes
│   ├── index.js
│   └── users.js
└── views
    ├── error.jade
    ├── index.jade
    └── layout.jade

7 directories, 9 files

Orvalorvan

Could you please explain the down vote? What was wrong about how I asked this question? I don't care about the 2 reputation points, I just would like to know for the future. – Orvalorvan

Answer 1

The app.js file is the entry-point of your application.

The package.json file contains all of your dependencies and various details regarding your project.

The bin folder should contain the various configuration startup scripts for your application.

For example, instead of applying all the Express middleware in the app.js file, you module.exports = {} them from their own configuration file and require them in app.js. [additional info LINK]

The views folder contains all of your server-side views.

The public folder contains all of your front-end code.

The routes folder contains all the routes that you have created for your application.

As stated in the official documentation, be aware that this is just one way to organize your code.

You should test it out and see if it fits your project.

Explicable

Answer 2

This thread gives a deeper answer about the www file specifically: What does "./bin/www" do in Express 4.x?

Basically, running your app from the www file (which calls app.js) allows you to start your app with different configurations. You might have a "www" file representing the way the app should be run when on the web, a "dev" file that you, as the developer, would run, a "test" file you would run when running tests, etc. Read the thread linked above for more detail!

Vizier

While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid if the linked page changes. - From Review – Sammy

@AdamB, I tried to include the gist of the answer in my answer. I didn't fully understand all the nuances of the responses in that thread, so I wasn't able to explain any better than I did in my answer here. – Vizier

Answer 3

This structure is a standard organization for web-app

public contains all client static files (css, client javascript (ex. jQuery), images, fonts...)

routes contains the main back-end code (server side), which compute data before calling a template engine (see below) or respond to the client (via json of xml).

views contains each page template, see jade template. These files are used by scripts in "route"

app.js contains the express core, such as uri parser, modules, database...

package.json is the project descriptor file (used by npm for dependencies and sharing)

If the application generator provide a full example, don't hesitate to open each file (starting from app.js) to understand the project's organization.

Quadriplegic