Using an API with JS


Work with your assigned partner built a "front-end" for a vending machine API. The "back-end" is here, download it and run it with Python. You will need the flask module installed as well. Note that the server will be running on port 5000.

Create an index.html file in the same directory as vend.py and add your HTML and JavaScript to it to complete the front-end. The application should allow for the user to see all the products, stock new ones, purchase products, and restock existing ones. See the API documenation bellow:

Method Endpoint Description Request Body (JSON) Response Example
GET /item Retrieve all items in the vending machine. None
[
   {
    "id": 1,
    "name": "Chips",
    "price": 1.5,
    "quantity": 5
   }
]
POST /item Add a completely new product to the machine.
{
  "name": "Soda",
  "price": 1.0,
  "quantity": 10
}
{
  "id": 4,
  "name": "Soda",
  "price": 1.0,
  "quantity": 10
}
PUT /item/<id>/buy Purchase a single item. Reduces stock by 1. None
{
  "id": 1,
  "name": "Chips",
  "price": 1.5,
  "quantity": 4
}
PUT /item/<id>/restock Add stock to an existing item.
{
  "amount": 5
}
{
  "id": 1,
  "name": "Chips",
  "price": 1.5,
  "quantity": 9
}

This page was last modified on 2026-08-19 at 20:15:09.

Copyright © 2018–2026 George Fox University. All rights reserved.