Description as a Tweet:

This pandemic is stressful enough without holiday shopping! giftn is an all-in-one application allowing users to easily track their gift lists, budgeting, and package deliveries. We want to make planning for COVID-Holidays feel like a breeze.

Inspiration:

This pandemic is stressful enough without holiday shopping! From buying products entirely online, to ensuring a fully remote delivery, there are a lot of added stressors this holiday season. We wanted to make planning for COVID-Holidays as simple as possible so you can focus instead on the people in your life that make you happy—not the stress.

What it does:

giftn is an all-in-one application allowing users to easily track their gift lists, budgeting, and package deliveries. First, enter in your budget. Then input the people you're thinking about this holiday season. From there, add gifts to your wishlist for each person, either manually, or using our partnering Chrome extension. The extension is built to make it easy to find gifts for those you love. Log in to Google. Surf Amazon, and then find a cool gift for that one special friend. If there's one that you would think you want to buy, you can add that gift to your wishlist for that friend. Later, if you choose to buy that gift, you can manage your bought gifts and balance your budget in your gift hub on the giftn web app. Shopping made easy! Once you do buy all those gifts, keep your tracking numbers stored in our tracking number hub. With COVID, gift giving might look a little different—-you may be sending gifts straight to your friends or loved one's houses. With this in mind, you can send an auto-generated email sending your friend or loved one some holiday cheer (along with the tracking number of the package and a personalized message, of course). It is is super easy to get started with giftn!

How we built it:

The web app is built in React and Chrome extension is built with—they both use Google authentication and connect to giftn's API where they engages with our Google Cloud Firestore database. Our add-on Chrome extension also uses the Rainforest API to get corresponding Amazon data on particular products. Finally, we built our own API using Node.js and Express to handle CRUD operations to and from Google Cloud's Cloud Firestore database, as well as make API calls to external companies to get tracking number related information through the UPS Tracking API and send auto-generated emails with a personal twist using MailGrid.

Technologies we used:

  • HTML/CSS
  • Javascript
  • Node.js
  • Express
  • React

Challenges we ran into:

Firstly, we were challenged with coming up with an idea that we were passion about—something with the right amount fun and rigor but also of impact. Once we did have our concept, technical-wise, we struggled styling our preferred method of front-end structure (tables). Since we could not implement them in the manner we desired, we solved our problem by refactoring our code and not using tables at all. Furthermore, at first we were challenged with the passing of data, not only between applications in getting our platforms setup with our API, but more specifically between popup and background scripts in the Chrome extension.

Accomplishments we're proud of:

We are really proud of our finished product! Our designs were ambitious, and we were able to effectively flow data between different applications in order to create a cohesive, multi-platform, full-stack product.

What we've learned:

We all learned a lot about the flow of data—most notably from chrome extension to Firestore to web app. However we also learned a lot more about the nitty gritty details about Chrome extensions, in particular the passing of data between popup and background scripts. On the front end, we learned how to use tables—lots about tables.

What's next:

The next hardest thing about gift giving is coming up with what to buy. Next up, we want to jump into the realm of analytics and recommendations and tackle this problem. Our future goal is to incorporate a machine learning algorithm that given input from a user about their friend interest and personality outputs recommendations for gifts to buy them.

We also plan to build out the remaining designs on the Figma, particularly the designs meant for our auto-generated emails. From there we would add more functionality to the email, enabling recipients of the email to get more information about giftn, as a way to inform them of our services and expand our clientele.

Built with:

The web app is built in React and Chrome extension is built with—they both use Google authentication and connect to giftn's API where they engages with our Google Cloud Firestore database. Our add-on Chrome extension also uses the Rainforest API to get corresponding Amazon data on particular products. Finally, we built our own API using Node.js and Express to handle CRUD operations to and from Google Cloud's Cloud Firestore database, as well as make API calls to external companies to get tracking number related information through the UPS Tracking API and send auto-generated emails with a personal twist using MailGrid.

Prizes we're going for:

  • Best Finance Hack
  • Best Documentation
  • Best Web Hack
  • Best Use of Google Cloud

Prizes Won

Best Finance Hack

Team Members

Wylie Kasai
Sathvika Korandla
Catherine Parnell
Jordan Sanz

Table Number

Table TBD