← Retour aux projets

Valpineta

Projet tutoré BUT 3e année : application mobile pour le refuge de Pineta et les randonneurs - cartes, accès hors ligne et planification d'itinéraires. React Native, Expo et TypeScript, MobX et react-native-maps.

Vidéo de démonstration

Technologies

React NativeExpoTypeScriptreact-native-mapsMobXJest

Détail du projet

Projet tutoré de troisième année de BUT Informatique à l'IUT de Bayonne, pour la commanditaire Marie Bruyère (son mari gère le refuge de Pineta). Équipe de cinq étudiants : Robin, Oier, Nicolas, Alexandre et Tom.

Contexte : la vallée de Pineta propose de nombreuses randonnées déjà présentes sur le site du refuge, mais celui-ci n'a pas de connexion internet. L'application doit permettre de suivre ces excursions hors-ligne - les données sont donc à télécharger avant d'arriver au refuge.

Fonctionnalités principales : consultation des excursions (fiches détail, dénivelé, description), carte avec itinéraires et points d'intérêt, suivi en temps réel d'une excursion (chronomètre, altitude, distance parcourue, dénivelé) en premier plan ou en arrière-plan, signalements (ajout de photos avec permissions appareil/galerie, validation des champs), pop-up à l'approche d'un signalement (≈ 30 m) pour indiquer « Présent », « Absent » (suppression du signalement) ou « Voir plus ».

Synchronisation : montante (envoi des signalements et suppressions vers le serveur, store + cron en cas de connexion coupée), descendante (téléchargement de excursions.json et des fichiers GPX depuis l'API, fichier temporaire + vérification MD5 pour l'intégrité).

Environnement : React Native + Expo (cross-platform, Expo Go pour le dev en temps réel, EAS pour les builds et la distribution App Store / Play Store). API WordPress : plugin PHP pour récupérer, sauvegarder et modifier les données, Docker pour simuler l'environnement du site en dev. Arborescence basée sur le boilerplate Ignite (app : components, screens, models/stores, services, i18n, theme, utils, assets, tests). Outils : Trello, GitHub, Teams.

Stack : React Native (Expo), TypeScript, react-native-maps, MobX / MobX State Tree, Expo Location et File System, i18n-js. Tests unitaires (Jest) sur le store de synchronisation montante, tests E2E Maestro. Tuiles de carte : dossier Tiles + tiles_struct.json dans src/assets/.

Galerie

Logo Valpineta
Logo Valpineta
Carte avec itinéraires
Carte avec itinéraires
Fiche détail d'une excursion (Balcon de Pineta - Lac Marboré)
Fiche détail d'une excursion (Balcon de Pineta - Lac Marboré)
Suivi en direct : carte et statistiques
Suivi en direct : carte et statistiques
Résumé du parcours (description, dénivelé)
Résumé du parcours (description, dénivelé)
Fin d'excursion - Félicitations
Fin d'excursion - Félicitations
Nouvel avertissement (signalement)
Nouvel avertissement (signalement)