Code Monkey home page Code Monkey logo

instrument-merchandiser's Introduction

React Application with full CRUD Functionality, 04.22.2020

By Tiffany Siu, Krista Rutz, Andriy Veremyeyev

Project Status: Inactive โ€“ The project has reached a stable, usable state but is no longer being actively developed; support/maintenance will be provided as time allows. LastCommit Languages MIT license


Table of Contents

  1. Description
  2. Setup/Installation Requirements
  3. Notable Features
  4. Specifications
  5. Screenshots
  6. Known Bugs
  7. Support and Contact Details
  8. License

Description

This application was created for an assignment for the Epicodus Intro to Programming and C#/React course. This was to practice adding CRUD functionality to a React application.

For our application, this site is selling musical instruments. It is for both the seller (with the ability to add, edit, and delete instruments from the list) and a buyer (with the ability to buy instruments). This site currently does not have the authentication to differentiate between the two types of users and all users currently have the ability to do all functions due to this assignment being focused on learning how to code the different functionalities.

A deployed version of this application can be found here.

Component Diagram

Component Diagram

Assignment Prompt

Build a website for selling merchandise for a band, author, sports team, or any other purveyor that interests you.

A user should be able to do the following:

  • Create, Read, Update and Delete items in the store. Items should have fields for name, description, and quantity (along with any other fields you wish to add).
  • Increase or decrease the quantity of an item in the store. For instance, if a user clicks "Buy", the quantity will decrease by one. If a user clicks "Restock", it will increment by a specified number.
  • When the quantity of an item is reduced to 0, the item should say "Out of Stock". A user should not be able to reduce the quantity of an item below 0.

Further Exploration

  • Create a Cart component. When a user clicks "Buy", the specified item should be added to the cart.
  • A user should be able to view and remove items from the cart.
  • Create a widget that shows the number of items in the cart. This widget should be updated when items are added to the cart.

Setup/Installation Requirements

Requirements to Run

  • Web Browser
  • Webpack
  • Node.js
  • NPM

Instructions

This page may be viewed by:

  1. Download and install Node.js from the official website
  2. Clone the repository from my GitHub page
  3. Use a command line/Bash to move to the project directory with cd project-directory
  4. Run npm install to get all dependencies.
  5. Run npm run start to start up the program

Other Technologies Used

  • HTML
  • CSS
  • Javascript
  • React
  • ESLint
  • Babel
  • Markdown

Notable Features

Specifications

Screenshots

Known Bugs

There are currently no known bugs in this program

Support and contact details

If there are any question or concerns please contact us at our emails: Tiffany, Krista, and Andriy. Thank you.

License

This software is licensed under the MIT license

Copyright (c) 2020 Tiffany Siu, Krista Rutz, Andriy Veremyeyev

instrument-merchandiser's People

Contributors

kristarutz avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.