Magic Nona : une application de garde d'enfants avec nounous vérifiées, réservation et paiement Stripe

Sommaire

Magic Nona est une application mobile qui met en relation des familles avec des nounous retraitées pour de la garde d'enfants ponctuelle ou régulière. J'en ai assuré le développement complet : l'application iOS et Android, la petite API PHP qui gère paiements et emails, et le back-office d'administration. Voici ce que fait le produit, et surtout ce qui a demandé du travail pour qu'il fonctionne bien.

Le produit : confier ses enfants à une nounou expérimentée

L'idée de Magic Nona est simple : des personnes retraitées qui ont une longue expérience de la garde d'enfants proposent leurs services, et des parents les trouvent près de chez eux. Il y a donc deux publics dans la même application, avec deux parcours très différents.

• Les parents cherchent une nounou, consultent son profil, envoient une demande de garde, échangent avec elle et paient dans l'application.
• Les nounous remplissent un profil complet, fixent leur tarif horaire, publient leurs disponibilités, envoient leurs justificatifs, acceptent ou refusent les demandes et sont payées sans manipuler d'espèces.

Au démarrage, l'application lit le profil de l'utilisateur et choisit la bonne navigation : un espace parent ou un espace nounou. Le même code sert les deux rôles, mais les écrans, les vérifications et les actions possibles changent.

Trouver une nounou : carte, liste et filtres

L'accueil propose deux modes, qu'on bascule d'un geste : une liste de nounous avec la carte en haut, ou une carte plein écran. Chaque nounou apparaît avec sa photo, son âge et son tarif horaire.

• Recherche par ville ou code postal, avec un champ qui filtre les résultats au fur et à mesure de la saisie.
• Filtre de distance (de 5 à 50 km) calculé à partir de la position du parent.
• Filtre par tranche d'âge de la nounou.
• Chargement par pages de 20 avec défilement infini : la liste se complète quand on arrive en bas.
• En mode carte, seules les nounous situées dans la zone visible sont affichées, ce qui garde la carte lisible quand on zoome ou qu'on se déplace.

Une nounou n'apparaît dans les résultats que si son profil est complet. L'application l'impose au moment de la connexion : nom, date de naissance, présentation et tarif, puis adresse complète, numéro de téléphone et photo. Tant qu'un élément manque, elle est renvoyée vers le bon écran avec un message qui explique quoi compléter. Une fois tout rempli, son profil devient visible.

La confiance : vérification d'identité et casier judiciaire

