Exercise number four of the FreeCodeCamp Express.js tutorial. We’re flying right along! Here’s the directions and hints they give us:
GOOD OLD FORM
Exercise 4 of 8
Write a route (‘/form’) that processes HTML form input (<form><input name=”str”/></form>) and prints backwards the str value.
——————————————————————————-
## HINTS
To handle POST request use the post() method which is used the same way as get():
app.post(‘/path’, function(req, res){…})
Express.js uses middleware to provide extra functionality to your web server.
Simply put, a middleware is a function invoked by Express.js before your own request handler.
Middlewares provide a large variety of functionalities such as logging, serving static files and error handling.
A middleware is added by calling use() on the application and passing the middleware as a parameter.
To parse x-www-form-urlencoded request bodies Express.js can use urlencoded() middleware from the body-parser module.
var bodyparser = require(‘body-parser’)
app.use(bodyparser.urlencoded({extended: false}))
Read more about Connect middleware here:
The documentation of the body-parser module can be found here:
Here is how we can flip the characters:
req.body.str.split(”).reverse().join(”)
——————————————————————————-
## NOTE
When creating your projects from scratch, install the body-parser dependency with npm by running:
$ npm install body-parser
…in your terminal.
Again, the port to use is passed expressworks to the application as process.argv[2].
Okay, first we need to install the package as mentioned in the note. Typing npm install body-parser at the $ prompt gives us:
npm WARN package.json chat-example@0.0.0 No repository field.
npm WARN package.json chat-example@0.0.0 No license field.
body-parser@1.15.1 node_modules/body-parser
├── content-type@1.0.2
├── bytes@2.3.0
├── depd@1.1.0
├── qs@6.1.0
├── on-finished@2.3.0 (ee-first@1.1.1)
├── raw-body@2.1.6 (unpipe@1.0.0)
├── http-errors@1.4.0 (inherits@2.0.1, statuses@1.3.0)
├── debug@2.2.0 (ms@0.7.1)
├── iconv-lite@0.4.13
└── type-is@1.6.13 (media-typer@0.3.0, mime-types@2.1.11)
This one is actually easier than it looks, because they give you everything, and I mean everything, you need to do it.
First we declare variables, noting that as usual they are supplying us the port in process.argv[2]:
var express = require("express");
var app = express();
var port = process.argv[2];
Next add the lines relevant to body-parser:
var bodyparser = require('body-parser');
app.use(bodyparser.urlencoded({extended: false}));
Add the line for the post request:
app.post('/path', function(req, res){...})
And inside the brackets goes the code for reversing the string:
req.body.str.split('').reverse().join('');
Oh yeah….there IS one sneaky little it. See up there in the directions where it says “Write a route (‘/form’)”? And see how in the app.post() line it says ‘/path’? Yeah, that gets changed. Presto, we’ve done it!
And here’s the final program:
var express = require("express");
var app = express();
var port = process.argv[2];
var bodyparser = require('body-parser')
app.use(bodyparser.urlencoded({extended: false}))
app.post('/form', function(req, res) {
console.log(res.send(req.body.str.split('').reverse().join('')));
});
app.listen(port);
See you next time!