binome/MIGRATION_BACKUP.md

Sauvegarde de l'état avant migration - Application Binôme

Date de sauvegarde

20 juillet 2025 - 22:40 UTC

État actuel du projet

Configuration générale

• Nom du projet: bons-programmeurs (Binôme)
• Version: 0.1.0
• Branche de sauvegarde: migration-vue3

Stack technique actuelle

Framework principal

• Vue.js: 2.6.12
• Vue CLI: ~4.5.11
• Vue Router: 3.5.1
• Vuex: 3.6.2

TypeScript et outils de développement

• TypeScript: ~3.9.3
• ESLint: ^6.7.2
• Prettier: ^1.19.1
• Node Sass: ^4.12.0
• Sass Loader: ^8.0.2

Composition API et extensions

• @vue/composition-api: ^1.0.0-beta.1 (plugin pour Vue 2)
• vuex-composition-helpers: ^1.0.18
• vuex-persist: ^2.2.0

Internationalisation

• vue-i18n: ^8.23.0
• @intlify/vue-i18n-loader: ^1.0.0
• vue-cli-plugin-i18n: ~1.0.1

PWA et Service Worker

• @vue/cli-plugin-pwa: ~4.5.11
• register-service-worker: ^1.7.1

Autres dépendances

• plyr: ^3.6.2 (lecteur multimédia)
• retrobus: ^1.6.1
• core-js: ^3.6.5

Scripts disponibles

{
  "serve": "vue-cli-service serve",
  "build": "vue-cli-service build",
  "lint": "vue-cli-service lint",
  "i18n:report": "vue-cli-service i18n:report --src './src/**/*.?(js|vue)' --locales './src/locales/**/*.json'"
}

Configuration PWA actuelle

• Nom: Binôme
• Couleur de thème: #f8efba
• Mode d'affichage: standalone
• Workbox: skipWaiting et clientsClaim activés
• Raccourcis: Start a session (/play)

Structure des fichiers

src/
├── App.vue
├── main.ts
├── i18n.ts
├── registerServiceWorker.ts
├── assets/ (icônes SVG)
├── components/ (ChilledMusic, DevSession, IntervalInput, SpotifyMusic, SWNewVersion, ZoneMusic)
├── hooks/ (useInterval, useMusic, useSpotify, useTimer, useWakeLock)
├── lib/ (spotify-player.js - À CONSERVER)
├── locales/ (en.json, fr.json)
├── router/ (index.ts)
├── store/ (index.ts)
├── styles/ (app.scss, plume.scss, variables.scss)
├── types/ (StopwatchState.ts)
├── utils/ (notification.ts, spotify.ts)
└── views/ (Home.vue, Privacy.vue, SpotifyCallback.vue)

Fichiers de configuration

• vue.config.js: Configuration PWA complète avec icônes et raccourcis
• tsconfig.json: Configuration TypeScript avec paths aliases
• .eslintrc.js: Configuration ESLint avec Vue 2 et TypeScript
• babel.config.js: Configuration Babel standard Vue CLI
• .prettierrc: Configuration Prettier
• netlify.toml: Configuration de déploiement Netlify

Gestionnaire de paquets actuel

• Yarn: yarn.lock présent
• Node version: Fichier .node-version présent

Plan de migration vers stack moderne

Objectifs de la migration

1. Node.js: Upgrade vers Node 20
2. Gestionnaire de paquets: Migration de Yarn vers pnpm
3. Build tool: Migration de Vue CLI vers Vite
4. Vue.js: Upgrade de 2.6.12 vers 3.5
5. TypeScript: Upgrade vers 5.8
6. State management: Migration de Vuex vers Pinia avec persistence
7. Composition API: Suppression du plugin @vue/composition-api (natif dans Vue 3)
8. PWA: Migration vers vite-plugin-pwa

Fichiers à conserver impérativement

• src/lib/spotify-player.js: Lecteur Spotify personnalisé

Points d'attention

• Configuration PWA complexe à migrer
• Internationalisation vue-i18n à adapter pour Vue 3
• Hooks TypeScript utilisant la Composition API
• Styles SCSS à préserver
• Configuration Netlify à adapter si nécessaire

Commandes de vérification avant migration

# Vérifier l'état actuel
yarn install
yarn serve

# Vérifier les tests (si présents)
yarn lint

Notes importantes

• Cette sauvegarde a été créée automatiquement avant le début de la migration
• La branche migration-vue3 contient l'état exact du projet avant modifications
• Tous les fichiers de configuration ont été documentés pour référence future

Limitations identifiées lors de la préparation

• Node.js version actuelle: v14.4.0 (dans .node-version)
• pnpm installé: Version système nécessitant Node.js v18.12+
• Incompatibilité: pnpm ne peut pas fonctionner avec Node.js v14.4.0
• Solution: L'upgrade de Node.js vers v20 sera nécessaire avant d'utiliser pnpm

État de la préparation

✅ Application fonctionne avec yarn (état initial vérifié) ✅ Branche de sauvegarde créée ✅ Documentation de l'état actuel complète ⚠️ pnpm nécessite upgrade Node.js (prévu dans la migration)

Recommandations pour la suite

1. Étape suivante: Upgrade Node.js vers v20 avant de continuer avec pnpm
2. Alternative temporaire: Continuer avec yarn jusqu'à l'upgrade Node.js
3. Ordre de migration: Node.js → pnpm → Vite → Vue 3 → autres dépendances