Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mh-anwar/quibble
🏆 Winner at Recess Hacks. Global digital marketplace platform, created with React.js and Node.js
https://github.com/mh-anwar/quibble
express hackathon javascript nodejs react
Last synced: 6 days ago
JSON representation
🏆 Winner at Recess Hacks. Global digital marketplace platform, created with React.js and Node.js
- Host: GitHub
- URL: https://github.com/mh-anwar/quibble
- Owner: mh-anwar
- License: agpl-3.0
- Created: 2022-07-15T15:41:18.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-05-28T08:23:51.000Z (7 months ago)
- Last Synced: 2024-05-28T20:57:06.194Z (7 months ago)
- Topics: express, hackathon, javascript, nodejs, react
- Language: JavaScript
- Homepage: https://quibble.mohammadanwar.dev/
- Size: 27.5 MB
- Stars: 6
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 2022 Recess Hacks Submission by [mh-anwar](https://github.com/mh-anwar) and [r-chong](https://github.com/r-chong)
## [Quibble Marketplace](https://quibble.mohammadanwar.dev/)
- [2022 Recess Hacks Submission by mh-anwar and r-chong](#2022-recess-hacks-submission-by-mh-anwar-and-r-chong)
- [Quibble Marketplace](#quibble-marketplace)
- [Heroku to Deta Port](#heroku-to-deta-port)
- [Inspiration](#inspiration)
- [What it does](#what-it-does)
- [Full-Stack App Technical Details](#full-stack-app-technical-details)
- [How We Built It](#how-we-built-it)
- [Challenges We Ran Into / What We Learned](#challenges-we-ran-into--what-we-learned)
- [What's Next for Quibble](#whats-next-for-quibble)
- [How to Launch Quibble](#how-to-launch-quibble)
- [Pre-requisites](#pre-requisites)
## Heroku to Deta Port
After Heroku changed it's pricing plan, this project was ported to Deta in order to keep the proof of concept alive.
## Inspiration
As long-time online buyers, @mh-anwar and @r-chong have tried every consumer-to-consumer platform in Canada. One thing that they constantly noted was the lack of a way to contact sellers to trade, which led them to create Quibble, the trading app.
## What it does
Quibble is a platform that connects online buyers to online sellers. Buyers can range from people who enjoy the art of haggling, to money-conscious individuals. Sellers who are adept in negotiation are now able to use this skill in their e-commerce businesses. One thing that we made sure to work on was the fact that, sometimes sellers don't know how much something in their garage is worth. This is where Quibble comes in: to allow the buyer and seller to reach a mutual deal.
# Full-Stack App Technical Details
## How We Built It
We built Quibble using React.js and Material UI for the frontend and Node.js as well as Express.js for the backend. Of course this meant that we also used vanilla JavaScript, HTML, and CSS. We did not use a SQL/non-SQL database (such as MongoDB, etc) as this was just a concept design.
## Challenges We Ran Into / What We Learned
The most important thing that we learned was to work on the backend first and frontend second. This allows for the frontend to be built based on the API and not the other way around (which causes issues). One challenge we ran into was the ambitious integration of a chat API (ie. Google Chat, Messenger) to allow live contact between buyers and sellers, unfortunately we were unable to integrate it in time and instead implemented a "Contact Quibber" feature. As aspiring beginners, it was quite a humbling experience that reminded us that we still have a long way to go in our programming journey. Lastly, we were only able to get a partially working Heroku deployment up and running in for the competition, due to both our lack experience with Heroku and lack of time and so one of our next steps would be to deploy fully.
## What's Next for Quibble
The next step for Quibble would be to scale. In order to support hundreds, thousands if not millions of users, the project will need to use a database such as MongoDB. Furthermore, we would need to iron out various bugs and to do a more in-depth dive into APIs in order to improve the negotiation experience between buyer and seller. We would implement a fully functional chat, secure login and encrypted database in order to make Quibble scale.
---
# How to Launch Quibble
### Pre-requisites
- Node.js version 16+
- NPM version 8+ (comes with node.js)
In order to test locally:
```
git clone https://github.com/mh-anwar/quibble.git
```
or with SSH
```
git clone [email protected]:mh-anwar/quibble.git
```
To launch the frontend:
```
cd ./app
npm install
npm run start
```
If you want to modify the backend you will have to set up a Deta Space.