BeatStore
Beat selling platform inspired by Beatstars.com. Frontend in React + Tailwind, backend in Django DRF. Goal: a basic space for beatmakers to showcase and sell, and for artists to find and purchase. Integrated PayPal for secure transactions. Work-in-progress.
Install / Use
/learn @n-hadi/BeatStoreREADME
BeatStore Project
This is a full-stack project for selling beats and licenses using a Django backend and a React frontend. Below are the steps to set up and run the project, along with a detailed explanation of its functionality.
Getting Started
Backend Setup
-
Run the Django Project:
- Navigate to the
backend/api/folder. - Run the following command to start the backend:
This will start the backend onpython manage.py runserverhttp://127.0.0.1:8000.
- Navigate to the
-
Create a Superuser:
- Run the following command to create an admin account:
python manage.py createsuperuser - Follow the prompts to set up the superuser credentials.
- Run the following command to create an admin account:
-
Admin Panel:
- Access the Django admin panel by navigating to
http://127.0.0.1:8000/admin/. - Log in using the superuser credentials.
- Access the Django admin panel by navigating to
-
Input Beats:
- In the
Coreapp within the admin panel, you can add beats to your database.- Tags: Input tags as a comma-separated list. For example,
trap, dark. Tags will appear on the beat's title on the frontend in the following format:
Dark x Trap Type Beat - *Beat Title* - Spotlight: The
Spotlightboolean determines if a beat is showcased prominently on the main page. If no beat is marked as a spotlight, the app will default to showcasing the most recently added beat. - Licenses: Only use the licenses
Basic,Premium, andUnlimited. The frontend is not configured for other license types. - For Sale: Turning off the
For Saleboolean will exclude the beat from being sold on the platform without deleting it from the database (preventing potential issues).
- Tags: Input tags as a comma-separated list. For example,
- In the
Frontend Setup
- Start the Frontend:
- Navigate to the
frontend/folder. - Run the following command to start the React app:
The app should automatically open in your browser, typically running onnpm starthttp://localhost:3000/.
- Navigate to the
Features
-
Admin Panel Management:
- Add beats with WAV/MP3 files, artwork, and tags.
- Showcase beats on the main page using the
Spotlightboolean. - Manage availability of beats using the
For Saleboolean.
-
Frontend Display:
- Beats are displayed dynamically with tags and titles.
- The title format is based on the tags (e.g.,
Dark x Trap Type Beat - Beat Title).
-
License Support:
- The app supports three licenses:
Basic,Premium, andUnlimited. Use only these licenses as the frontend is not set up for additional ones.
- The app supports three licenses:
Notes
- Ensure that the Django backend is running on port
8000before starting the frontend.
