Files

T

root a89c7894cf Initial commit: AudiOhm - Alternative Spotify avec streaming YouTube

Backend:
- FastAPI avec PostgreSQL et Redis
- Authentification JWT complète
- API REST pour musique, playlists, recherche
- Streaming audio via yt-dlp
- SQLAlchemy 2.0 async

Frontend:
- Flutter avec thème néon cyberpunk
- State management Riverpod
- Layout adaptatif desktop/mobile
- Lecteur audio avec mini-player

Infrastructure:
- Docker Compose (PostgreSQL + Redis)
- Scripts d'installation automatisés
- Scripts de build pour exécutables

Fichiers ajoutés:
- BUILD_CLIENT_*.bat/sh: Scripts de compilation
- BUILD_CLIENT_README.md: Documentation compilation
- CHECK_FLUTTER.sh: Vérificateur d'environnement
- requirements.txt mis à jour pour Python 3.13
- Modèles SQLAlchemy corrigés (metadata -> extra_metadata)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

2026-01-18 20:08:36 +00:00

4.9 KiB

Raw Blame History

Spotify Le 2 - Frontend Flutter

Application Flutter cross-platform (Desktop + Android) avec thème néon cyberpunk.

Stack Technique

Flutter 3.2+ (Dart 3.2+)
Riverpod 2.4+ - State management
Dio 5.4+ - HTTP client
just_audio 0.9+ - Audio playback
drift 2.14+ - Local database
cached_network_image 3.3+ - Image caching

Structure du Projet

lib/
├── main.dart                    # Entry point
├── core/                        # Configuration partagée
│   ├── constants/
│   │   └── api_constants.dart
│   └── theme/
│       ├── colors.dart          # Palette néon cyberpunk
│       ├── text_styles.dart     # Typographie
│       └── app_theme.dart       # Thème Material
├── domain/                      # Business logic
│   └── entities/
│       ├── user.dart
│       ├── track.dart
│       └── playlist.dart
├── infrastructure/              # External dependencies
│   └── datasources/
│       ├── local/              # Database locale
│       └── remote/             # API client
├── presentation/               # UI layer
│   ├── providers/
│   │   └── navigation_provider.dart
│   ├── adaptive/
│   │   └── adaptive_layout.dart # Desktop vs Mobile
│   ├── pages/
│   │   ├── desktop/
│   │   │   └── home_page.dart
│   │   └── mobile/
│   │       └── mobile_home_page.dart
│   └── widgets/
│       ├── common/
│       │   └── mini_player.dart
│       └── desktop/
│           ├── desktop_sidebar.dart
│           └── desktop_top_bar.dart
└── l10n/                        # Internationalization

Installation

Prérequis

Flutter 3.2+
Dart 3.2+
Android Studio / VS Code
Android SDK (pour Android)

1. Cloner le projet

cd Spotify_le_2/frontend

2. Installer les dépendances

flutter pub get

3. Générer le code (Riverpod generators)

dart run build_runner build --delete-conflicting-outputs

4. Lancer l'app

# Desktop
flutter run -d windows

# Android
flutter run -d android

# Linux
flutter run -d linux

Thème Néon Cyberpunk

Palette de Couleurs

// Backgrounds
primary: #0A0E27       // Bleu nuit très foncé
surface: #1A1F3A       // Bleu nuit
surfaceVariant: #252B4A

// Accent néon
cyan: #00F0FF          // Cyan électrique
violet: #BF00FF        // Violet néon
rose: #FF006E          // Rose néon
vert: #39FF14          // Vert néon

Utilisation du Thème

// Import
import 'package:spotify_le_2/core/theme/colors.dart';

// Utiliser les couleurs
Container(
  color: AppColors.surface,
  child: Text(
    'Hello',
    style: TextStyle(color: AppColors.cyan),
  ),
)

// Gradients
Container(
  decoration: BoxDecoration(
    gradient: AppColors.primaryGradient,
  ),
)

// Effets glow
Container(
  decoration: BoxDecoration(
    boxShadow: AppColors.cyanGlow,
  ),
)

Layout Adaptatif

L'application utilise deux layouts distincts selon la largeur de l'écran :

Desktop (≥ 800px) :

Sidebar navigation à gauche (240px)
Top bar avec recherche
Contenu principal scrollable
Mini player persistant en bas

Mobile (< 800px) :

Top bar
Contenu principal
Mini player sticky
Bottom navigation bar (4 onglets)

// Naviguer vers une page
ref.read(navigationProvider.notifier).navigateTo('search');

// Watcher la page courante
final currentPage = ref.watch(currentPageProvider);

Développement

Formatter

flutter format .

Linter

flutter analyze

Tests

# Tous les tests
flutter test

# Tests avec coverage
flutter test --coverage

Build

# Windows
flutter build windows

# Android APK
flutter build apk

# Android App Bundle
flutter build appbundle

# Linux
flutter build linux

Performance

Optimisations implémentées

Streaming 60fps - StreamSubscription pour progress bar
Infinite scroll - ListView.builder avec préchargement
Image caching - cached_network_image avec cache infini
Animations optimisées - 200ms avec easeOutCubic

Profiling

# DevTools
flutter pub global activate devtools
flutter pub global run devtools

# Puis lancer l'app avec profiling
flutter run --profile

Configuration API

Modifier lib/core/constants/api_constants.dart :

class ApiConstants {
  static const String baseUrl = 'http://localhost:8000/api/v1';
  static const String wsUrl = 'ws://localhost:8000';
  static const Duration connectionTimeout = Duration(seconds: 30);
}

Ressources

License

MIT

4.9 KiB Raw Blame History