ShopHer

A web tool for consumers and female business owners combining a Chrome web extension and a web app to bring awareness and support to women-owned businesses.

Comment

Inspiration

Women are oftentimes underrepresented in many key fields, especially businesses. According to Forbes, one of the biggest challenges women face when starting their business is “limited access to funding” and an “inadequate support system.” Through our platform, we want to solve both of these problems by facilitating the purchase of women-owned products and building a collaborative environment where women can be encouraged and inspired by each other.

What it does

We built a website which allows female business owners to create an account, publicize their businesses, and include their story/inspiration behind how it started. Users can choose a particular predefined category that their business belongs to, which is immediately accessible on the website’s home page. Each category can be filtered and viewed from the list of women-owned businesses. The key part of our project is the Chrome extension, which is directly connected to our database by using our custom API. This extension is activated whenever the user browsing an Amazon product, and automatically suggests a list of women-owned businesses based on the product's category.

How we built it

We developed our own API to interface with the Firebase storage and used Axios to access the endpoints. For the web app we used Firebase functions and Firestore for the backend, React for the frontend, and Axios to connect the database with the website. For the Chrome Extension we used the Chrome-Browser API to integrate the extension into the browser as a popup, the Chrome-Tabs API to respond to activity on Amazon product pages, and Chrome-Storage API to update data between the background and popup scripts. We also used the Rainforest API to receive product data from Amazon so that we could identify the product’s category.

Challenges we ran into

  • Running out of free Rainforest API credits and having to resort to creating/using multiple accounts on different IP addresses
  • Being new to React and not understanding why a component just doesn’t show up!
  • Connecting the website to Firebase and debugging internal server errors

Accomplishments that we're proud of

  • Building a web app and successfully deploying it for the first time!
  • Building a Chrome extension for the first time
  • Creating our first project that integrates multiple tools into one hack
  • Developing a hack that supports and brings awareness to women-owned businesses which could empower women to build up their business.

What we learned

  • Not messing with React unless we know what we’re doing
  • Communicating between React Components and setting global values
  • Building a database schema from scratch
  • Deploying a web app with Google Cloud
  • Persistence

What's next for ShopHer

  • Expand the number of shopping websites that the Chrome extension is compatible with (such as Walmart, Target, etc.)
  • Provide more specific category matches to product recognition (for example, instead of just “Food & Grocery” specifically “Baked Goods”)

Built With

Share this project:

Updates