Pour un service de garde d'enfants, la confiance passe avant tout le reste. L'application demande aux nounous d'envoyer une pièce d'identité (carte d'identité, passeport, permis ou titre de séjour, recto et verso) et un extrait de casier judiciaire.

• Photo prise avec l'appareil, choisie dans la galerie ou envoyée sous forme de fichier.
• Images compressées sur le téléphone avant l'envoi, pour des téléversements rapides même avec une connexion moyenne.
• Fichiers stockés dans Firebase Storage, profil repassé en « non vérifié » à chaque nouvel envoi.
• Email automatique à l'administrateur pour lui signaler qu'il y a des documents à contrôler.
• Badge « vérifié » affiché sur le profil public une fois la validation faite depuis le back-office.

Réserver en quatre étapes

Depuis le profil, le parent lance une demande de garde. Le formulaire est découpé en quatre étapes avec une barre de progression, et le bouton « suivant » ne s'active que si l'étape est valide.

1. Date et horaires. Le calendrier n'ouvre que les jours où la nounou est disponible, et seuls les créneaux compris dans ses plages horaires sont proposés. La durée se calcule toute seule.
2. Les enfants. Nombre d'enfants et tranche d'âge de chacun.
3. Les détails. Consignes particulières et présence d'animaux au domicile.
4. Le prix et le contact. L'application suggère un prix calculé à partir du nombre d'heures et du tarif de la nounou, majoré pour chaque enfant supplémentaire. Le parent peut proposer son propre montant.

À l'envoi, la demande est enregistrée et la nounou reçoit une notification push. De son côté, elle gère ses disponibilités jour par jour, avec une ou plusieurs plages horaires, et retrouve toutes ses gardes dans un calendrier filtrable.

La messagerie, cœur de la transaction

Chaque demande ouvre une conversation en temps réel entre le parent et la nounou. Mais ce n'est pas une simple messagerie : elle porte tout le cycle de vie de la garde, avec un statut visible en haut de l'écran.

• En attente : la nounou peut accepter, refuser ou modifier le prix proposé.
• Confirmée : les coordonnées de chacun deviennent visibles, et seulement à ce moment-là.
• À payer : la nounou déclare la mission terminée, le parent est invité à payer.
• Payée ou annulée : la conversation garde la trace de tout.

Chaque action (acceptation, refus, nouveau prix, fin de mission) écrit un message système dans la conversation et envoie une notification push à l'autre personne. Les notifications sont aussi enregistrées en base, pour qu'on les retrouve dans l'application même si on les a manquées sur l'écran verrouillé. L'accueil affiche le nombre d'actions en attente, mis à jour en direct.

Le paiement : Stripe, Apple Pay et facture PDF

Le paiement se fait uniquement dans l'application, sans espèces. C'est la partie où l'on ne peut pas se permettre d'approximation.

• Clé secrète côté serveur. L'application ne contient jamais la clé secrète Stripe. Elle demande à l'API PHP de créer l'intention de paiement, reçoit seulement un identifiant temporaire, puis ouvre le formulaire de paiement natif de Stripe.
• Apple Pay est proposé quand l'appareil le prend en charge, avec le détail des lignes affiché dans la feuille de paiement.
• TVA et commission réglables. Les taux ne sont pas écrits dans le code : ils sont lus dans une configuration modifiable depuis le back-office. Le récapitulatif détaille le prix de la garde, la TVA et les frais de service.
• Après le paiement, la garde passe au statut payé, puis l'API génère une facture PDF et l'envoie par email au parent. La nounou et l'administrateur reçoivent aussi un email de confirmation.

Les difficultés techniques et leurs solutions

Deux rôles, une seule application

Parents et nounous n'ont ni les mêmes écrans ni les mêmes obligations. La navigation est choisie au démarrage selon le rôle, et une vérification s'exécute à chaque retour sur l'accueil : compte bloqué, email non vérifié, profil incomplet. Chaque cas renvoie vers l'écran adapté, ce qui évite qu'un profil à moitié rempli se retrouve visible.

Une carte qui reste fluide

Les adresses des nounous sont converties en coordonnées pour les placer sur la carte, puis la distance avec le parent est calculée sur le téléphone. Pour ne pas tout charger d'un coup, la liste est paginée par 20 et les marqueurs ne sont pas redessinés à chaque mouvement. En mode carte, seules les nounous de la zone visible sont affichées.

Un statut cohérent pour deux personnes

Le parent et la nounou regardent la même garde depuis deux téléphones. Les écrans écoutent les changements en temps réel : quand la nounou accepte, le parent voit le nouveau statut immédiatement, avec le message système et la notification. Les coordonnées ne sont dévoilées qu'une fois la garde confirmée.

Des documents sensibles

Pièces d'identité et casiers judiciaires sont compressés avant l'envoi, stockés à part, et toute modification remet le profil en attente de validation. Le contrôle reste humain, depuis le back-office.

Cinq langues et deux stores

L'application est traduite en français, anglais, allemand, espagnol et italien, avec mémorisation du choix de l'utilisateur. Elle est construite avec Expo et EAS pour iOS et Android à partir d'une seule base de code.

Le back-office et la pile technique

Un back-office web en React permet à l'équipe de piloter le service :

• liste et fiche détaillée des utilisateurs, avec activation ou blocage d'un compte et validation des vérifications ;
• contrôle des documents envoyés par les nounous ;
• suivi des gardes et de leurs détails, et consultation des disponibilités ;
• envoi de notifications push aux utilisateurs ;
• réglage de la TVA et de la commission, avec un exemple de calcul.

Côté utilisateur, on trouve aussi le signalement d'un problème, un formulaire de contact, la gestion des informations bancaires (IBAN) pour les nounous et la suppression du compte depuis l'application, suivie d'un email de confirmation.

La pile technique

• Application : React Native avec Expo, NativeWind, React Navigation, i18next, react-native-maps, Gifted Chat, Expo Notifications.
• Données : Firebase Authentication, Firestore (temps réel) et Storage.
• API : PHP avec Stripe, PHPMailer et mPDF pour les factures.
• Paiement : Stripe, feuille de paiement native et Apple Pay.
• Back-office : React.
• Publication : EAS Build, App Store et Google Play.

Magic Nona montre un projet mené de bout en bout : conception de l'application mobile, logique métier entre deux types d'utilisateurs, paiement sécurisé, back-office et publication sur les deux stores.

Un projet similaire ? Vous avez une idée de plateforme de mise en relation, avec réservation, messagerie et paiement dans l'application ? Me contacter pour en parler. Vous pouvez aussi voir toutes les captures de Magic Nona.

Questions fréquentes

Peut-on développer une application avec deux types d'utilisateurs, comme des clients et des prestataires ?

Oui. Magic Nona sert les parents et les nounous dans une seule application iOS et Android : la navigation, les écrans et les vérifications s'adaptent au rôle de chaque utilisateur.

Comment le paiement est-il sécurisé dans l'application ?

Le paiement passe par Stripe. La clé secrète reste sur le serveur : l'application demande à l'API de créer le paiement puis ouvre la feuille de paiement native de Stripe, avec Apple Pay quand l'appareil le permet.

Peut-on vérifier les prestataires avant qu'ils soient visibles ?

Oui. Dans Magic Nona, les nounous envoient pièce d'identité et casier judiciaire depuis l'application, l'administrateur est prévenu par email et valide le profil depuis le back-office, ce qui affiche un badge « vérifié ».