Previous Lecture Complete and continue  

  Good Old Form

Welcome back to the Expressworks. So we've already covered Static Middleware, Jade, and now we're gonna work with the Form. This is the traditional form that you might see, and which looks something like this, with the form HTML tag. The way we process those forms, we use app.post, because that will be a post request, incoming post request. And then, I'm just keeping all the description. What we need to remember, we need to install this module, because that's what will enable Express.js to process the incoming data as a normal JavaScript object, instead of having it as a url-encoded string. Okay, so now we'll go to the Editor, and start working on this exercise. In the editor I'm creating a new file, 4-form.js. As always, we import the dependencies, such asitself, then we import the bodyParser, which is our middleware. It comes frommodule. That's the npm name.

And then we create the Express.js app, and we apply the bodyParser middleware. The way we do it, we use .urlencoded, and then we also pass {extended: false})), basically means extended and non-extended, means process complex queries, or not complex object, nested objects, and then, inside of our request handler in the /forms, which is a post, not get, that's important. We magically get this object reg.body, and everything that client sends to us will be in that object, will be a string, and then if you read the problem carefully we need to reverse the string, which I'm using split, reverse, and then join. Those are string and array methods. So split will create an array, reverse will reverse the array, and join will create a string again. And then I'm starting this server on either argv[2], which is its first argument. The workshop will provide the value to us, and/or I would start it on 3000. Okay so, let's go ahead and try it. So remember it's also used, we need to install body-parser, so this is a good time to do it. Again, I'm saving the version, and ideally you would have separate folders for separate projects, but right now I'm just dumping everything into one common folder, all the solutions.

Okay, so now we can actually run our file. And it works, which is wonderful. Now let's verify it. And it passes. And if we compare it to the official solution, everything's exactly the same, except that we don't need this 3000 fallback. 3000 is convenient if you want to have the port number for yourself, and don't want to provide that manually. So, and I can demonstrate it to you. So what we do is just start at the server, as we usually do. To test the server, I'm using something called Postman. You can get it as a free application. This has a nice GUI compared to using in a command line. So I have form data, I have some W-form encoded, so I'm sending it. And this is my response, yay, which is exactly the same just because it's a reverse string. So now it actually works. We'll get rid of the form data. So if we try to submit the form data, it's not working because we're actually accepting in the form url-encoded format. And now it works. We send poo, and we get oob.

Discussion
0 comments