Refactoring the views folder_Node.js 6.x Blueprints-QQ阅读男生科幻网

上QQ阅读APP看书，第一时间看更新

Refactoring the views folder

As we did before, let's change the views folder to the following new structure:

views

pages/
partials/

Remove the default jade files form views folder.

Create a file called layout.html inside the pages folder and place the following code:

      <!DOCTYPE html> 
      <html> 
      <head> 
      </head> 
      <body> 
          {% block content %} 
          {% endblock %} 
      </body> 
      </html>

Create an index.html inside the views/pages folder and place the following code:

      {% extends 'layout.html' %} 
      {% block title %}{% endblock %} 
      {% block content %} 
      <h1>{{ title }}</h1> 
          Welcome to {{ title }} 
      {% endblock %}

Create an error.html page inside the views/pages folder and place the following code:

      {% extends 'layout.html' %} 
      {% block title %}{% endblock %} 
      {% block content %} 
      <div class="container"> 
          <h1>{{ message }}</h1> 
          <h2>{{ error.status }}</h2> 
          <pre>{{ error.stack }}</pre> 
       </div> 
      {% endblock %}

We need to adjust the views path on app.js, and replace the code right after var app = express(); function with the following code:
```
      // view engine setup 
      app.set('views', path.join(__dirname, 'views/pages'));
```

At this time we have completed the first step of starting our MVC application. In the previous chapter we used pretty much of the original structure created by the express command, but in this example we will use the MVC pattern in its full meaning, Model, View, Controller.