Skip to content

Frugal-Foods/frugal-foods-fe

Repository files navigation

💲🍎Frugal Foods🍞💲

Table of Contents


About The Project

Frugal Foods is a bargain grocery shopping application. The user is met at the homescreen with a zipcode search, where they will enter their zipcode and search stores nearest to them. This prototype currently has two zipcodes available for demo: '80108' and '80206' and will only return stores under the Target and Kroger store portfolio. They are able to then select stores they want to shop at and POST those stores to our BE server to be associated with their user ID. All FE endpoints are utilizing GraphQL Apollo client for communication to our Back End server. From this point the user is able to search for specific grocery items from the stores they've selected and compare prices to find the most affordable option. The user can then add a grocery item to their "cart," where they will see a detailed list of what they're purchasing broken down by store. Additionally, there will be a sum total for what they will spend at each store. Items are also able to be deleted from the cart and update the quantity of each item. Visit our deployed webpage below to check it out!

Links

Features

User can search by zipcode (for ex.'80108') and select their chosen stores. Then search for items and add items to cart with a quantity: add-items-frugal-foods

User can then view items added to their cart that are separated out by which store the items are located at and the total price for each store. The user can then update quantity and delete items from cart. view-cart-frugal-foods

(back to top)

Learning Goals

Frugal Foods is the capstone project built during a two week timeframe during Turing School of Software and Design front-end and back-end engineering program. The goals of this group project were to:

  • Gain exposure working on a full stack team and focus on communication between front-end and back-end teams
  • Teach ourselves a new technology (we chose GraphQL for both the FE and BE teams)
  • Achieve >80% test coverage on the Front End application utilizing Cypress to create a smooth user experience
  • Use an agile process to turn well defined requirements into deployed and production ready software and hold daily standups and weekly retros
  • Implement continuous integration tools to build and automate the deployment of features such as CircleCI, Fly.io, and Heroku
  • Build application that meets our MVP(minimum viable product) and execute in development, test, CI, and production environments

(back to top)

Technologies

React React Router Cypress CSS3 Apollo GraphQL Ruby Rails Postgres CircleCI Heroku Figma

(back to top)

Setup

You can find both the FE repository and BE repository in the Frugal Foods organization.

  1. Clone both repos, making sure to add them to their own directories

    git clone [email protected]:Frugal-Foods/frugal-foods-fe.git
  2. Install NPM packages:

    npm install
    npm start
  3. Explore the website at https://localhost:3000!

View the README in the back end repository for further setup instructions.

(back to top)

Future Iterations

  • Due to rate limiting for free usage of both the Target and Kroger APIs, our prototype only includes data from two zipcodes. Our goal moving forward to make this application more dynamic is to make live API calls to return data for any user in any zipcode.
  • Implement authentication, allowing a user to create an account and have their popular stores and items remembered
  • Implement 'shop by department' feature that allows user to browse all products for a store along with the ability to search for a specific item.
  • Collect data for other popular grocery stores to allow the user more options when choosing stores near them.
  • Implement 'cheapest in one stop' feature that allows a user to search all items on their grocery list and see which store would have the cheapest total if they only wanted to stop at one store.
  • Implement a Google maps feature that creates a driving route for the user depending on which stores were chosen and their respective addresses.

(back to top)

Contributors

Front End Team:

Back End Team:

(back to top)

About

Capstone Project for Bargain Grocery Deals

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •