A music streaming and DJ platform built with React, Node.js, and Prisma.

• 🎵 Music streaming with separate music and podcast sections
• 🎧 DJ Mode with dual deck mixing
• 👤 User authentication (Artist, DJ, Listener roles)
• 📤 Track upload with metadata
• 🎨 Real-time waveform visualization
• 🎛️ BPM detection and key matching
• 📊 Analytics and streaming stats

• React with TypeScript
• Vite
• Tailwind CSS
• Lucide React Icons

• Node.js with Express
• Prisma ORM
• SQLite database
• JWT authentication
• Multer for file uploads

• Nx for workspace management

• Node.js 18+
• npm or yarn

1. Clone the repository

git clone https://github.com/shittuay/mixflow.git
cd mixflow

2. Install dependencies

npm install

3. Set up backend environment variables

cd mixflow/backend
cp .env.example .env
# Edit .env with your configuration

4. Initialize the database

cd mixflow/backend
npx prisma migrate dev
npx prisma generate

5. Start the development servers

Backend:

npm run dev:backend
# or
cd mixflow && npx nx run backend:serve

Frontend:

npm run dev:frontend
# or
cd mixflow && npx nx run web-app:serve

The frontend will be available at http://localhost:4200 The backend API will be available at http://localhost:3334

The backend is configured to deploy to Render using the render.yaml file.

1. Create a new Web Service on Render
2. Connect your GitHub repository
3. Render will auto-detect the configuration
4. Set environment variables in the Render dashboard

The frontend is configured to deploy to Netlify using the netlify.toml file.

1. Create a new site on Netlify
2. Connect your GitHub repository
3. Netlify will auto-detect the configuration
4. Set the VITE_API_URL environment variable to your backend URL

mixflow/
├── mixflow/
│   ├── backend/          # Express.js API
│   │   ├── src/
│   │   │   ├── config/   # Configuration files
│   │   │   ├── controllers/ # Route controllers
│   │   │   ├── middleware/  # Express middleware
│   │   │   ├── routes/   # API routes
│   │   │   └── services/ # Business logic
│   │   └── prisma/       # Database schema
│   ├── web-app/          # React frontend
│   │   └── src/
│   │       ├── app/      # Main application
│   │       ├── components/ # React components
│   │       └── config/   # Frontend configuration
│   └── shared/           # Shared utilities
├── netlify.toml          # Netlify deployment config
└── render.yaml           # Render deployment config

MIT

Contributions are welcome! Please open an issue or submit a pull request.