🥦 Credits
🌶️ Credits
🍉 Contact
🧄 License
Community fridges are fully stocked, volunteer-run refrigerators that are open to the general public. Anyone can take what they need, no questions asked! Community fridges have been popping up all over the US and have become a way for communities to battle food insecurity due to homelessness, unemployment, and stalled stimulus checks.
Did you know there are over 14 community fridges in Philadelphia? Part of the challenge of supporting a community fridge is knowing what is most needed in advance of dropping off provisions. Fridge For All aims to tackle this unique issue by creating an interactive database where users can see what's most urgent ahead of time, and plan accordingly.
Users can add what they drop off to increase the total quantity for other users to see, while also being able to subtract from the quantity if they take anything home. In this way, we hope to encourage people to engage with their community more while reducing hunger and food waste.
Start by installing front and backend dependencies. While in this directory, run the following command:
npm install
This should install node modules within the server and the client folder.
After both installations complete, run the following command in your terminal:
npm start
Your app should now be running on http://localhost:3000. The Express server should intercept any AJAX requests from the client.
Fridge For All Landing Page
Demonstrating app registration/login functionality
Demonstrating app inventory counting, sorting and delete functionality
Demonstrating map function, and "About" section.
Technology used to create application
-
React
-
JSON Web Token
-
Bcrypt
-
Mongo DB
-
NodeJS
-
Mapquest
-
Axios
-
React-Bootstrap
-
Mongo AtlasDB
-
Testing through Postman
-
Hosting on Heroku
- Font Awesome
-
As a team of three, we each took on quite a bit of work for this project. Luke took on a process for authentication which was so new that he was waiting for guidance to be released on implementation as he was writing the code.
-
In styling the project, Kara initially began working with Material UI. After exploring the options that it provided, it did not seem like the best fit for our project and she quickly pivoted to React-Bootstrap.
-
We very much wanted to include a feature to translate the app from English to Spanish. Meredith completed the setup for i18next only to discover that it requires programmers to create JSON files containing all words to be translated along with the corresponding language translation which took the endeavour far beyond the time available for this project.
We are very excited about the future of this project and have many ideas for how to grow the app's utility.
Some of the ideas that we would like to implement are:
-
Adding databases to encompass all of the community fridges in Philadelphia.
-
Adding the ability to generate directions from your current location or address input through our mapquest API.
-
Adding the ability to translate the page into multiple languages.
-
Setting up the ability for users to opt-in for email updates from fridge organizers.
-
Creating the ability for the app to scan a QR code on each fridge to bring users quickly to that specific fridge's database.
- npm docs react-router-dom package
- React Bootstrap Components Docs: Tables
- React Dev Docs: Create React App, Folder Structure
- React Training–React Router
- Four ways to style React components
- 14 FREE Community Refrigerators Around Philadelphia
Kara Schmidt, Luke Martin, Meredith Jones
@Kara Schmidt @Luke Martin @MeredithJones
This project is licensed under the terms of the MIT license.