Improve wording and formatting (#14061)

pull/14159/head
Marco Fras 2017-03-30 21:09:59 +02:00 committed by mrugesh mohapatra
parent 3351c1ea95
commit 60a687597c
2 changed files with 33 additions and 33 deletions

View File

@ -17,7 +17,7 @@
[ [
"", "",
"", "",
"Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicaly visible for our testing.<br>Start this project on Glitch using <a href='https://glitch.com/#!/import/github/freeCodeCamp/boilerplate-express/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-express/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe!", "Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public Glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.<br>Start this project on Glitch using <a href='https://glitch.com/#!/import/github/freeCodeCamp/boilerplate-express/'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-express/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe!",
"" ""
] ]
], ],
@ -33,8 +33,8 @@
"id": "587d7fb0367417b2b2512bed", "id": "587d7fb0367417b2b2512bed",
"title": "Meet the Node console", "title": "Meet the Node console",
"description": [ "description": [
"During the development process, is important to be able to check whats going on in your code. Node is just a javascript environment. Like client side javascript, you can use the console to display useful debug information. On your local machine, you would see the console output in a terminal. On Glitch you can open the logs in the lower part of the screen. You can toggle the log panel if you push the button Logs (top-left, under the app name).", "During the development process, it is important to be able to check whats going on in your code. Node is just a JavaScript environment. Like client side JavaScript, you can use the console to display useful debug information. On your local machine, you would see the console output in a terminal. On Glitch you can open the logs in the lower part of the screen. You can toggle the log panel with the button Logs (top-left, under the app name).",
"To get started, just put the classic Hello World in the console. We recommend to keep the log panel open while working at these challenges. Reading the logs you can be aware of the nature of the errors that may occur." "To get started, just print the classic \"Hello World\" in the console. We recommend to keep the log panel open while working at these challenges. Reading the logs you can be aware of the nature of the errors that may occur."
], ],
"challengeSeed": [], "challengeSeed": [],
"tests": [ "tests": [
@ -52,8 +52,8 @@
"id": "587d7fb0367417b2b2512bee", "id": "587d7fb0367417b2b2512bee",
"title": "Start a Working Express Server", "title": "Start a Working Express Server",
"description": [ "description": [
"In the first two lines of the file myApp.js you can see how its easy to create an Express app object. This object has several methods, and we will learn many of them in these challenges. One fundamental method is <code>app.listen(<port>)</code>. It tells your server to listen on a given port, putting it in running state. You can see it at the bottom of the file. It is inside comments because for testing reasons we need the app to be running in background. All the code that you may want to add goes between these two fundamental parts. Glitch stores the port number in the environemet variable <code>process.env.PORT</code>. Its value is <code>3000</code>.", "In the first two lines of the file myApp.js you can see how its easy to create an Express app object. This object has several methods, and we will learn many of them in these challenges. One fundamental method is <code>app.listen(port)</code>. It tells your server to listen on a given port, putting it in running state. You can see it at the bottom of the file. It is inside comments because for testing reasons we need the app to be running in background. All the code that you may want to add goes between these two fundamental parts. Glitch stores the port number in the environemet variable <code>process.env.PORT</code>. Its value is <code>3000</code>.",
"Lets serve our first string ! In Express, routes takes the following structure: <code>app.METHOD(PATH, HANDLER)</code>. METHOD is an http method in lowercase. PATH is a relative path on the server (it can be a string, or even a regular expression). HANDLER is a function that Express calls when the route is matched.", "Lets serve our first string! In Express, routes takes the following structure: <code>app.METHOD(PATH, HANDLER)</code>. METHOD is an http method in lowercase. PATH is a relative path on the server (it can be a string, or even a regular expression). HANDLER is a function that Express calls when the route is matched.",
"Handlers take the form <code>function(req, res) {...}</code>, where req is the request object, and res is the response object. For example, the handler", "Handlers take the form <code>function(req, res) {...}</code>, where req is the request object, and res is the response object. For example, the handler",
"<blockquote>function(req, res) {<br> res.send('Response String');<br>}</blockquote>", "<blockquote>function(req, res) {<br> res.send('Response String');<br>}</blockquote>",
"will serve the string 'Response String'.", "will serve the string 'Response String'.",
@ -75,11 +75,11 @@
"id": "587d7fb0367417b2b2512bef", "id": "587d7fb0367417b2b2512bef",
"title": "Serve an HTML File", "title": "Serve an HTML File",
"description": [ "description": [
"We can respond with a file using the method <code>res.sendFile(<file>)</code>.", "We can respond with a file using the method <code>res.sendFile(path)</code>.",
"You can put it inside the <code>app.get('/', ...)</code> route handler. Behind the scenes this method will set the appropriate headers to instruct your browser on how to handle the file you want to send, according to its type. Then it will read and send the file. This method needs an absolute file-path. We recommend you to use the node global variable <code>__dirname</code> to calculate the path.", "You can put it inside the <code>app.get('/', ...)</code> route handler. Behind the scenes this method will set the appropriate headers to instruct your browser on how to handle the file you want to send, according to its type. Then it will read and send the file. This method needs an absolute file path. We recommend you to use the Node global variable <code>__dirname</code> to calculate the path.",
"e.g. <code>absolutePath = __dirname + relativePath/file.ext</code>.", "e.g. <code>absolutePath = __dirname + relativePath/file.ext</code>.",
"The file to send is <code>/views/index.html</code>. Try to Show Live your app, you should see a big HTML heading (and a form that we will use later…), with no style applied.", "The file to send is <code>/views/index.html</code>. Try to Show Live your app, you should see a big HTML heading (and a form that we will use later…), with no style applied.",
"Note: You can edit the solution of the preceding challenge, or create a new one. If you create a new solution, keep in mind that Express evaluates the routes from top to bottom. It executes the handler for the first match. You have to comment out the preceding solution, or the server will keep responding with a string." "Note: You can edit the solution of the previous challenge, or create a new one. If you create a new solution, keep in mind that Express evaluates the routes from top to bottom. It executes the handler for the first match. You have to comment out the preceding solution, or the server will keep responding with a string."
], ],
"challengeSeed": [], "challengeSeed": [],
"tests": [ "tests": [
@ -97,9 +97,9 @@
"id": "587d7fb0367417b2b2512bf0", "id": "587d7fb0367417b2b2512bf0",
"title": "Serve Static Assets", "title": "Serve Static Assets",
"description": [ "description": [
"An HTML server usually has one or more directories that are accessible by the user. You can place there the static assets needed by your application (stylesheets, scripts, images). In Express you can put in place this functionality using the middleware <code>express.static(<public-dir-absolute_path>)</code>. If dont know what a midleware is, dont worry. Well discuss about it later in details. Basically middleware are function that intercept route handlers, adding some kind of information. A middleware needs to be mounted using the method <code>app.use([optional-path], <mware function>)</code>. The first path argument is optional. If you dont pass it, the middleware will be executed for all the requests.", "An HTML server usually has one or more directories that are accessible by the user. You can place there the static assets needed by your application (stylesheets, scripts, images). In Express you can put in place this functionality using the middleware <code>express.static(path)</code>, where the parameter is the absolute path of the folder containing the assets. If dont know what a middleware is, dont worry. Well discuss about it later in details. Basically middlewares are functions that intercept route handlers, adding some kind of information. A middleware needs to be mounted using the method <code>app.use(path, middlewareFunction)</code>. The first path argument is optional. If you dont pass it, the middleware will be executed for all the requests.",
"Mount the <code>express.static()</code> middleware for all the requests with <code>app.use()</code>. The absolute path to the assets folder is <code>__dirname + /public</code>.", "Mount the <code>express.static()</code> middleware for all the requests with <code>app.use()</code>. The absolute path to the assets folder is <code>__dirname + /public</code>.",
"Now your app should be able to serve a CSS stylesheet. From outside the public folder will appear mounted to the root directory. Your front-page should look a little better now" "Now your app should be able to serve a CSS stylesheet. From outside the public folder will appear mounted to the root directory. Your front-page should look a little better now!"
], ],
"challengeSeed": [], "challengeSeed": [],
"tests": [ "tests": [
@ -117,9 +117,9 @@
"id": "587d7fb1367417b2b2512bf1", "id": "587d7fb1367417b2b2512bf1",
"title": "Serve JSON on a Specific Route", "title": "Serve JSON on a Specific Route",
"description": [ "description": [
"While an HTML server serves (you guessed it!) HTML, an API serves data. A <dfn>REST</dfn> (representational state transfer) API allows data exchange in a simple way, without the need for clients to know any detail about the server. The client only needs to know where the resource is (the URL), and the action it wants to perform on it (the verb). The GET verb is used when you are fetching some information, without modifying anything. These days, the preferred data format for moving information around the web is JSON. Simply put, JSON is a convenient way to represent a JavaScript object as a string, so it can be easily transmitted.", "While an HTML server serves (you guessed it!) HTML, an API serves data. A <dfn>REST</dfn> (REpresentational State Transfer) API allows data exchange in a simple way, without the need for clients to know any detail about the server. The client only needs to know where the resource is (the URL), and the action it wants to perform on it (the verb). The GET verb is used when you are fetching some information, without modifying anything. These days, the preferred data format for moving information around the web is JSON. Simply put, JSON is a convenient way to represent a JavaScript object as a string, so it can be easily transmitted.",
"Let's create a simple API by creating a route that responds with JSON at the path <code>/json</code>. You can do it as usual, with the <code>app.get()</code> method. Inside the route handler use the method <code>res.json()</code>, passing in an object as an argument. This method closes the request-response loop, returning the data. Behind the scenes it converts a valid Javascript object into a string, then sets the appropriate headers to tell your browser that you are serving JSON, and sends the data back. A valid object has the usual structure <code>{key: data}</code>. Data can ba a number, a string, a nested object or an array. Data can also be a variable or the result of a function call; in which case it will be evaluated before being converted into a string.", "Let's create a simple API by creating a route that responds with JSON at the path <code>/json</code>. You can do it as usual, with the <code>app.get()</code> method. Inside the route handler use the method <code>res.json()</code>, passing in an object as an argument. This method closes the request-response loop, returning the data. Behind the scenes it converts a valid JavaScript object into a string, then sets the appropriate headers to tell your browser that you are serving JSON, and sends the data back. A valid object has the usual structure <code>{key: data}</code>. Data can ba a number, a string, a nested object or an array. Data can also be a variable or the result of a function call; in which case it will be evaluated before being converted into a string.",
"Serve the object <code>{\"message\": \"Hello json\"}</code> as a response in JSON format, to the GET requests to the route <code>/json</code>. Then point your browser to <your-app-url>/json, you should see the message on the screen." "Serve the object <code>{\"message\": \"Hello json\"}</code> as a response in JSON format, to the GET requests to the route <code>/json</code>. Then point your browser to your-app-url/json, you should see the message on the screen."
], ],
"challengeSeed": [], "challengeSeed": [],
"tests": [ "tests": [
@ -157,13 +157,13 @@
"id": "587d7fb1367417b2b2512bf3", "id": "587d7fb1367417b2b2512bf3",
"title": "Implement a Root-Level Request Logger Middleware", "title": "Implement a Root-Level Request Logger Middleware",
"description": [ "description": [
"Before we introduced the <code>express.static()</code> middleware function. Now its time to see what middleware is, in more detail. Middleware functions are functions that take 3 arguments: the request object, the response object, and the next function in the applications request-response cycle. These functions execute some code that can have side effects on the app, and usually add informations to the request or response objects. They can also end the cycle sending the response, when some condition is met. If they dont send the response, when they are done they start the execution of the next function in the stack. This is triggered calling the 3rd argument <code>next()</code>. More information here in the express documentation.", "Before we introduced the <code>express.static()</code> middleware function. Now its time to see what middleware is, in more detail. Middleware functions are functions that take 3 arguments: the request object, the response object, and the next function in the applications request-response cycle. These functions execute some code that can have side effects on the app, and usually add informations to the request or response objects. They can also end the cycle sending the response, when some condition is met. If they dont send the response, when they are done they start the execution of the next function in the stack. This is triggered calling the 3rd argument <code>next()</code>. More information in the <a href='http://expressjs.com/en/guide/using-middleware.html' target='_blank'>express documentation</a>.",
"Look at the following example :", "Look at the following example :",
"<blockquote>function(req, res, next) {<br> console.log(\"I'm middleware...\");<br> next();<br>}</blockquote>", "<blockquote>function(req, res, next) {<br> console.log(\"I'm a middleware...\");<br> next();<br>}</blockquote>",
"Lets suppose we mounted this function on a route. When a request matches the route, it displays the string “Im middleware…”. Then it executes the next function in the stack.", "Lets suppose we mounted this function on a route. When a request matches the route, it displays the string “Im a middleware…”. Then it executes the next function in the stack.",
"In this exercise we are going to build a root-level middleware. As we have seen in challenge 4, to mount a middleware function at root level we can use the method <code>app.use(<mware-function)</code>. In this case the function will be executed for all the request. If you want a function to be executed lets say only for POST request, you could use <code>app.post(<mware-function>)</code>. Analogous methods exist for all the http verbs (GET, DELETE, PUT, …).", "In this exercise we are going to build a root-level middleware. As we have seen in challenge 4, to mount a middleware function at root level we can use the method <code>app.use(&lt;mware-function&gt;)</code>. In this case the function will be executed for all the requests, but you can also set more specific conditions. For example, if you want a function to be executed only for POST requests, you could use <code>app.post(&lt;mware-function&gt;)</code>. Analogous methods exist for all the http verbs (GET, DELETE, PUT, …).",
"Build a simple logger. For every request, it should log in the console a string taking the following format: <code>method path - ip</code>. An example would look like: <code>GET /json - ::ffff:127.0.0.1</code>. Note that there is a space between <code>method</code> and <code>path</code> and that the dash separating <code>path</code> and <code>ip</code> is surrounded by a space on either side. You can get the request method (http verb), the relative route path, and the callers ip from the request object, using <code>req.method</code>, <code>req.path</code> and <code>req.ip</code>. Remember to call <code>next()</code> when you are done, or your server will be stuck forever. Be sure to have the Logs opened, and see what happens when some request arrives…", "Build a simple logger. For every request, it should log in the console a string taking the following format: <code>method path - ip</code>. An example would look like: <code>GET /json - ::ffff:127.0.0.1</code>. Note that there is a space between <code>method</code> and <code>path</code> and that the dash separating <code>path</code> and <code>ip</code> is surrounded by a space on either side. You can get the request method (http verb), the relative route path, and the callers ip from the request object, using <code>req.method</code>, <code>req.path</code> and <code>req.ip</code>. Remember to call <code>next()</code> when you are done, or your server will be stuck forever. Be sure to have the Logs opened, and see what happens when some request arrives…",
"Hint: Express evaluates functions in order. This is true for middleware too. If you want it to work for all the routes, it should be mounted before them." "Hint: Express evaluates functions in the order they appear in the code. This is true for middleware too. If you want it to work for all the routes, it should be mounted before them."
], ],
"challengeSeed": [], "challengeSeed": [],
"tests": [ "tests": [
@ -181,11 +181,11 @@
"id": "587d7fb1367417b2b2512bf4", "id": "587d7fb1367417b2b2512bf4",
"title": "Chain Middleware to Create a Time Server", "title": "Chain Middleware to Create a Time Server",
"description": [ "description": [
"Middleware can be mounted at a specific route using <code>app.METHOD('<path>', mware)</code>. Middleware can also be chained inside route definition.", "Middleware can be mounted at a specific route using <code>app.METHOD(path, middlewareFunction)</code>. Middleware can also be chained inside route definition.",
"Look at the following example :", "Look at the following example:",
"<blockquote>app.get('/user', function(req, res, next){<br> req.user = getTheUserSync(); // Hypotetical Synchronous operation<br> next();<br>}, function(req, res) {<br> res.send(req.user)<br>})</blockquote>", "<blockquote>app.get('/user', function(req, res, next) {<br> req.user = getTheUserSync(); // Hypotetical synchronous operation<br> next();<br>}, function(req, res) {<br> res.send(req.user);<br>})</blockquote>",
"This approach is useful to split the server operations into smaller units. That leads a to a better app structure, and the possibility to reuse code in different places. This approach can be also used to perform some validation on the data. At each point of the middleware stack you can block the execution of the current chain and pass control to functions specifically desinged to handle errors. Or you can pass control to the next matching route, to handle special cases. We will see how in the advanced express section.", "This approach is useful to split the server operations into smaller units. That leads a to a better app structure, and the possibility to reuse code in different places. This approach can also be used to perform some validation on the data. At each point of the middleware stack you can block the execution of the current chain and pass control to functions specifically designed to handle errors. Or you can pass control to the next matching route, to handle special cases. We will see how in the advanced Express section.",
"In the route <code>app.get('/now', ...)</code> chain a middleware function and the final handler. In the middleware function you should add the current time to the request object in the <code>req.time</code> key. You can use new <code>Date().toString()</code>. In the handler, respond with a json object, taking the structure <code>{time: req.time}</code>.", "In the route <code>app.get('/now', ...)</code> chain a middleware function and the final handler. In the middleware function you should add the current time to the request object in the <code>req.time</code> key. You can use <code>new Date().toString()</code>. In the handler, respond with a JSON object, taking the structure <code>{time: req.time}</code>.",
"Hint: The test will not pass if you dont chain the middleware. If you mount the function somewhere else, the test will fail, even if the output result is correct." "Hint: The test will not pass if you dont chain the middleware. If you mount the function somewhere else, the test will fail, even if the output result is correct."
], ],
"challengeSeed": [], "challengeSeed": [],
@ -208,9 +208,9 @@
"id": "587d7fb2367417b2b2512bf5", "id": "587d7fb2367417b2b2512bf5",
"title": "Get Route Parameter Input from the Client", "title": "Get Route Parameter Input from the Client",
"description": [ "description": [
"When building an API, we have to allow users to comunicate us what they want to get from our service. For example, if the client is requesting informations about a user stored in the database, she needs a way to let us know which user she is interested in. One possible way to get this result, is using route parameters. Route parameters are named segments of the URL, delimited by slashes (/). Each segment captures the value of the part of the URL which match its position. The captured values are populated in the <code>req.params</code> object.", "When building an API, we have to allow users to comunicate us what they want to get from our service. For example, if the client is requesting information about a user stored in the database, they need a way to let us know which user they're interested in. One possible way to achieve this result is using route parameters. Route parameters are named segments of the URL, delimited by slashes (/). Each segment captures the value of the part of the URL which matches its position. The captured values can be found in the <code>req.params</code> object.",
"<blockquote>route_path: '/user/:userId/book/:bookId'<br>actual_request_URL: '/user/546/book/6754' <br>req.params: {userId: '546', bookId: '6754'}</blockquote>", "<blockquote>route_path: '/user/:userId/book/:bookId'<br>actual_request_URL: '/user/546/book/6754' <br>req.params: {userId: '546', bookId: '6754'}</blockquote>",
"Build an echo server, mounted at the route <code>GET /:word/echo</code>. Respond with a json document, taking the structure <code>{echo: <word>}</code>. You can find the word to be repeated at <code>req.params.word</code>. You can test your route from your browser the address bar, visiting some matching routes, e.g. <your-app-rootpath>/freecodecamp/echo" "Build an echo server, mounted at the route <code>GET /:word/echo</code>. Respond with a JSON object, taking the structure <code>{echo: word}</code>. You can find the word to be repeated at <code>req.params.word</code>. You can test your route from your browser's address bar, visiting some matching routes, e.g. your-app-rootpath/freecodecamp/echo"
], ],
"challengeSeed": [], "challengeSeed": [],
"tests": [ "tests": [
@ -232,10 +232,10 @@
"id": "587d7fb2367417b2b2512bf6", "id": "587d7fb2367417b2b2512bf6",
"title": "Get Query Parameter Input from the Client", "title": "Get Query Parameter Input from the Client",
"description": [ "description": [
"Another common way to get input from the client is by encoding the data after the route path, using a Query string. The query string is delimited by a question mark ?, and includes field=value couples. Each couple is separated by an ampersand &. Express can parse the data from the query string, and populate the object <code>req.query</code>. Some character cannot be in URLs, so the query string needs to be encoded. If you use the API from javascript, you can use specific methods to encode/decode the URL.", "Another common way to get input from the client is by encoding the data after the route path, using a query string. The query string is delimited by a question mark (?), and includes field=value couples. Each couple is separated by an ampersand (&). Express can parse the data from the query string, and populate the object <code>req.query</code>. Some characters cannot be in URLs, they have to be encoded in a <a href='https://en.wikipedia.org/wiki/Percent-encoding' target='_blank'>different format</a> before you can send them. If you use the API from JavaScript, you can use specific methods to encode/decode these characters.",
"<blockquote>route_path: '/library'<br>actual_request_URL: '/library?userId=546&bookId=6754' <br>req.query: {userId: '546', bookId: '6754'}</blockquote>", "<blockquote>route_path: '/library'<br>actual_request_URL: '/library?userId=546&bookId=6754' <br>req.query: {userId: '546', bookId: '6754'}</blockquote>",
"Build an API endpoint, mounted at <code>GET /name</code>. Respond with a json document, taking the structure <code>{ name: '<firstname> <lastname>'}</code>. The first and last name parameters should be encoded in a query string e.g. <code>?first=<firstname>&last=<lastname></code>.", "Build an API endpoint, mounted at <code>GET /name</code>. Respond with a JSON document, taking the structure <code>{ name: 'firstname lastname'}</code>. The first and last name parameters should be encoded in a query string e.g. <code>?first=firstname&last=lastname</code>.",
"TIP: In the following exercise we are going to receive data from a POST request, at the same <code>/name</code> route path. If you want you can use the method <code>app.route(<path>).get(<handler>).post(<handler>)</code>. This syntax allows you to chain different verb handlers on the same path route. You can save a bit of typing, and have cleaner code." "TIP: In the following exercise we are going to receive data from a POST request, at the same <code>/name</code> route path. If you want you can use the method <code>app.route(path).get(handler).post(handler)</code>. This syntax allows you to chain different verb handlers on the same path route. You can save a bit of typing, and have cleaner code."
], ],
"challengeSeed": [], "challengeSeed": [],
"tests": [ "tests": [
@ -258,13 +258,13 @@
"title": "Use body-parser to Parse POST Requests", "title": "Use body-parser to Parse POST Requests",
"description": [ "description": [
"Besides GET there is another common http verb, it is POST. POST is the default method used to send client data with HTML forms. In the REST convention POST is used to send data to create new items in the database (a new user, or a new blog post). We dont have a database in this project, but we are going to learn how to handle POST requests anyway.", "Besides GET there is another common http verb, it is POST. POST is the default method used to send client data with HTML forms. In the REST convention POST is used to send data to create new items in the database (a new user, or a new blog post). We dont have a database in this project, but we are going to learn how to handle POST requests anyway.",
"In these kind of request the data doesnt appear in the URL, it is hidden in the request body. This is a part of the HTML request, also called payload. Since HTML is text based, even if you dont see the data, it doesnt mean that they are secret. The raw content of an HTTP Post is shown below:", "In these kind of requests the data doesnt appear in the URL, it is hidden in the request body. This is a part of the HTML request, also called payload. Since HTML is text based, even if you dont see the data, it doesnt mean that they are secret. The raw content of an HTTP POST request is shown below:",
"<blockquote>POST /path/subpath HTTP/1.0<br>From: john@example.com<br>User-Agent: someBrowser/1.0<br>Content-Type: application/x-www-form-urlencoded<br>Content-Length: 20<br>name=John+Doe&age=25</blockquote>", "<blockquote>POST /path/subpath HTTP/1.0<br>From: john@example.com<br>User-Agent: someBrowser/1.0<br>Content-Type: application/x-www-form-urlencoded<br>Content-Length: 20<br>name=John+Doe&age=25</blockquote>",
"As you can see the body is encoded like the query string. This is the default format used by HTML forms. With Ajax we can also use JSON to be able to handle data having a more complex structure. There is also another type of encoding : multipart/form-data. This one is used to upload binary files.", "As you can see the body is encoded like the query string. This is the default format used by HTML forms. With Ajax we can also use JSON to be able to handle data having a more complex structure. There is also another type of encoding: multipart/form-data. This one is used to upload binary files.",
"In this exercise we will use an urlencoded body.", "In this exercise we will use an urlencoded body.",
"To parse the data coming from POST requests, you have to install a package: the body-parser. This package allows you to use a series of middleware, which can decode data in different formats. See the docs <a href=\"https://github.com/expressjs/body-parser\" target=\"_blank\" >here</a>.", "To parse the data coming from POST requests, you have to install a package: the body-parser. This package allows you to use a series of middleware, which can decode data in different formats. See the docs <a href=\"https://github.com/expressjs/body-parser\" target=\"_blank\" >here</a>.",
"Install the body-parser module in your package.json. Then require it at the top of the file. Store it in a variable named bodyParser.", "Install the body-parser module in your package.json. Then require it at the top of the file. Store it in a variable named bodyParser.",
"The middleware to handle url encoded data is returned by <code>bodyParser.urlencoded({extended: false})</code>. <code>extended=false</code> is a configuration options that tells the parser to use the classic encoding. When using it, values can be only strings or arrays. The extended version allows more data flexibility, but is outmatched by JSON. <code>app.use()</code> the function returned by the previous method call. As usual, the middleware must be mounted before all the routes which need it." "The middleware to handle url encoded data is returned by <code>bodyParser.urlencoded({extended: false})</code>. <code>extended=false</code> is a configuration option that tells the parser to use the classic encoding. When using it, values can be only strings or arrays. The extended version allows more data flexibility, but it is outmatched by JSON. Pass to <code>app.use()</code> the function returned by the previous method call. As usual, the middleware must be mounted before all the routes which need it."
], ],
"challengeSeed": [], "challengeSeed": [],
"tests": [ "tests": [
@ -284,7 +284,7 @@
"description": [ "description": [
"Mount a POST handler at the path <code>/name</code>. Its the same path as before. We have prepared a form in the html frontpage. It will submit the same data of exercise 10 (Query string). If the body-parser is configured correctly, you should find the parameters in the object <code>req.body</code>. Have a look at the usual library example:", "Mount a POST handler at the path <code>/name</code>. Its the same path as before. We have prepared a form in the html frontpage. It will submit the same data of exercise 10 (Query string). If the body-parser is configured correctly, you should find the parameters in the object <code>req.body</code>. Have a look at the usual library example:",
"<blockquote>route: POST '/library'<br>urlencoded_body: userId=546&bookId=6754 <br>req.body: {userId: '546', bookId: '6754'}</blockquote>", "<blockquote>route: POST '/library'<br>urlencoded_body: userId=546&bookId=6754 <br>req.body: {userId: '546', bookId: '6754'}</blockquote>",
"Respond with the same JSON object as before: <code>{name: '<firstname> <lastname>'}</code>. Test if your endpoint works using the html form we provided in the app frontpage.", "Respond with the same JSON object as before: <code>{name: 'firstname lastname'}</code>. Test if your endpoint works using the html form we provided in the app frontpage.",
"Tip: There are several other http methods other than GET and POST. And by convention there is a corrispondence between the http verb, and the operation you are going to execute on the server. The conventional mapping is:", "Tip: There are several other http methods other than GET and POST. And by convention there is a corrispondence between the http verb, and the operation you are going to execute on the server. The conventional mapping is:",
"POST (sometimes PUT) - Create a new resource using the information sent with the request,", "POST (sometimes PUT) - Create a new resource using the information sent with the request,",
"GET - Read an existing resource without modifying it,", "GET - Read an existing resource without modifying it,",

View File

@ -17,7 +17,7 @@
[ [
"", "",
"", "",
"Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicaly visible for our testing.<br>Start this project on Glitch using <a href='https://glitch.com/#!/import/github/freeCodeCamp/boilerplate-npm'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-npm/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe!", "Working on these challenges will involve you writing your code on Glitch on our starter project. After completing each challenge you can copy your public Glitch url (to the homepage of your app) into the challenge screen to test it! Optionally you may choose to write your project on another platform but it must be publicly visible for our testing.<br>Start this project on Glitch using <a href='https://glitch.com/#!/import/github/freeCodeCamp/boilerplate-npm'>this link</a> or clone <a href='https://github.com/freeCodeCamp/boilerplate-npm/'>this repository</a> on GitHub! If you use Glitch, remember to save the link to your project somewhere safe!",
"" ""
] ]
], ],