1,347 total views, no views today
1,347 total views, no views today
Now, let’s start this module by installing Mongo DB. Mongo DB is an open source document db, so, we need to install the same from the site http://mongodb.org/. Now, as shown below in the screen shot, in the downloads section you will get different options for downloading mongoDB based on your OS. For my machine, I have installed Windows 64 bit option.
Now, once i have downloaded the file, then i’ll go ahead and install the same as shown below in the screen shot.
Now, once we have installed mongo db, we can go ahead and use the same in our project. Below, in the screen shot you can see that same has been created in my program files directory.
Now, what i’ll do from here, i’ll just copy the bin files and put the same in our project in a different directory, so that i can use mongo db in our project as shown below.
Then, i will go ahead and open the command prompt with the above new folder and create one new folder say database just to store the database for my project. Then, i’ll type the command “mongod -dbpath ./database“. Now, what this command will do, it will simply store all my data in that repository. Once i typed this command, it will open the port which i can utilize for my application. Now, the default port is 27017 as shown below in the screen shot. So, once port started then i can simply go ahead launch the port in browser to simply test the same.
Now, also for diagnosis purpose or for all admin related query, you can also enable one more that is 28017. But, for doing the same what you need to do, you need to enable rest endpoints as shown below in the screen shot and then when you launch the same in browser, it will open the console.
Now, since the mongodb is installed, let’s see how to access the same via JS. So, the 1st dependency we have here is we need to have driver for accessing the same. so, inorder to do the same we need to install mongodb via npm, so that it gets installed in our “package.json” dependency folder. So, once that is installed, we can verify the same in references and package.json as shown below in the screen shot.
Now, once this done, next thing i would like to access the server directly. Now, for doing the same i will create one new file inside the data folder say “MovieReviewDb”.
Now, the next thing is i need function to write the same in database. For, that i need to modify index.js file under dataRep folder as shown below in the snippet. Now, with this change in place when i run the solution, then i’ll get the below output
Now, this section is getting bigger. Hence, I’m wrapping this session here. In the next section, we’ll see how to query the data and take the request to write the data from UI. Till then stay tuned and happy coding.
922 total views, 3 views today
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.
899 total views, 1 views today
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
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.
1,048 total views, no views today
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.
1,250 total views, 4 views today
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, 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.
994 total views, no views today
Now, Node.JS features talk below mentioned things:-
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.
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.
1,179 total views, no views today