Hi Friends,

Now, in this section we’ll delve further creating controllers, services and many other things. So, the very 1st thing which i’ll do is I’ll create controller’s folder and create my first controller say “homeController”. Now, this would be the place which will serve all the HTTP actions like (Get,Post…). Now, since this going to be controllers for web pages, hence i need to follow one convention where in needs to be self executing function.

So, as shown above i’m passing in “module.exports” and renaming to home controller means hence its clear to me that i am adding methods to home controller. Like here i added an init function using “homeController” and i accept my reviews object. So, here i have taken the get function which i have written on my “server.js”.

Now as shown below in the screen shot “server.js” page have made controllers folder self referencing. So, this will give access to all the controllers. Now, in order to use this i need one more file which will list all the controllers like “index.js”. Now, this file also follow the same pattern what i used while writing our 1st controller. Now, here i have initialized controllers itself. So, whenever any new controller gets added, i’ll initialize here itself, so this way i’ll wireup each of the required controllers. The significance of this would be server page is going to invoke only the main controllers. After doing all these when i ran the program, it produced the same output but this time via controller.

So, now let’s create our 1st service. So, Service which i am going to create will be served as a repository for data. So, for this i’ll create one more folder say “dataRep” and inside that i’ll create “index.js”, which will be used by our home controller as shown below. So, as you can see in the below screen shot, currently for populating data i’m referring another JS file which is known as seed data. This is temporary, so once database is up and running, we’ll fetch the data from db itself.

Now, once i have created the seed data, i’ll go ahead and create the instance of the data object in home controller. Then, i’ll go ahead and invoke the seed data to populate the same here as shown below in the screen shot. So, here i need to modify my model as well, so that it can take part in data binding as well.

Now, i need to modify my index view to print these values.

Now, with these changes, it will print the data as shown below in the screen shot.

But, now the look and feel is very bad. So, to fix this we need to use css and other static resources like images and other things. So, for this i’m going to create a new folder “public”. Now, this name “public” is by convention. It is going to hold all the static resources. so, i already have all the static files in place, basically one bootstrap theme. so, i simply copy pasted the same in public folder as shown below.

Now, once that is done, then in order to use the same i need to tell server.js to use the static files as shown below. Now, __dirname is the implicit variable which picks up the root directory. so, with this definition, it will include all the files inside the public folder.

After this i have included the same file in the layout file as shown below and then i have modified the view structure to present the same in little presentable manner. However, there is one more npm technique to download the static resources in the project and that is called “BOWER”. But, for now that is ok.

Now, with the above changes in place, it will present the modified UI as shown below.

so, with this i am going to wrap this for now. In the next section we’ll see more on data access. Till Then Stay tuned and Happy coding.

Thanks,
Rahul

Hi Friends,

Now, in today’s discussion, we’ll delve further and look into the View Engine. Now, in this case i am going to discuss Razor like view engine known as Vash. Now, in order to install the 1st, this time i go ahead and use npm with command prompt as shown below in the screen shot. Now, once that is done it will get updated in the package.json as well.

Now, in the code side, i just need to include the view engine. This time i don’t need to call via require rather in a different way and then i’ll use render keyword to render the view as shown in the below screen shot.

Now, the next thing here is i need to create the views folder as all the views supposed to be in views folder. Now, one point to note here, this is kind of convention which needs to follow. Now, in that folder i’ll create one text file and name it index.vash as shown in the screen shot and then i’ll put some razor like HTML inside

Now, we can go ahead also create Layout page like we have in MVC. So, for that i again go ahead and create one text file with the name layout.vash and put the common sections as shown below in the screen shot. so, as you can see below in the layout page i have used ‘@html.block’ to inject the index page in there and back in the index i have javascript call back function to implement the same. Here, I have used the keyword ‘extend’ to wire up the file which index is looking for and in this case it is ‘layout’ and then the callback function passing in the model which is being passed to the page. Then, we need to define the block with that particular which we are interested to fill in and then usual HTML tags.

With this i would like wrap this session here, in the next segment, we’ll see more on controllers and service. Till then stay tuned and Happy coding.

Thanks,
Rahul

Hi Friends,

In today’s discussion we will create Node JS application in visual studio. Now, let’s create a new project. This time I’ll choose blank Node.JS web Application as shown below in the screen shot.

Now, once the project is created, you can see that there is one file with the name server.js. Now, Server.JS is basically startup JS file for Node Package. Now, let me delete everything written over here, so that we can proceed step by step.Now, the 1st thing which i am going to use here is HTTP Library. This is basically used to handle the HTTP request and response. So, here we’ll use require and ask for HTTP. Now, here i’ll be getting pretty mature intellisense out of the box due to VS and Resharper combination.

Below, you can see in the screenshot i have created http object. Now here you can see in the visual studio editor intellisense support for node as well which is pretty helpful. Once, HTTP object is composed,next job is to create the webserver. So, here we can do the same by using http and then provide a callback function. Now, this function is going to be straight forward, it is going to accept two parameters. 1st one request and the other one is response variable.Then, we have created server and one custom port particular to application.

Now, above in the screen shot you can see that, for running the application i simply clicked F5 in Visual Studio and then, it opened one console window. Then, i have opened one browser chrome in this case and issued one http request from the browser, next same thing is parsed in my script which intellisense is also showing and then i have returned the same output in the browser using the response write function. In this function, i simply composed one HTML body with req object in it. Now, whatever is getting printed in the browser, same thing also get echoed in the console window.

