Adding the Node Backend in MEAN Stack
In our previous section, we learned the ways in which we can connect our application with a node server and covered the theory section. In this section, we will connect our application with a Node backend.
We will build a totally separated backend for now in the following way:
1) We can do this in a new folder for a new project. But we will do it in the same folder so that switching between the files is easier and easier to follow for us.
Node: The node code is not actually related to our angular code.
So, we will put it into a separate folder. We will create a new folder next to our source folder and will give it a name backend. The name is completely up to us, and it can be any name that we want.
Now, this server.js file can be executed with nodejs.
3) Now, we will open a new terminal and execute this server.js file with the node. When we run this, nothing will happen on the console because it is a blank file. So, we will write the following code to test that the server.js file is running or not:
4) Now, we turn this file into a server. First, we will need to import a package, i.e., http package provided by the nodejs. The syntax of importing packages in nodejs is different from the previous one. In nodejs, we need to create a variable and import the package with the required keyword in the following way:
We cannot find this package in the package.json file because this is a default nodejs package which get installed together with nodejs in our system.
5) Now, we will use the http package to create a new server. The http package has a createServer() method, which takes a request listener as an argument. It is a function that will be executed for every incoming request without worrying about the path which this request targets.
We pass the ES6 arrow function in createServer function. This function will receive two arguments, i.e., request and response object, which will be passed in by nodejs. These objects offer data and utility methods that allow us to work with requests and responses.
In this function, we will do whatever we want with the requests.
6) The response is the most interesting to understand. The response has a couple of methods like emit, getHeader, and getHeaders, etc. The end method is one of the methods which is used to end writing to the response stream. In this function, we can add something which will be sent as text.
7) Now, the server is created, but it is not active yet. We need to store that server in a new constant because we will not change the server value. We will call the listen() function of the server, and in this function, we need to pass a port number. This port during development will be 3000 and set in the following way:
We can use that port or the default port of the hosting provider. We are hosting this because this hosting provider will normally give us that port number in which we want to host our app during production.
So, we will access the environment variable with process.env.PORT or use 3000 if that's not set. The environment variables are dynamically injected variables, they are always accessed on process.env that's a nodejs feature. The environment variables can be injected by the runtime in which this apps runs.
Now, if save it and run on the localhost 3000, we will see the browser like this:
It is very difficult to write all the code just with nodejs. To solve this difficulty, we will add the express backend. So, in the next section, we will learn how we can add the express backend.