Skip to content

the-collab-lab/tcl-54-smart-shopping-list

Repository files navigation

Knead To Buy

A full stack React app for shoppers who want to keep track of things they buy and remember how soon they need to buy them again.

Why We Built This

This project is the culmination of the collaborative efforts of four highly-skilled developers as part of The Collab Lab program under the guidance of mentors. It serves as a milestone in our ability to work together, acquire new technical skills and adopt the Agile methodology.

Developers:

Technologies/Tools Used

  • React.js
  • Vite
  • React Boostrap
  • HTML5/CSS3
  • Firebase/Firestore

Live Demo

Try the app live at https://tcl-54-smart-shopping-list.web.app/

Features

  • User can create a new shopping list
  • User can join an existing list
  • User can exit their list to join/create a new one
  • User can view an onboarding modal to learn more about the app
  • User can add items to their list
  • User can delete items from their list
  • User can choose how urgent they want to buy the items
  • User can mark items as purchased
  • User can see that the app learns the intervals at which the items are bought and predict how soon these items need to be bought again

Stretch Features

TBD

Preview

knead-to-buy

Testing

System Requirements

To run this project and its dependencies, you'll need these in your local machine:

  • Node.js v18 or higher
  • NPM 8 or higher

Getting Started (cloning repo)

  1. Click on the "Code" tab. It may already be selected.
  2. Click the green "Code" button to reveal a "Clone" popup.
  3. The "HTTPS" tab should be automatically selected. If not, click "HTTPS."
  4. Click the copy button to copy the url of this repository to your clipboard. screenshot of "Code" tab on GitHub

From your terminal, cd into the directory where you want this project to live. screenshot of how to navigate folders in terminal

Once you’re in the directory, type git clone followed by the web URL you just copied to your clipboard from GitHub. Then cd into the directory that is created. screenshot of how to git clone

Install the project’s dependencies

Once you’ve cloned the project locally and you’re in the project directory, you’ll want to install the project’s dependencies. To do so, type the following into your terminal: npm ci

screenshot of npm ci in the terminal

Access the project in your browser

After you’ve cloned the project locally and updated the dependencies, run the project by typing the following into your terminal: npm start. You should be able to see the project at localhost:3000.