1 / 9

Node.js

Node.js. Week 04 (Final Project) http://fog.ccsf.edu/~hyip. Installing Express for final project. Create a new directory final_project which is under the nodejs_workspace directory. (mkdir final_project, then cd final_project).

barnest
Download Presentation

Node.js

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Node.js Week 04 (Final Project) http://fog.ccsf.edu/~hyip

  2. Installing Express for final project • Create a new directory final_project which is under the nodejs_workspace directory. (mkdir final_project, then cd final_project). • Use the npm init command under the new final_project folder to create a package.json file for your application – final_project. npm init • NOTE: you can hit RETURN to accept the defaults for most of them, except entry point is app.js: entry point: app.js • Install express locally in the nodejs_workspace directory, and save it in the dependencies list: npm install express --save • Install body-parser middleware, which is responsible for handling Raw, JSON, URL, and Text encoded form data: • NOTE: body-parser is a piece of express middleware that reads a form's input and stores it as a javascript object accessible through `req.body` npm install body-parser --save • Install multer middleware, which is responsible for the handling of multipart/form-data: npm install multer --save

  3. Handle get method • We are going to use the Form GET method in HTML so as to pass two values. • The input will be handled by the router “process_get” inside the file “server.js” • Steps to complete the project: • Create index.html. • Create server.js. • Start the server: node server.js • Run the program from browser: http://localhost:8081/index.html

  4. Create index.html <html> <head><title>this file is used with server.js</title> </head> <body> <h1>Process get method</h1> <form action="http://127.0.0.1:8081/process_get" method="get"> Your First Name: <input type="text" name="fname"> <br> Your Last Name: <input type="text" name="lname"> <br> <input type="submit" value="Process Get method"> </form> </body> </html>

  5. Create server.js var express = require('express'); var app = express(); app.get('/index.html', function (req, res) { res.sendFile(__dirname + "/index.html"); }); app.get('/process_get', function (req, res) { var response = { fname: req.query.fname, lname: req.query.lname }; console.log(response); // res.end(JSON.stringify(response)); res.json(response); }); var server = app.listen(8081, function () { console.log('server.js is listening at http://127.0.0.1:8081/index.html or http://localhost:8081/index.html'); });

  6. Handle post method • We are going to use the Form GET method in HTML so as to pass two values. • The input will be handled by the router “process_post” inside the file “server.js” • Steps to complete the project: • Update index.html. • Update server.js. • Start the server: node server.js • Run the program from browser: http://localhost:8081/index.html

  7. Update index.html • Add the following codes to the index.html <hr> <h1>Process post method</h1> <form action="http://127.0.0.1:8081/process_post" method="post"> Your First Name: <input type="text" name="fname"> <br> Your Last Name: <input type="text" name="lname"> <br> <input type="submit" value="Process Post method"> </form>

  8. Update server.js • Add the following codes to the server.js var bodyParser = require('body-parser'); // creating the application/x-www-form-urlencoded parser var urlenParser = bodyParser.urlencoded({ extended: false}); app.post('/process_post', urlenParser, function (req, res) { var response = { fname: req.body.fname, lname: req.body.lname }; console.log(response); res.end(JSON.stringify(response)); });

  9. References • Node.js the Right Way, Jim R. Wilson, The Programatic Bookshelf, ISBN 978-1-937785-73-4 • NodeJS: Practical Guide for Beginners, Matthew Gimson, ISBN 978-1-519354-07-5 • Express.js: Node.js Framework for Web Application Development, Daniel Green, ISBN 978-1-530204-06-9 • Express.com • Tutorials Point • The Node Beginner Book, Manuel Kiessling, Leanpub, Link.

More Related