Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/milliorn/grocery-list

simple, intuitive interface for creating, editing, and deleting grocery items. Users can add items to their shopping list and remove them when they are no longer needed.
https://github.com/milliorn/grocery-list

crud crud-operations development-environment food front-end-development grocery-application grocery-crud grocery-shopping localstorage organizer productivity react responsive responsive-design shopping shopping-cart shopping-list state-management user-interface web-application

Last synced: 9 days ago
JSON representation

simple, intuitive interface for creating, editing, and deleting grocery items. Users can add items to their shopping list and remove them when they are no longer needed.

Awesome Lists containing this project

README

        

# Grocery List CRUD App

[![pages-build-deployment](https://github.com/milliorn/Grocery-List/actions/workflows/pages/pages-build-deployment/badge.svg)](https://github.com/milliorn/Grocery-List/actions/workflows/pages/pages-build-deployment)
[![CodeQL](https://github.com/milliorn/Grocery-List/actions/workflows/github-code-scanning/codeql/badge.svg)](https://github.com/milliorn/Grocery-List/actions/workflows/github-code-scanning/codeql)

Grocery List is a web application built using React that helps users manage their grocery shopping. It provides a simple, intuitive interface for creating, editing, and deleting grocery items. Users can add items to their shopping list and remove them when they are no longer needed.

## Features

- Create a grocery list by adding items
- Add Quantity
- Remove items from the list
- Update items
- User-friendly and responsive design
- Store list locally in browser

## Technologies Used

- React: A JavaScript library for building user interfaces
- LocalStorage: Browser API for storing grocery list data locally
- React Icons: A library of popular icons for React
- Tailwind-UI: A popular React UI framework for creating beautiful user interfaces

## Getting Started

### Prerequisites

- Node.js: Make sure you have Node.js installed on your machine.

### Installation

1. Clone the repository: git clone https://github.com/milliorn/Grocery-List.git
2. Navigate to the project directory: cd Grocery-List
3. Install the dependencies: npm install
4. Start the development server: npm start
5. Open your browser and visit `http://localhost:3000` to access the application.

## License

This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.

## Acknowledgements

- This project was inspired by the need for a simple and efficient grocery list management tool.
- Special thanks to the contributors who helped improve and enhance the application.

## Links

react-icons -> https://github.com/react-icons/react-icons

sweetalert2 -> https://github.com/sweetalert2/sweetalert2

uuid -> https://github.com/uuidjs/uuid

tailwindcss -> https://tailwindcss.com/docs/guides/create-react-app

typescriptlang -> https://www.typescriptlang.org/