Créer une application mobile moderne, performante et prête pour les stores peut sembler complexe. Dans cet article, je partage mon expérience concrète dans la création de l’application mobile de mon portfolio, développée avec React Native Expo et Supabase, et actuellement en préparation pour le déploiement sur les stores.
Objectif de l’application
L’objectif était clair :
- Créer une application mobile professionnelle
- Mettre en avant mes projets, compétences et services
- Utiliser une stack moderne, scalable et accessible
- Préparer l’application pour une publication sur Android et iOS Cette application sert à la fois de vitrine professionnelle et de preuve de compétences techniques.
Choix de la stack technique
- React Native + Expo J’ai choisi React Native avec Expo pour plusieurs raisons :
- Développement rapide et cross-platform
- Aucun besoin de config native complexe au départ
- Build simplifié pour Android et iOS
- Excellente intégration avec les API modernes Expo permet de se concentrer sur le produit, pas sur la configuration.
- Supabase comme Backend Pour le backend, j’ai opté pour Supabase :
- Authentification intégrée
- Base de données PostgreSQL
- API REST & temps réel
- Simplicité de mise en place Supabase m’a permis de gérer :
- Les données du projet
- Les informations du profil
- Les futures évolutions (contacts, analytics, etc.)
Architecture de l’application
L’application est structurée autour de :
- Écrans : Accueil, Projets, Détails, Contact
- Navigation fluide avec Expo Router
- Composants réutilisables
- Séparation claire entre UI et logique métier
- Cette organisation facilite la maintenance et l’évolution.
Authentification et données
Même si l’application est publique, j’ai intégré :
- Une authentification Supabase (pour l’admin plus tard)
- Des règles de sécurité côté base de données
- Des requêtes optimisées pour la lecture Cela garantit une base solide pour les prochaines fonctionnalités.
Design & expérience utilisateur
J’ai porté une attention particulière à :
- Un design simple, moderne et lisible
- Une bonne hiérarchie visuelle
- Des animations légères (Expo + Reanimated)
- Une expérience fluide sur mobile L’objectif n’était pas de surcharger, mais de mettre en valeur le contenu.
Performance et optimisation
Avant toute publication sur le store, j’ai travaillé sur :
-L’optimisation des images
-La réduction du JavaScript inutile
-Les performances de navigation
-Le respect des bonnes pratiques Expo
J’ai aussi testé l’application sur plusieurs appareils pour garantir la stabilité.
Préparation pour les stores (Android & iOS)
Pour la mise en ligne :
- Configuration des icônes et splash screens
- Gestion des permissions
- Création des builds avec EAS Build
- Préparation des descriptions et screenshots Expo simplifie énormément cette étape, même pour une première publication.
Ce que j’ai appris
Ce projet m’a permis de :
- Consolider mes compétences en React Native
- Comprendre un workflow mobile complet
- Travailler avec un backend moderne
- Préparer une app pour un environnement de production C’est un projet très formateur, autant techniquement que -professionnellement.
Prochaines étapes
- Publication officielle sur les stores
- Ajout de nouvelles fonctionnalités
- Analytics et suivi utilisateur
- Amélioration continue de l’UX
Conclusion
Créer une application mobile avec React Native Expo et Supabase est aujourd’hui une solution puissante, accessible et professionnelle. Ce projet représente parfaitement ma vision : des applications utiles, bien pensées et prêtes pour le monde réel.
Liens
Portfolio : mhd-almouchafaou.online
Linkedin: Mhd Almouchafaou (https://www.linkedin.com/in/mhd-almouchafaou-aa6a5b2a1)
Mhd Almouchafaou
Top comments (0)