Book Image

Node.js 6.x Blueprints

By : Fernando Monteiro
Book Image

Node.js 6.x Blueprints

By: Fernando Monteiro

Overview of this book

Node.js is the most popular framework to create server-side applications today. Be it web, desktop, or mobile, Node.js comes to your rescue to create stunning real-time applications. Node.js 6.x Blueprints will teach you to build these types of projects in an easy-to-understand manner. The key to any Node.js project is a strong foundation on the concepts that will be a part of every project. The book will first teach you the MVC design pattern while developing a Twitter-like application using Express.js. In the next chapters, you will learn to create a website and applications such as streaming, photography, and a store locator using MongoDB, MySQL, and Firebase. Once you’re warmed up, we’ll move on to more complex projects such as a consumer feedback app, a real-time chat app, and a blog using Node.js with frameworks such as loopback.io and socket.io. Finally, we’ll explore front-end build processes, Docker, and continuous delivery. By the end of book, you will be comfortable working with Node.js applications and will know the best tools and frameworks to build highly scalable desktop and cloud applications.
Table of Contents (16 chapters)
Node.js 6.x Blueprints
Credits
About the Author
About the Reviewer
www.PacktPub.com
Preface

Changing the application's structure


Let's make some changes to the structure of directories in our application and prepare it to follow the Model-View-Controller design pattern.

I will list the necessary steps for this refactoring:

  1. Inside the root project folder:

    • Create a new folder called server

  2. Inside the server folder:

    •  Create a new folder called config

    •  Create a new folder called routes

    • Create a new folder called views.

  3. Do not worry about the config folder at this point; we will insert its contents later.

  4. Now we need to move the error.js and index.js files from the chapter-01/views folder to the chapter-01/server/views folder.

  5. Move the index.js and user.js files from the chapter-01/routes folder to the chapter-01/server/routes folder.

  6. A very simple change here, but during the development process, it will be very useful to better organize all the files of our application.

We still need to change the path to this folder in the main application file, app.js. Open the app.js file from the project root folder and change the following highlighted lines:

... 
var routes = require('./server/routes/index'); 
var users = require('./server/routes/users'); 
 
var app = express(); 
 
// view engine setup 
app.set('views', path.join(__dirname, 'server/views')); 
app.set('view engine', 'ejs'); 
... 

Before we proceed, let's change the welcome message from the routes/index.js file to the following highlighted code:

/* GET home page. */ 
router.get('/', function(req, res, next) { 
    res.render('index', { title: 'Express from server folder' }); 
}); 

To run the project and see the application in your browser, follow these steps:

  1. Type the following command in your terminal/shell:

    DEBUG=chapter-01:* npm start
    
  2. Open your browser at http://localhost:3000.

  3. The output in your browser will be as follows:

    Application home screen

Now we can delete the folders and files from:

  • chapter-01/routes:

    •  index.js

    •  user.js

  • chapter-01/views:

    •  error.js

    •  index.js

Changing the default behavior to start the application

As mentioned earlier, we will change the default initialization process of our application. To do this task, we will edit the app.js file and add a few lines of code:

  1. Open app.js and add the following code after the app.use('/users', users); function:

          // catch 404 and forward to error handler 
          app.use(function(req, res, next) { 
             var err = new Error('Not Found'); 
              err.status = 404; 
              next(err); 
          }); 
    

    It's a simple middleware to intercept 404 errors.

  2. Now add the following code after the module.exports = app; function:

          app.set('port', process.env.PORT || 3000); 
          var server = app.listen(app.get('port'), function() { 
              console.log('Express server listening on port ' + 
              serer.address().port); 
          }); 
    
  3. Open the package.js file at the root project folder and change the following code:

          ... 
          "scripts": { 
             "start": "node app.js" 
          }, 
          ... 
    

    Note

    The debug command is still available if necessary: DEBUG=chapter-01:* npm start.

  4. The package.json file is a file of extreme importance in Node.js applications. It is possible to store all kinds of information for the project, such as dependencies, project description, authors, version, and many more.

  5. Furthermore, it is possible to set up scripts to minify, concatenate, test, build and deploy an application easily. We'll see more on how to create scripts in Chapter 9, Building a Frontend Process with Node.js and NPM.

  6. Let's test the result; open your terminal/shell and type the following command:

          npm start 
    
    
  7. We will see the same output on the console:

          > node app.js 
    
         
    Express server listening on port 3000!