BruinMarket

Log in Page
Sell page
Home Page
Buy Page
Trade details page

Inspiration

Today, with online shopping and transportation, it is unprecedentedly convenient for people to purchase items they need. But at the same time, this convenience will also make many people purchase the things they don't actually need. Besides, many people will replace their daily used objects very frequently, such as smartphones, laptops, and headphones, which will waste many items that are still functional and useful. To reduce this unnecessary waste, we want to design a platform for UCLA students to sell and buy pre-owned items, enhance the lifespan of these items, put these useful items into the hands who need them, and also let students make some money.

What it does

For students who use this website for the first time, they need to provide their username, password, and phone number to sign up. And current users can log in with their username and password. After logging in, users will first see a home page, containing the information of ongoing and completed trade. Users can go to the "buy page", set the price interval, and search for the items they need. The search results will be shown on the right, and each search result contains information about the seller, the rating of the seller, a summary of the item, and price. Users can click on the seller's name, check the reviews written by other buyers to evaluate the seller's credibility. They can also click on the "Details" button to read the full description of the item and click on the "Buy" button when they decide to buy it. Users can also sell their used items on the "Sale" page, posting their summary and description along with the price tag. After selling or buying, users can see their trade information on the home page. To actually trade the item, the seller/buyer can click on the "Details" button on the ongoing trade, see the contact information, and discuss how they will send the pre-owned item and receive payment. We provide the buyer with a verification code, and after the transaction is finished, the seller needs to enter the verification code obtained from the buyer to confirm the trade. After that, the trade will be marked as finished, and the buyer and user can give ratings and write reviews for each other.

How we built it

We build this webpage using MERN Stack, including MongoDB, Express, Node.js, and React.js. React.js serves as the front end, with Express as middleware, Node.js as the server, and MongoDB as the database.

Challenges we ran into

The biggest challenge we ran into is the linkage between the Database, Server, and Front end, and we overcame them by reading tutorials and official documents and searching online forums such as StackExchange. And the second major problem we encountered is how to upload photos to the database. Unfortunately, we didn't resolve this problem until now.