Project Ropa App

Inspiration ✨

Project Ropa is a nonprofit organization that distributes donated clothing items and hygiene kits through their mobile closet. Currently, they have no way for donors to keep track of the status of their donated items and no effective way to deal with duplicate entries. The NPO wanted a mobile solution that addresses these issues. Our team connected with Project Ropa's mission to not only serve our collective community, but do so sustainably and reduce textile waste in this age of fast fashion. We used the themes of the Project Ropa website to create a mobile application that addresses their problem statement, but also align with their image and be easily modified to fit their goals.

What it does 📱

Allows donors to track their donations using a QR code based system and add new items through a scanner in app. On the admin side, the nonprofits can update the item status at each point of the distribution process and generate new QR codes for new items.

How we built it

React Native, Supabase (database, open-source) (back-end)
Expo (framework) to test and service our app and integrate camera features
Tailwind CSS (styling, open-source), TypeScript (front-end)
Figma to make icons and design our screen pages

Challenges we ran into

Merge conflicts was a big challenge as every member was working on their own branch for certain features which was a roadbump towards the end of development when everyone merged their different branches. Tailwind CSS had a learning curve because although we were familiar with basic CSS, Tailwind syntax was a bit different than we were used to. Also, it was many of our first time using React Native and app building in general which also had its own learning curve.

Accomplishments that we're proud of

We are very proud to have learned a lot through the development of this app as it was a majority of our first time using React Native and Tailwind CSS and being able to set up a donor side and admin side of our app. We are also proud to have been able to address the NPO problem statement in the given time and work together as a team for the first time.

What we learned

Through this experience many of use gained new skills and confidence in our development abilities.

Setting up Supabase and working with query calls in React Native
Designing in Figma
Implementing login with different pages based on role of account
Using QR codes and implementing a camera to be usable in app

What's next for Project Ropa App

While we are proud of the current functionality of our app, there is always room for improvement. The main feature that must be addressed is the admins ability to update donations location in the process. We would like to allow admins to easily download QR codes as well as currently they can generate QR codes but no way to save the file efficiently. Furthermore, the UI can always be enhanced and modified to better represent the NPO and create fun features for donors that showcase their impact through their donations.