Our inspiration to build this project came from our experiences of shopping and going to in-person stores to find somthing unique and attractive from a younger age.
Giftify’s main purpose is to provide a store interface and have exciting gifts for your loved ones. This design style coupled with our community social media page provides users with an all-rounded shopping experience. Our online shop resembles an e-commerce website with the ability to add to a cart and subsequently obtain a checkout summary.
This project’s technical components can be broken down into the traditional e-commerce website and the react and database-centered social media platform. For the e-commerce website, we used HTML, CSS, and React.js in order to create both our clean and aesthetically pleasing interface that is at the same time powerful through our add-to-cart and serverless-technology-based backend. For the Social Media portion, we used React.js, Node.js, Tailwind.css, material UI and Google Firebase Databases. We use both traditional react classes for our most basic functions and also employ various react hooks, especially in the theme adaptions and the send buttons. Through our study of the firebase google documentation and debugging through firebase command line, we were able to successfully create this website. We implemented the add to cart functionality by using React Context API .By using firebase authentication we also have a log-in and sign-up feature in which user has to authenticate or authorize before purchasing. Moreover, our application has a payment processing functionality in which we used Stripe API's to transfer the money in our account .
By using all of these skills and programming languages in tandem, we created an automated and cohesive web application that we believe brings the fun back into shopping.
As we were new to the React world, implementing React context APIs was a big challenge for us.
In using Firebase APIs we were having some initial problems in configuring serverless technology as we were relatively new to it.
We surfed the internet -- approached different technical websites, learned new things, and were able to tackle the bugs.
As a group, we are extremely proud of the work that we’re submitting to this hackathon. We started out with just a rough idea and using our knowledge and skills we were able to create what we had foreseen in those initial planning stages. We’re particularly happy with the payment pathway system .
As a group, we furthered our overall knowledge of React, Node, and firebase. With many of us experimenting with this software as novices, through this project we’re now at a place we are comfortable with the ins and outs of react and all the different technology that we used. On the other hand, this project also humbled us into releasing how powerful even traditional react.js can be. Through our experiences, we have grown as programmers in all aspects.
Our Next steps for Giftify are to add more products to our page as well as to add characterisation for products. We’re envisioning our app with more items as well as possibly a form of machine learning that helps give a user personalized products based on their interests by search bar.