PD-96 — Plan d'implémentation¶

Objectif¶

Initialiser le projet React Native iOS avec Expo SDK 52, TypeScript strict, et pipeline CI/CD GitLab.

Choix techniques retenus¶

• Framework : Expo SDK 52 (managed workflow)
• Langage : TypeScript 5.x strict mode
• Build : EAS Build (Expo Application Services)
• Tests : Jest + React Testing Library
• Qualité : ESLint + Prettier + SonarQube
• CI/CD : GitLab CI avec stages lint/test/build

Architecture ciblée¶

ProbatioVault-app/
├── src/
│   ├── components/       # Composants réutilisables
│   │   ├── common/       # UI génériques
│   │   ├── security/     # PIN, biométrie
│   │   └── vault/        # Documents, dossiers
│   ├── screens/          # Écrans navigables
│   ├── services/         # Logique métier
│   ├── hooks/            # Hooks React custom
│   ├── store/            # State management (Zustand)
│   ├── crypto/           # Cryptographie client
│   ├── navigation/       # Configuration navigation
│   └── types/            # Types TypeScript
├── __tests__/            # Tests unitaires
├── app.json              # Configuration Expo
├── eas.json              # Configuration EAS Build
├── tsconfig.json         # TypeScript strict
└── .gitlab-ci.yml        # Pipeline CI/CD

Découpage technique¶

Phase 1 : Initialisation Expo¶

1. npx create-expo-app@latest ProbatioVault-app
2. Sélectionner template TypeScript
3. Configurer app.json (bundle ID, version, SDK 52)
4. Configurer eas.json pour builds iOS

Phase 2 : Configuration TypeScript¶

1. Activer strict: true dans tsconfig.json
2. Activer noImplicitAny, strictNullChecks
3. Configurer paths aliases (@/components, etc.)
4. Ajouter types manquants (@types/*)

Phase 3 : Structure dossiers¶

1. Créer arborescence src/ conforme
2. Configurer exports index.ts par module
3. Ajouter .gitkeep dans dossiers vides
4. Documenter structure dans README

Phase 4 : Qualité code¶

1. Configurer ESLint avec règles strictes
2. Configurer Prettier (semi, singleQuote, etc.)
3. Ajouter husky + lint-staged (pre-commit)
4. Configurer SonarQube (sonar-project.properties)

Phase 5 : Tests¶

1. Configurer Jest avec preset expo
2. Ajouter React Testing Library
3. Configurer coverage ≥ 70%
4. Créer premiers tests (App.test.tsx)

Phase 6 : Navigation¶

1. Installer @react-navigation/native
2. Installer @react-navigation/stack
3. Configurer NavigationContainer
4. Créer écran de test (HomeScreen)

Phase 7 : CI/CD GitLab¶

1. Créer .gitlab-ci.yml avec stages :
2. lint : eslint + prettier check
3. type-check : tsc --noEmit
4. test : jest --coverage
5. sonar : analyse SonarQube
6. build : eas build --platform ios
7. Configurer variables CI (EAS_TOKEN, SONAR_TOKEN)
8. Configurer règles de merge request

Points de vigilance¶

• Expo SDK : Vérifier compatibilité dépendances avec SDK 52
• EAS Build : Nécessite compte Expo et Apple Developer
• Coverage : Seuil 70% peut bloquer le build si non atteint
• Hermes : Activer pour performance (défaut SDK 52)

Hors périmètre¶

• Fonctionnalités métier (→ autres US)
• Cryptographie client-side (→ PD-97)
• Authentification SRP (→ PD-24 mobile)
• Android/Web/Desktop