Thursday, August 4, 2011

Simple hello world application in node.js MVC

In my previous blog post, I gave an introductory tutorial on how to set up node.js as an MVC framework utilizing the prepackaged example found in the node.js distribution. This post will be a follow up to my previous post and will be a basic tutorial on understanding how the framework works in order to create a hello world application. I will not be getting into the underlying logic of the framework. Instead the tutorials main goal is to create a quick understanding of how to quickly begin to use the framework.

Many different MVC frameworks follow a similar logic in naming and file distribution conventions. Unfortunately, the prepackaged MVC framework does not have a built in support for model files and thus, I will not be discussing this in the tutorial. 'Controllers' are the behavioral layer of the framework and interact between the views and the models. In this particular example, all controller files should be placed in the accompanied controllers folder. 'Actions' represent the individual behaviors that the controllers are able to perform and are often represented via an operation on the corresponding controller. This example is no different from the is norm. 'Views' are regarded as the presentation layer and conventionally are named after the corresponding action. This example is no different.

To sum up the last paragraph. The example provided in the node.js distribution follows conventional MVC naming and file distribution conventions. That is, each controller file is found in the controllers folder and each controller should have a corresponding view folder named exactly the same as the controllers file name. Each view in a controllers view folder corresponds directly to an action found on the given controller. The view is named exactly as the action is named.


-controllers
--app.js
--example.js
-views
--app
---index.html
--example
---index.html
---action1.html
---action2.html
--layout.html


I hope you noticed, I threw in the layout.html file in the views file. The layout.html file acts as a basic html container page. The view page will be rendered in the layout via <%= body %>.

Now that the basic structure of the MVC framework is explained, in this particular example all actions must first be declared on the MVC.js file in the bootController function. For this tutorial, the predefined actions are suffice.

Create a .js file in the controllers folder and name it example. Place the following code inside it


// creates an array of callable actions
module.exports = {

// default action
index: function(req, res){
var text = "Hello World!";
res.render(text);
}
};

The important thing to notice here is that the passed variable does not have the same name as the action as this does not matter.
Create a folder in the views folder and name it example. Then create a file named index.html inside the example folder. Place the following code inside it.

<%= text %>


There you go. A simple hello world application on how to use the prepackaged MVC example found in the node.js distribution.

No comments:

Post a Comment