About The Project

This project, Backpack Bazaar, is an extension of a group project I worked on previously -> https://github.com/bennettbDEV/CollegeMarketplace. The goal of this project is to:

• Refactor the backend to use Django's ORM, which will be faster and more reliable
• Add more customization options
• Implement automatic listing classification using AI/ML
• Develop an algorithm/method to provide suggested/recommended listings to users

With the abundance of irrelevant and distant listings on classified advertising platforms such as Facebook Marketplace and Craigslist, our team decided to develop an open-source marketplace platform tailored to students. To achieve this goal and learn as much as possible about critical tools in the software industry, we chose to develop the platform using Django Rest Framework (Python) for the backend API, and React + Vite (JavaScript/JSX) for the frontend.

Features

Our project includes all the vital features of an online marketplace, and more! Some of our notable features & details are below:

• Secure authentication using JSON Web Tokens (JWT)
• Comprehensive account management: creation, retrieval, updates, and deletion
• Listing management with filtering, searching, sorting, and saving for later access
• Messaging capabilities: sending, retrieving, and deleting messages
• User interaction features: liking/disliking listings and blocking/unblocking other users

Expanded Features

Backpack Bazaar is not only more efficient, but is also more feature rich than the original College Marketplace! Some notable new features include:

• Automatic tag generation when creating or updating listings (using a One-vs-rest SVC)
• Reworked messages on the backend, allowing for specific conversations for each listing
• Frontend Changes
  • Implemented Dark mode
  • Improved accessibility features & styling
  • Fixed various bugs
  • Completely rehauled the messaging page

Details

• Each endpoint was designed with robust error handling, with specific and detailed responses for various different issues
• Critical use cases were thoroughly tested with comprehensive unit tests and integration tests to ensure both reliability and security

Image Showcase

Here are some additional screenshots showing different pages from our frontend:

Roadmap

• Add dark mode
• Refactor front-end to use rems instead of px
• Refactor authentication using Django's built in tools
• Alter User/UserProfile to use Django's ORM
• Test User/UserProfile
• Alter Listing to use Django's ORM
• Test Listing
• Alter Messages to use Django's ORM
• Test Messages
• New message frontend
• Add tests for every feature
• Frontend Integration
• Test Frontend more thoroughly
• Add automatic listing classification
• Develop algorithm to suggest listings

Try it out!

To install the dependencies and run the project as it is now, follow these simple steps in your terminal:

0. Prerequisites: Install Node.js(version 20 or newer) and Python(version 3.10 or newer)
1. Clone the repo (into the currect directory)

git clone https://github.com/bennettbDEV/BackpackBazaar.git .

2. (Optionally) Set up a virtual environment

python -m venv venv

2a. Activate the virtual environment - for Windows:

.\venv\Scripts\activate

2b. Activate the virtual environment - for Linux/Mac:

source venv/bin/activate

3. Move to the backend directory

cd backend

4. Install necessary packages

python -m pip install -r requirements.txt

5. Navigate back to the base directory

cd ..

6. Go to the frontend directory

cd frontend

7. Install necessary packages

npm install

8. Create an env file (Links our development servers together)

echo VITE_API_URL="http://localhost:8000/" > .env

Run the servers
9. Start the frontend

npm run dev

10. After splitting or creating a new terminal, navigate to BackpackBazaar/backend

cd ..
cd backend

11. Start the backend

python manage.py runserver

12. Done! Open a browser and enter "http://localhost:5173/" into the search bar to interact with the Marketplace