We wanted to revamp the Free & For Sale page on Facebook and make it more intuitive. Facebook is not the best for selling, as users need to post their items in multiple groups. Furthermore, there is no easy search for items near your area, or filter items based on price range or category. We wanted to make buying and selling items as easy as possible. As of right now, Free & For Sale on Facebook is very cluttered and full of spam, with no indication of where people are selling, so our web application will tackle that problem by only displaying items that are being sold right now (according to sellers' availabilities).

What it does

It creates a live market on a map, parsing real-time data according to people's availabilities in selling their items. All the information of the items are displayed:

  • Name of item
  • Price
  • Category
  • Description of item
  • Contact information of seller (Facebook or phone number)

How we built it

We built it using HTML, CSS, and Javascript. We use the Google's UCLA Authentication to log users in. Though we all had our own respective tasks, we not only focus on them but branch out to help others with their tasks.

Challenges we ran into

  • Merge conflicts are hard to deal with
  • Also, most of the times, code that we think will work will not usually work.
  • The Cloudinary API did not have proper documentation for use in Javascript/jQuery

Accomplishments that we're proud of

  • We are proud of the filter system, which allows users to find an item quickly and view a dynamic map which shows the filtered results
  • We are also proud of implementing the search function which parses through the items that are for sale and helps users easily find relevant listings
  • Setting up the back end was no easy feat; syncing data across multiple devices became much easier once the back end was finished.
  • Furthermore, we only display markers during the times that the seller is actually available to meet with the buyer. This provides a cleaner and more relevant user interface without cluttering the screen.

What we learned

  • We learned to be patient, especially when faced with coding decisions to streamline the collaborative practice. Good coding practices save time in the long run.
  • Teamwork is key. We realized that communication led to a faster production of code and resulted in less merge conflicts

What's next for Markitplace

To be able to have more functionalities than its current state:

  • Instead of just items, maybe put services as well
  • Upload multiple images by using the Cloudinary API
  • More robust search capabilities
  • Have admins and moderators which will help maintain the page, approve sale posts
Share this project: