Send JSON in TypeScript

A browser shows pages to people, but an API answers other programs: a phone app, a website's code, another server. Those programs may be written in any language, so they need the data as text, in a format they all read. That format is JSON.

JSON looks a lot like TypeScript's arrays and objects: a list is written in [ ], and an object in { }, as pairs of a key and a value. Keys and text go in double quotes; numbers don't. In Express, res.json(...) turns an array or object into a JSON response:

app.get("/colors", (req: Request, res: Response) => {
  const colors: string[] = ["red", "green", "blue"];
  res.json(colors);
});

This route answers the JSON list ["red", "green", "blue"], and tells the client the answer is JSON. The types, like string[] or the Product interface in your file, are only for TypeScript: they are not sent, and the JSON has the same keys and values as the objects. When you run your code, the results show the keys of each object in alphabetical order, so "category" comes first. That's fine: programs find a value by its key, not by its place.

The products array, of type Product[], is already in your file. Your app must answer:

GET /products  →  200  [{"id": 1, "name": "Mug", "price": 12, "category": "kitchen"},
                        {"id": 2, "name": "Notebook", "price": 7, "category": "office"},
                        {"id": 3, "name": "Lamp", "price": 29, "category": "home"},
                        {"id": 4, "name": "Pen", "price": 2, "category": "office"}]
GET /          →  200  Welcome to the shop!

Your task: add a route for /products with a function that takes req: Request and res: Response and answers with the whole products array as JSON.

Assignment
Follow the Coding Tutorial to add the GET /products route and send the product list as JSON.

Hint
Copy the shape of the route for "/", with the new path. Inside its function, pass the array to res.json(...).