Week 4 Learned Node JS
I learned the back-end and was having a hard time with the concepts so I decided to blog about it. I am by no means an expert so if some information is wrong or I’m missing something, feel free to drop a comment and I’ll update the post!
What is Node JS?
Node JS allows us to create servers on the backend with Javascript. It is non-blocking IO meaning that it works asynchronously.
- Ex. User makes a request, the server will process that request but will continue onto another task.
What is the request?
- A user makes a request to the server and the server sends headers and sometimes data depending on the type of request
What is the response?
- The response is what the server sends back, the server sends back the status code, headers and the data the user asked for
How do you set things up?
- You first need to require the http on your server.js document
- Once you’ve done that you can declare a variable and create your server using and pass in a callback function that will receive the request and response
- Ex.
var http = require(‘http’);
var server = http.createServer(function(request, response) {
});
- Inside the callback function this is how you would handle and deal with certain types of request the user is listening too.
- But before that we also have to make sure that the server is connected to some port it’s listening too. Why? So that when someone visits that port the user and the server are now able to connect. It’s like you’re going to a new location and to buy a product. But before that you have to know the location of that store, so you go on google maps and enter the address of that store. The store has to post it’s address somewhere for you to grab. Once you have the address you now know how to get to that store.
var server = http.createServer(function(request, response) {
}).listen(port, hostname);
OR
var server = http.createServer(function(request, response) {
});
server.listen(port, hostname);
So now what goes inside the callback function?
- Well before we can think about that, we have to think about what happens when someone first visits a site and how does the client and server relationship work.
- When you enter in a web address the first thing that happens is the client makes a ‘GET’ request to the server to ask for the html & css content (aka the static documents)
- Once the html content has been served the browser is running through the code if it finds any script tags it will then ask the server for another ‘GET’ request for the javascript file. The server then responds with those files
- Additional let’s say you visit a todo list website. When the page loads you also want to have all of your todos loaded on as well. So the the client makes another ‘GET’ request that retrieves all your todos.
- Now if you want to add a todo, the client side makes a ‘POST’ request to the server, the server receives that request, writes that information in some form of storage, then sends back the new todo list with the new todo you added. As you can see this process get’s pretty complex and you can now appreciate how much work and effort is going under the hood of a website you use every day!
var server = http.createServer(function(request, response) {
// the request from the client was a ‘GET’ request
If ( request.method === ‘GET’ ) {
//reads the data from the file you specified
fs.readFile(‘../client/index.html’, function(err, data) {
//responds with a status code and the content type
response.writeHead(200, {‘Content-Type’; ‘text/html’’});
//responds with writing the data back in chunks
response.write(data);
//tells the server ‘hey we’re done sending our data’
response.end();
})
}
}).listen(port, hostname)
POST REQUEST
- Okay that was a lot for just getting things started and having your page open.
var storage = [ ];
var server = http.createServer(function(request, response) {
// the request from the client was a ‘GET’ request
If ( request.method === ‘GET’ ) {
//reads the data from the file you specified
fs.readFile(‘../client/index.html’, function(err, data) {
//responds with a status code and the content type
response.writeHead(200, {‘Content-Type’; ‘text/html’’});
//responds with writing the data back in chunks
response.write(data);
//tells the server ‘hey we’re done sending our data’
response.end();
})
}
//a ‘POST request to add into the storage
If ( request.method === ‘POST’ ) {
//some form of storage string or array
var body = [ ]
//take the request object and read the data in chunks
request.on(‘data’, function(chunk) {
body.push(chunk);
//once done reading then add data to your storage then end the request
}).on(‘end’, function () {
storage.concat(body);
});
}
}).listen(port, hostname)
