diff --git a/step03.md b/step03.md index f47e9024..a741ac10 100644 --- a/step03.md +++ b/step03.md @@ -1,20 +1,20 @@ # Step 3 - Communicate with the server -### What is a handler function? +### What is a router function? -When a request reaches the server, we need a way of responding to it. In comes the **handler** function. The handler function is just a function which receives requests and handles them, hence the name. +When a request reaches the server, we need a way of responding to it. In comes the **router** function. The router function is just a function which receives requests and routes them to any appropriate handler functions (which handle the requests) or handles the requests directly. -The handler function always takes a `request` and `response` object and sends the response back to the client along with some information. You can decide what to send back in your response. +The router function (as well as any handler functions) always takes a `request` and `response` object and sends the response back to the client along with some information. You can decide what to send back in your response. ```js -function handler (request, response) { +function router (request, response) { // deal with request and sending response } ``` -## 1. Create your own handler function. +## 1. Create your own router function. -We are now making a handler function with a custom message in our response. You can write any message you want. +We are now making a router function with a custom message in our response. You can write any message you want. **Add the following code to `server.js`** @@ -24,7 +24,7 @@ var http = require('http'); var message = 'I am so happy to be part of the Node Girls workshop!'; -function handler (request, response) { +function router (request, response) { } @@ -39,16 +39,16 @@ server.listen(3000, function () { ``` -## 2. Tell your handler function what to do +## 2. Tell your router function what to do -We want our handler function to send our message in a response. To do that we will use one of the method of `response` object, which is: ```response.write()```. You can find more about `response.write()` [here](https://nodejs.org/dist/latest-v6.x/docs/api/http.html#http_response_write_chunk_encoding_callback) +We will have our router function handle requests directly for now. We want our router function to send our message in a response. To do that we will use one of the methods of `response` object, which is: ```response.write()```. You can find more about `response.write()` [here](https://nodejs.org/dist/latest-v6.x/docs/api/http.html#http_response_write_chunk_encoding_callback) Every response has a header, which contains information about the response. We can add information to the header using `response.writeHead()`. The `writeHead` takes 2 parameters: status code and header object. -**Add these lines to the handler function** +**Add these lines to the router function** ```js -function handler (request, response) { +function router (request, response) { response.writeHead(200, {"Content-Type": "text/html"}); response.write(message); //response body @@ -57,14 +57,14 @@ function handler (request, response) { ``` -## 3. Pass the handler function to your server +## 3. Pass the router function to your server -The createServer() method takes a handler function as an argument. +The createServer() method takes a router function as an argument. -**Pass your handler function to createServer method** +**Pass your router function to createServer method** ```js -var server = http.createServer(handler); +var server = http.createServer(router); ``` diff --git a/step04.md b/step04.md index f26a115e..4f628711 100644 --- a/step04.md +++ b/step04.md @@ -12,7 +12,7 @@ An endpoint is the part of the url which comes after `/`, in above case it's `/ There is a particular method on the request object that allows you to see the endpoint, which was put in the url. -**Inside your handler function, at the top, add the following:** +**Inside your router function, at the top, add the following:** ```js var endpoint = request.url; @@ -25,7 +25,7 @@ All requests use one of the HTTP methods. The main ones are: `GET, POST, PUT, DE ### Check which method was used for your request. -**Type inside your handler function at the top :** +**Type inside your router function at the top :** ```js var method = request.method; @@ -35,7 +35,7 @@ console.log(method); ## 1. Create your own endpoints and send different responses. -Now, you know how to get the endpoint using `request.url`. Change your handler function so that it sends one message when requested url is `/node` and another one when requested url is `/girls`. +Now, you know how to get the endpoint using `request.url`. Change your router function so that it sends one message when requested url is `/node` and another one when requested url is `/girls`. Good luck :) Feel free to discuss it with your team or mentor. @@ -61,7 +61,7 @@ Let's try it. var http = require('http'); var fs = require('fs'); -function handler (request, response) { +function router (request, response) { if (endpoint === "/") { response.writeHead(200, {"Content-Type": "text/html"}); diff --git a/step05.md b/step05.md index cef4c9a9..0c53043a 100644 --- a/step05.md +++ b/step05.md @@ -15,13 +15,13 @@ Note the `` and `` tags in the `index.html` page. Here they're lookin So there's actually **three** requests going on here. One is the original browser request, another is a request sent by ``, and the last one is a request sent by `` -#### So how do we deal with these two extra requests in our handler? +#### So how do we deal with these two extra requests in our router? -You *could* write more routes in your handler for the `image.jpg` and `main.css` files in the public folder. But what if you had multiple css files, or multiple images? Writing routes for *all* of them would get very tedious very quickly! +You *could* write more routes in your router for the `image.jpg` and `main.css` files in the public folder. But what if you had multiple css files, or multiple images? Writing routes for *all* of them would get very tedious very quickly! Luckily, you don't need to write specific routes for everything. You can write a generic route that is able to deal with lots of different **assets**. -So now you're going to add one more route to your handler function, and that route should be able to successfully respond with both the `image.jpg` and `main.css` files, plus any other files that might be in public folder. +So now you're going to add one more route to your router function, and that route should be able to successfully respond with both the `image.jpg` and `main.css` files, plus any other files that might be in public folder. **Add a final `else` to your `if-else` block and finish the code for the generic route** diff --git a/step07.md b/step07.md index 4adab6c7..9b7a3160 100644 --- a/step07.md +++ b/step07.md @@ -16,14 +16,14 @@ Let's make the code a bit more structured and organised. The best way to do that * favicon.ico **src** --> `src` is short for 'source'. This will contain the server-side code that deals with logic -* handlers.js (we will create this) +* router.js (we will create this) `server.js` will remain in the **root**. **Create a folder called `src` in the root** -* create a `handler.js` file in the `src` folder -* paste handler function and related dependencies into handler.js +* create a `router.js` file in the `src` folder +* paste router function and related dependencies into router.js ## Making your own modules! @@ -42,7 +42,7 @@ we do this: var myModule = require('path/to/my/file'); ``` -**Require your handler.js file into your server.js file** +**Require your router.js file into your server.js file** If you run your server, you should get an error: ```bash @@ -50,15 +50,15 @@ TypeError: listener must be a function ``` ![require error](readme-images/step7-require-error.png) -This is because we haven't "exported" the code inside the `handler.js` file, so it isn't available to us yet. Let's do that now. +This is because we haven't "exported" the code inside the `router.js` file, so it isn't available to us yet. Let's do that now. -**In `handler.js`, you will need to add the following** +**In `router.js`, you will need to add the following** ```js -module.exports = handler; +module.exports = router; ``` -`module.exports` magically makes our handler function available to be required in other files. +`module.exports` magically makes our router function available to be required in other files. Try running the server again and reloading the page. @@ -66,7 +66,7 @@ Try running the server again and reloading the page. You should see a very broken webpage now. There's a reason for that! -When the handler function was in `server.js`, the paths to our assets (html, css etc) that were assigned to the `pathToFile` and `pathToIndex` variables, were correct. Now the handler function has moved inside the `src` folder, we need to update the paths to our assets to make sure they point to the right location. +When the router function was in `server.js`, the paths to our assets (html, css etc) that were assigned to the `pathToFile` and `pathToIndex` variables, were correct. Now the router function has moved inside the `src` folder, we need to update the paths to our assets to make sure they point to the right location. We can use **relative paths**. `..` means "go up one level to the folder above". `.` means "look inside the current folder". For example: '../myComputer/home.txt' means "go up one folder, then go to the 'myComputer' folder, then go to the 'home.txt' file". Another example: './home.txt' means "look inside the current folder for the 'home.txt' file" @@ -77,7 +77,7 @@ See if you can do this by yourself. Work with your team if you're struggling. ## More modularisation!!! -You could split `handler.js` even further, by separating your routes from your handler. We will not do this now. +You could split `router.js` even further, by separating your routes from your handlers. Go ahead and do this if you still have time. ---