Inspiration

The inspiration for this project comes from volunteer work I did for another organization which required us to manually write tags for items (by hand on paper tags) and then attach to each item - hundreds of times. With the wide availability of technology, using QR codes to scan, classify, and organize donation items becomes a huge time saver and allows for searching over the inventory.

What it does

InventoQR scans a QR code and stores an item entry that can be given a name, description, category, and condition. The item can be looked up easily by scanning the QR code again. Items can be viewed and searched through a web application to see what's available.

Special note: The search functionality uses levenshtein distance, so mispelling like jackt will still find jacket entries or other similar results.

How I built it

The application is a Node + Express web server that uses Google Firestore as a backend database. The frontend is styled using Bulma and uses the qr-scanner package for the QR code reader. Additionally, ngrok is used to serve the localhost server as something publically available to work with mobile devices.

Challenges I ran into

The primary challenge was working around my lack of knowledge with web development, as this is actually the first major web development project I've done (only static HTML, CSS, and little JavaScript previously). Huge thanks to the mentors who were around to help, especially Evan Rupert and Jacob Bleser.

Accomplishments that I'm proud of

For me the largest accomplishment is having a well designed frontend, I mainly do a lot of backend library work and I was really happy with what I was able to put together using Bulma. Having the QR code reader extremely quickly is also really satisfying, though that's more of the library. Finally, I'm also proud of being able to connect the backend up to Google Firestore as well, which really helped for managing stored items and helping to integrate this into a phone PWA.

What I learned

Largely, web server systems with Node and the basics of routing with express, followed by a lot about HTML, JavaScript, and the DOM as there was no library used to handle the frontend (Bulma is CSS styling only).

What's next for InventoQR

The next step is ensuring the system can be hosted and connected to a mobile device which renders well on the device. After that, a lot of usability testing and tailoring the data stored to best benefit the organizers, such as date added/given and even a location for where it is currently stored.

Built With

Share this project:

Updates