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

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. — pzp, Apr 20 '15 at 02:22

score 8 · Accepted Answer · edited May 23 '17 at 12:10

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.

score 2 · Answer 2 · edited May 23 '17 at 10:31

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!

edited May 23 '17 at 10:31

Community

1
1

answered Mar 01 '16 at 01:27

Nicholas Barry

558
2
5
15

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](/review/low-quality-posts/11456027) – Adam B Mar 04 '16 at 19:30
@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. – Nicholas Barry Mar 07 '16 at 02:54

score 1 · Answer 3 · answered Feb 13 '15 at 13:04

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.

Express.js Project Structure

3 Answers3