Express Calculator

Make a calculator that takes two params from the URI and sends the sum to the browser!





🔵 Setup

  • Make a directory express-calculator.
  • cd into the express-calculator directory.
  • touch server.js and open the project.
  • npm init
  • Enter server.js as the entry point (if it hasn't already defaulted to it)
  • npm i express



Set up server code:

const express = require('express');
const app = express();

const port = 3000;

app.listen(port, () => {
	console.log('Express is listening on port: ', port);
});



Instructions

Make a route in server.js that responds to the URI calc. Give the route two params, :num1 and :num2.

Make it so that if the user enters: http://localhost:3000/calc/4/4 in the browser, the server sends back a response of 8.




Notes

The params come in as strings, so to add them together as numbers they must be parseInt'ed or Number()'ed

The sum will be a number. If you try to send a number to the browser it will be interpreted as an error code.

The number must be coerced into a string when you send it back. The coercion could be as simple as:

res.send("the sum is " + sum);



req.query

Let's expand our calculator so that we can get it to do more than just addition.

We could make a route for each arithmetic expression (addition, multiplication, etc.), or code in another param, but there is another way using req.query. Let's explore:

Example server route:

app.get('/someroute', (req, res) => {
  console.log('req.query: ', req.query);
  res.send('someroute accessed');
});


Here we will console.log the query object instead of the params object.

What is the query object?

Go to this URL in your browser: http://localhost:3000/someroute?operation=add

Not that we begin our query with a ? and then add a key-value pair using an equals sign.

Check in Terminal for the req.query console.log.

req.query { operation: 'add'}

It gives us back the key-value pair from our URL.




Directions

Make a new route for the URI calcquery, with the same :num1 and :num2 params.

Copy and paste your calculator code into the route.

app.get('/calcquery/:num1/:num2', (req, res) => {
	// calculator code
});

Add in if statement that checks for a key within req.query called operation . If the value is "add", perform a sum and res.send the sum.

If the value is "multiply", perform multiplication.

Do the same for subtraction, division, and exponents.

Add in an else to to send a message: "no operation"

NOTE: We are allowed have many res.sends within a single route if they send independently, ie. they are inside if statements and have no risk of running at the same time.




Bonus

  • Figure out how a user/client could change the query parameters without typing in the URL bar. Hint (you'll need to do a bit of research!)
  • Finish the morning lab