Bootcamp
Search…
7.ICE.5: Create Item

Introduction

We will add a "create item" feature to the sample e-commerce app from Module 7.7: Designing Component Hierarchy.

Setup

Begin with the example e-commerce React app at https://github.com/rocketacademy/react-ecom-bootcamp.

Base

  1. 1.
    Add a special "admin" column / component to the app layout that renders a form to add an item. Create inputs for each item field and use Axios to submit a post request to the server on form submission.
  2. 2.
    On the server create a controller that accepts the POST request and creates a new row in the items table. The controller should send the newly created item entry back to the client.
  3. 3.
    When the client React app receives the new item, push the item into the list of items.

Comfortable

Cart

When adding to the cart, add the logic so that if the user adds the same item twice, it does not duplicate the item in the cart, but adds to the total quantity.

Checkout

Create functionality to check out the items in the cart. When the user checks out, record an entry in a new DB table called orders that references the items in the checked-out cart. After the order is created, empty the cart.