home/you-music
2
0
Fork 0
mirror of https://github.com/wahyd4/you-music.git synced 2026-08-08 20:59:47 +10:00
Code Issues Packages Projects Releases Wiki Activity

Clean up

Browse Source
This commit is contained in:
junv
2025-11-03 10:54:29 +11:00
parent fc07c9e134
commit 9ab5a08646
5 changed files with 356 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
DOCKER_OPTIMIZATION.md
+2 -3
View File
@@ -453,7 +453,7 @@ docker build -t youmusic:slim -f Dockerfile.slim .
✅ All tests passed:
- Application starts correctly
- Migrations run successfully
- Migrations run successfully
- All API endpoints working
- Frontend loads properly
- Health checks passing
@@ -516,7 +516,7 @@ docker run -p 8000:8000 youmusic:latest
✅ All tests passed:
- Application starts correctly
- Migrations run successfully
- Migrations run successfully
- All API endpoints working
- Frontend loads properly
- Health checks passing
@@ -535,4 +535,3 @@ docker run -p 8000:8000 youmusic:latest
---
**✅ Production Ready** - The optimized Dockerfile provides excellent size reduction while maintaining full compatibility.
PROJECT_SUMMARY.md
+326
View File
@@ -0,0 +1,326 @@
# YouMusic - Project Summary
## 📋 Project Overview
YouMusic is a modern, full-stack web music player with download capabilities, inspired by xiaomusic and spotube. It's designed with a mobile-first approach using React + shadcn/ui for the frontend and Python FastAPI for the backend.
## ✅ Implemented Features
### 1. Core Music Player ✓
- Play/pause controls
- Skip forward/backward
- Volume control with mute
- Progress bar with seeking
- Display current track info
- Queue management
- Auto-play next track
### 2. Music Library Management ✓
- View all downloaded music
- Search local library by name/artist
- Sort and filter options
- Metadata display (title, artist, album, duration)
- File scanning functionality
- Upload music files
### 3. Online Music Search ✓
- Search YouTube for music
- Search Bilibili for music
- Combined search across platforms
- Display thumbnails and metadata
- Filter by source (YouTube/Bilibili)
### 4. Download Functionality ✓
- Download from YouTube URLs
- Download from Bilibili URLs
- Download single tracks
- Download entire playlists
- Background download processing
- Automatic metadata extraction
- Progress tracking support
### 5. Playlist Management ✓
- Create custom playlists
- Add songs to playlists
- Remove songs from playlists
- Delete playlists
- Update playlist info
- Play entire playlists
- View playlist details
### 6. Music Sharing ✓
- Share via URL parameters (?music=id)
- Direct link to specific songs
- Auto-play shared music
### 7. Mobile-First UI ✓
- Responsive design
- Touch-friendly controls
- Mobile navigation
- Adaptive layouts
- Bottom player bar (mobile-friendly)
### 8. Additional Features ✓
- Search by artist (shows all tracks)
- Dark mode support (via shadcn/ui)
- Toast notifications
- Loading states
- Error handling
- API documentation (FastAPI Swagger)
## 🏗️ Architecture
### Backend Stack
```
FastAPI (Python)
├── SQLAlchemy (ORM)
├── aiosqlite (Database)
├── yt-dlp (Downloader)
├── mutagen (Metadata)
├── aiohttp (HTTP client)
└── Pydantic (Validation)
```
### Frontend Stack
```
React 18 + TypeScript
├── Vite (Build tool)
├── TanStack Query (Data fetching)
├── React Router (Navigation)
├── shadcn/ui (Components)
├── Tailwind CSS (Styling)
└── Axios (API client)
```
## 📁 Project Structure
```
you-music/
├── backend/
│ ├── app/
│ │ ├── api/ # API endpoints
│ │ ├── core/ # Configuration
│ │ ├── db/ # Database
│ │ ├── models/ # SQLAlchemy models
│ │ ├── schemas/ # Pydantic schemas
│ │ └── services/ # Business logic
│ ├── main.py # FastAPI app
│ └── pyproject.toml # Python deps (uv)
├── frontend/
│ ├── src/
│ │ ├── components/ # React components
│ │ ├── api/ # API client
│ │ ├── hooks/ # Custom hooks
│ │ ├── lib/ # Utils
│ │ └── types/ # TypeScript types
│ └── package.json # Node deps
├── data/ # Runtime data
├── Dockerfile # Container image
├── docker-compose.yml # Docker setup
└── README.md # Documentation
```
## 🔌 API Endpoints
### Music
- `GET /api/music/` - List all music
- `GET /api/music/search` - Search music
- `GET /api/music/{id}` - Get music details
- `PUT /api/music/{id}` - Update metadata
- `DELETE /api/music/{id}` - Delete music
- `POST /api/music/upload` - Upload file
- `POST /api/music/scan` - Scan directory
### Playlists
- `GET /api/playlists/` - List playlists
- `POST /api/playlists/` - Create playlist
- `GET /api/playlists/{id}` - Get playlist
- `PUT /api/playlists/{id}` - Update playlist
- `DELETE /api/playlists/{id}` - Delete playlist
- `POST /api/playlists/{id}/music/{music_id}` - Add song
- `DELETE /api/playlists/{id}/music/{music_id}` - Remove song
### Download
- `POST /api/download/music` - Download track
- `POST /api/download/playlist` - Download playlist
- `GET /api/download/status` - Download status
### Search
- `GET /api/search/` - Search all sources
- `GET /api/search/youtube` - Search YouTube
- `GET /api/search/bilibili` - Search Bilibili
## 🚀 Deployment
### Using Docker
```bash
docker-compose up -d
```
### Manual Deployment
```bash
# Backend
cd backend
uv venv --python 3.13
source .venv/bin/activate
uv sync
uvicorn main:app --host 0.0.0.0 --port 8000
# Frontend
cd frontend
npm install
npm run build
```
## 🎨 UI Components (shadcn/ui)
Implemented components:
- Button
- Input
- Slider
- Card (via Tailwind)
- Toast notifications (sonner)
- Navigation
- Player controls
## 📊 Database Schema
### Music Table
- id, title, artist, album
- duration, file_path, file_size
- source_url, source_type
- thumbnail, lyrics
- created_at, updated_at
### Playlist Table
- id, name, description
- thumbnail
- created_at, updated_at
### playlist_music (Many-to-Many)
- playlist_id, music_id
- position, added_at
## 🔐 Security Features
- Input validation (Pydantic)
- SQL injection protection (SQLAlchemy)
- XSS protection (React)
- CORS configuration
- Safe file path handling
- URL validation
## 🎯 xiaomusic Integration
Adapted from xiaomusic:
1. **Download Logic** - Using yt-dlp similar to xiaomusic
2. **Metadata Extraction** - Using mutagen library
3. **File Organization** - Directory structure handling
4. **Playlist Processing** - Batch download support
5. **FFmpeg Integration** - Audio processing
## 🌟 Unique Features
Improvements over xiaomusic:
1. Modern React UI
2. Real-time search
3. Better mobile support
4. RESTful API
5. Database-backed library
6. Shareable links
7. Progressive Web App ready
## 📱 Mobile Optimizations
- Touch-friendly buttons (min 44px)
- Responsive grid layouts
- Mobile navigation
- Bottom player bar
- Swipe gestures support
- Viewport optimized
## 🔄 State Management
- TanStack Query for server state
- React useState for local state
- Audio ref for player state
- URL params for deep linking
## 🧪 Testing Ready
Structure supports:
- Backend: pytest
- Frontend: Vitest/Jest
- E2E: Playwright/Cypress
- API: FastAPI TestClient
## 📈 Performance
- Lazy loading
- Code splitting (Vite)
- Image optimization
- Database indexing
- Async operations
- Caching (TanStack Query)
## 🔮 Future Enhancements
Possible additions:
- [ ] User authentication
- [ ] Multi-user support
- [ ] Audio visualization
- [ ] Lyrics display
- [ ] Equalizer
- [ ] Podcast support
- [ ] Import from Spotify
- [ ] PWA offline mode
- [ ] WebSocket for real-time updates
- [ ] Recommendation engine
## 📦 Dependencies
### Key Backend Packages
- fastapi==0.115.0
- uvicorn==0.30.6
- sqlalchemy==2.0.35
- yt-dlp==2024.10.7
- mutagen==1.47.0
- aiofiles==24.1.0
### Key Frontend Packages
- react==18.3.1
- @tanstack/react-query==5.56.2
- react-router-dom==6.26.2
- tailwindcss==3.4.11
- lucide-react==0.441.0
## 🎓 Learning Resources
The project demonstrates:
- FastAPI async patterns
- React hooks usage
- TypeScript best practices
- Database modeling
- API design
- Docker containerization
- Component architecture
- State management
## 📄 License
MIT License - Free to use and modify
## 🙏 Acknowledgments
- xiaomusic - Download logic inspiration
- spotube - UI/UX inspiration
- shadcn/ui - Component library
- yt-dlp - Download engine
- FastAPI - Backend framework
- React - Frontend library
---
**Status**: ✅ Complete and Ready for Use
**Version**: 1.0.0
**Last Updated**: 2024-10-30
STRUCTURE.md
+6 -6
View File
@@ -125,13 +125,13 @@ you-music/
- **session.py**: SQLAlchemy async engine and session management
#### Models (`backend/app/models/`)
- **models.py**:
- **models.py**:
- Music model (tracks, metadata)
- Playlist model (user playlists)
- Many-to-many relationship table
#### Schemas (`backend/app/schemas/`)
- **schemas.py**:
- **schemas.py**:
- Pydantic models for request/response
- Validation schemas
- Type hints for API
@@ -143,11 +143,11 @@ you-music/
- **search.py**: Search external sources
#### Services (`backend/app/services/`)
- **downloader.py**:
- **downloader.py**:
- yt-dlp integration
- Download logic from xiaomusic
- Metadata extraction
- **search.py**:
- **search.py**:
- YouTube search
- Bilibili search
- Result parsing
@@ -180,7 +180,7 @@ you-music/
- **PlaylistsPage.tsx**: Playlist management UI
#### API Client (`frontend/src/api/`)
- **client.ts**:
- **client.ts**:
- Axios instance
- API function definitions
- Type-safe endpoints
@@ -256,7 +256,7 @@ All frontend-backend communication uses REST APIs:
# Backend
cd backend && uvicorn main:app --reload
# Frontend
# Frontend
cd frontend && npm run dev
```
dev-stack.sh
+6 -6
View File
@@ -181,7 +181,7 @@ else
echo ""
echo -e "${BLUE}Press Ctrl+C to stop all services${NC}"
echo ""
# Cleanup function
cleanup() {
echo ""
@@ -191,29 +191,29 @@ else
echo -e "${GREEN}✅ All services stopped${NC}"
exit 0
}
trap cleanup SIGINT SIGTERM
# Start backend in background with output to console
cd backend
source .venv/bin/activate
uv run uvicorn main:app --reload --host 0.0.0.0 --port 8000 2>&1 | sed 's/^/backend | /' &
BACKEND_PID=$!
cd ..
# Start frontend in background with output to console
cd frontend
npm run dev 2>&1 | sed 's/^/frontend | /' &
FRONTEND_PID=$!
cd ..
echo -e "${GREEN}✅ Services started${NC}"
echo ""
echo "Frontend: http://localhost:3000"
echo "Backend: http://localhost:8000"
echo "API Docs: http://localhost:8000/docs"
echo ""
# Wait for both processes
wait
fi
setup.sh
+16 -16
View File
@@ -10,13 +10,13 @@ echo "================="
# Check if Docker is installed
if command -v docker &> /dev/null; then
echo "✅ Docker found"
echo "🐳 Building Docker image..."
docker-compose build
echo "🚀 Starting YouMusic..."
docker-compose up -d
echo ""
echo "✨ YouMusic is running!"
echo "📱 Frontend: http://localhost:8000"
@@ -24,22 +24,22 @@ if command -v docker &> /dev/null; then
echo ""
echo "To stop: docker-compose down"
echo "To view logs: docker-compose logs -f"
else
echo "⚠️ Docker not found. Installing manually..."
# Check Python
if ! command -v python3 &> /dev/null; then
echo "❌ Python 3 is required but not installed"
exit 1
fi
# Check Node.js
if ! command -v node &> /dev/null; then
echo "❌ Node.js is required but not installed"
exit 1
fi
# Check FFmpeg
if ! command -v ffmpeg &> /dev/null; then
echo "⚠️ FFmpeg not found. Please install it:"
@@ -47,39 +47,39 @@ else
echo " macOS: brew install ffmpeg"
exit 1
fi
echo "✅ All dependencies found"
# Backend setup
echo "🔧 Setting up backend..."
cd backend
# Check if uv is installed
if ! command -v uv &> /dev/null; then
echo "Installing uv..."
curl -LsSf https://astral.sh/uv/install.sh | sh
export PATH="$HOME/.cargo/bin:$PATH"
fi
if [ ! -d ".venv" ]; then
uv venv --python 3.13
fi
uv sync
# Create data directories
mkdir -p ../data/music ../data/uploads ../data/temp
# Frontend setup
echo "🎨 Setting up frontend..."
cd ../frontend
npm install
npm run build
# Copy frontend build to backend static
mkdir -p ../backend/static
cp -r dist/* ../backend/static/
echo ""
echo "✨ Setup complete!"
echo ""