thebearingedge / jamazon

A website for shoppers who want to buy drums online.

jamazon

A website for shoppers who want to buy drums online.

jamazon's Issues

A user can view items for sale.

🍔 Motivation

Users will want to buy some drums, so we will need to list the available items.

🔧 Implementation

• Project set up
  • Add initial HTML, CSS, and JavaScript files.
  • Add linter configurations.
• Create a wire frame.
• Create a data model of the catalog items.
• Define a function for rendering a single catalog item.
• Render all catalog items and append them to the DOM when the page is loaded.

A user can view the details of an item.

🍔 Motivation

Our customers may want to know more information about a given item.

🔧 Implementation

• Create a wire frame
• Include detailed item description in Data Model.
• Listen for link clicks on the item list.
• Identify the clicked item.
• Find the data object for the clicked item.
• Render the item details.
• Hide the item list.
• Show the item details.

A user can add an item to their cart.

🍔 Motivation

Users will want to collect items so that they can buy them all at once.

🔧 Implementation

• Create a wire frame.
• Create a data model of the shopping cart.
• Add an "add to cart" button to the item details view.
• Listen for clicks on the item details view.
• Identify the clicked item.
• Find the data object for the clicked item.
• Add the item to the shopping cart.
• Display the cart quantity on page load.
• Update the cart display when an item is added.
• Allow user to revisit item list.

A user can checkout.

🍔 Motivation

Once a customer has finished shopping, we should collect their payment details!

🔧 Implementation

• Create a wire frame.
• Add a checkout view in HTML.
• Define a function for calculating the cart total.
• Listen for click events on the shopping cart icon.
• Show the checkout view on click.
• Listen for checkout form submission.
• Confirm order with user on submission.
• Reset the cart and form.
• Show the item list.