Now, let’s consider the express framework. Now, in Visual Studio project, you might have noticed that there is one option for Node Package Manager(NPM). Basically, Node Package Manager is more like Nuget Package Manager for resolving dependencies or downloading the package and integrating the same with the project. Below, in the screen shot, for downloading the express, i have used NPM.

Now, at this point i can go ahead and verify my dependencies in the package.json file as shown below in the screen shot.

Now, we can install all these packages via command line as well. For that we just need to issue the command npm install package name –save. Now, this –save will save the dependencies in the package.json file. Now, since we have installed express, so in order to use the same in our project we need to include it, and for that we’ll use require statement like we have used for HTTP as shown in the below screen shot. Once we have reference express dependency in our project, it can be executed as function and return one plain and simple object.

Also, in case of express object, we can compose any HTTP verb here like get,post,put,delete …. as shown below in the screen shot. Here, I have composed get with the root of the page(“/”)
Now, in case of this express object, we actually don’t need the callback function, it is taken care by this express object. so, now we can pass the reviews while creating the server object.

Now, as you can see in the above screen shot, that i have again composed one html object while sending the response which is kind of tedious thing doing all the times. So, in the next section in order to get rid of this, we’ll see one more concept say view engine which will take care of all HTML presentations. Till then stay tuned and Happy coding.

Thanks,
Rahul Sahay
Happy Coding

Hi Friends,

Today in this section, will move a bit and install node js extension for visual studio. Now, one point to note here that this tool is an extension to visual studio, hence it won’t work with free edition of visual studio. you need to have license edition of visual studio for implementing the same. So, you need to download the extension from the link http://nodejstools.codeplex.com/. Now, once NTVS installation is done, then you can see the node templates in JavaScript section as shown below in the screen shot.

Now, all these templates are quite educational. you can easily grasp the meaning of each of these. So, for simple demo purpose lets get started with one console app demo.

Now, by default it produced me Hello world string. So, when i do F5, it will simply print Hello World on the console screen. Now, if you notice the command console.log which is essentially the same what we use to print messages in javascript console window.

Now, here since i am in visual studio i can get all sort of by default Visual Studio intellisense + since i am using Resharper, so i’ll get pretty mature intellisense to help me through while coding.Also, I can walk through the code and debug the same while running and inspect the values as well as shown in the below screen shot.

Now, i can also run this project using shell as shown below in the screen shot. What i’ll do, i’ll rt-click on the project and then say open command prompt here. Then I’ll use to node to execute my app.js file.

Also, visual studio in background will create the simple project file which is exclusive for node js project as shown in the below screen shot. Now, this is similar to csProj what we used to have whenever we create C# application.

I hope your are enjoying Node learning. In the next module we’ll explore other available templates. Till then stay tuned and Happy coding.

Thanks,
Rahul Sahay
Happy Coding

Hi Friends,

In today’s topic i am going to start on a really fresh note, as i started getting idea of Node.JS, so thought to share my view on the same. Basically, Node.JS is a platform for executing JavaScript at server side for Non-Blocking I/O, event driven model which enables fast and scalable network application. So, here we are discussing Server side code which is basically done using Java Script. Now, it is also equivalent to ASP.NET in terms of Views, Business Logic, Data Access Layer and many more things. Now, one important point to understand here, ASP.NET framework is also headed in the same direction where Node.JS is.

Now, Node.JS features talk below mentioned things:-

1) Node JS is a server side javascript framework
2) It supports modular Javascript
3) Node JS by default is asynchronous. 
4) HTTP, Networking and Web sockets are already built in here.

So, these features make Node JS fast and scalable. Now, let’s look some contrasting comparison between normal webservers and Node.exe. In normal scenarios requests are usually served as queue basis normal data structure concept as shown below in the diagram.

But, if we see Node.exe, then it is capable of serving multiple requests at a time as a confident person taking any no of requests.

Now, this asynchronous process is the default behavior of node.exe, may be because of this feature it is getting traction these days.

Now, let’s understand some of node terminology which we are going to use in our discussion.

Webserver:- Node.exe used for hosting the app
Database:- Usually Mongo DB
Scripting Language:- Javascript

Now, apart from these basic things we’ll be using ExpressRazor as a view engine for creating our views. Now, ExpressRazor, i am using because of ASP.NET MVC Razor behavior. You can also use other view engine which is meant for web forms background people like ExpressJS. But, that’s ok will focus on Razor behavior here. Now, i think this much information is quite enough to get started with Node.JS. So, let’s begin with installation 1st. Now, i am going to navigate to http://nodejs.org/ . Here, I’ll click on download link and install the required software. Below are the some normal screen shots of node installation.

Now, once the installation is completed. we can go into the command prompt as administrator and then simply type node, then you will notice that command prompt simply gets converted to shell. Now, here you can type script and execute simple programs as shown below in the screen shot.

Now, in the above screen shot, i have basically created one directory for my node examples and then i invoked node with the node command. Now, in there i have simply type one string and then pressed enter so it returned the same name. So, that’s basically a very simple node in a nutshell. Now, in the next segment we’ll delve more on this but for now let’s wrap. Thanks for joining me.

Thanks,
Rahul Sahay
Happy Coding