Ce tutoriel vous guidera dans la création d’une application mobile avec Replit et Expo dans l’éditeur de projet sur replit.com, depuis la configuration de votre environnement jusqu’à la prévisualisation de votre application sur votre appareil.
Partie 1 : Créer une application mobile en cinq minutes
Apprenez à créer une application native iPhone/Android avec Replit et Expo en seulement cinq minutes — idéal pour les débutants.Premiers pas avec Replit et Expo
Prérequis
Avant de commencer, vous aurez besoin de :
- Un compte Replit (gratuit)
- L’application Expo Go installée sur votre appareil mobile
- Un compte Expo EAS (gratuit)
- Un compte Apple Developer (99 $/an) pour iOS
- Un compte Google Play Developer (25 $ unique) pour Android
Dupliquer le modèle
Commencez par visiter le modèle Expo sur Replit et sélectionnez « Remix » pour créer votre propre copie. Cela crée une copie complète du modèle dans votre compte Replit, incluant tous les fichiers, configurations et dépendances.
Exécuter le modèle
Cliquez sur le bouton « Run » dans l’éditeur de projet. La console affichera un QR code qui relie l’application Expo Go à votre projet Replit.
La démocratisation du développement mobile via Replit et Expo rend la création d’applications accessible à tous, pas seulement aux développeurs professionnels.
Personnaliser votre application avec Agent
Choisir votre outil IA
Utilisez Agent pour créer votre application Expo :
- Mode Build : Idéal pour les fonctionnalités complexes et les changements majeurs. Le modèle Expo utilise l’Agent général, qui prend en charge tous les frameworks.
- Mode Lite : Idéal pour les petits changements et les explications de code.
- Mode Plan : Idéal pour la planification et le brainstorming.
Utiliser le langage naturel pour créer votre application
Décrivez ce que vous voulez que votre application fasse en langage naturel. Par exemple, vous pourriez demander : « Crée une application qui affiche une image aléatoire d’un chat chaque fois que j’appuie sur un bouton. »
Itérer dans l'éditeur de projet
Continuez à développer votre application mobile native dans l’éditeur de projet sur replit.com. Enregistrez vos modifications, puis rechargez Expo Go pour prévisualiser les mises à jour sur votre téléphone.
Partie 2 : Prévisualiser votre application mobile
Apprenez à créer un build de prévisualisation iOS pour votre application Replit Expo.Créer un build de prévisualisation pour votre appareil
Bien que ce guide se concentre sur le déploiement iOS, les mêmes étapes Replit et Expo s’appliquent au développement Android. Pour Android, suivez le guide de déploiement Android d’Expo et le processus Google Play Console.
Prérequis
Avant de créer un build de prévisualisation iOS, vous aurez besoin de :
- Votre application Replit de la Partie 1
- Un compte Apple Developer (99 $/an) pour les builds de prévisualisation iOS et la soumission à l’App Store
- Un iPhone (pour le déploiement iOS)
- Un compte Expo
Initialiser EAS
EAS (Expo Application Services) sert d’interface entre votre build et Expo, ainsi que l’App Store.
- Arrêtez votre application si elle est en cours d’exécution
- Dans le menu déroulant de l’éditeur de projet, sélectionnez « EAS init »
- Connectez-vous à votre compte Expo lorsque vous y êtes invité
- Créez un nouveau projet ou sélectionnez-en un existant
Exécuter EAS update
Cette étape d’initialisation aide à configurer votre projet et à le lier à votre compte Apple Developer.
- Dans le menu déroulant, sélectionnez « EAS update »
- Attendez que le bundler Metro démarre et complète le processus d’export
Créer le build pour iOS
Il est maintenant temps de créer un build de prévisualisation pour votre appareil iOS.
- Dans le menu déroulant, sélectionnez « EAS publish preview iOS »
- Entrez un identifiant de bundle iOS (par exemple, com.votrenom.nomdevotreapp)
- Connectez-vous à votre compte App Store Connect lorsque vous y êtes invité
- Sélectionnez votre équipe de développeur individuel
- Générez les certificats de distribution de l’appareil lorsque vous y êtes invité
Enregistrer votre appareil
Pour installer des applications de développement sur votre iPhone, vous devez enregistrer votre appareil.
- Lorsque vous y êtes invité, sélectionnez « website » pour enregistrer votre appareil
- Scannez le QR code qui apparaît avec votre iPhone
- Téléchargez le profil de développement lorsque vous y êtes invité
- Allez dans les Réglages sur votre iPhone
- Sélectionnez « Profil téléchargé » en haut
- Installez le profil et entrez votre code d’accès lorsque vous y êtes invité
- Revenez à l’éditeur de projet et appuyez sur n’importe quelle touche pour continuer
Attendre le build
Expo va maintenant créer votre application, ce qui prend environ 10 à 15 minutes selon la complexité de votre application.
- Le build sera mis en file d’attente
- Vous pouvez vérifier la progression dans votre tableau de bord Expo sous l’onglet « Builds »
- Une fois terminé, un nouveau QR code apparaîtra pour installer l’application
Installer le build de prévisualisation sur votre appareil
Lorsque le build de prévisualisation est terminé, installez-le sur votre iPhone.
- Scannez le QR code d’installation avec votre iPhone
- Sélectionnez « Installer » lorsque vous y êtes invité
- Le build de prévisualisation commencera à s’installer sur votre écran d’accueil
Activer le mode développeur
Avant de pouvoir ouvrir l’application, vous devez activer le mode développeur sur votre iPhone.
- Allez dans Réglages > Confidentialité et sécurité
- Faites défiler vers le bas et trouvez « Mode développeur »
- Activez-le
- Redémarrez votre appareil lorsque vous y êtes invité
- Après le redémarrage, vous pouvez ouvrir et tester votre build de prévisualisation.
Ce que vous avez accompli
En suivant ce tutoriel, vous avez maintenant un build de prévisualisation iOS installé sur votre appareil pour les tests de développement. La plupart des développeurs auraient besoin de jours ou de semaines pour y parvenir, mais vous l’avez fait en environ une heure.Prochaines étapes
Prochaines étapes
Après avoir terminé ce tutoriel, vous pouvez :
- Continuer à affiner votre application avec davantage de fonctionnalités
- Ajouter l’authentification et le stockage de données
- Implémenter des fonctionnalités natives de l’appareil comme l’appareil photo ou la localisation
- Soumettre votre application à l’App Store pour une distribution publique
- Créer une version Android en suivant des étapes similaires
Problèmes courants et solutions
L'application ne se connecte pas à Expo Go
L'application ne se connecte pas à Expo Go
- Assurez-vous que votre téléphone et votre ordinateur sont sur le même réseau Wi-Fi
- Essayez d’utiliser le mode de connexion « Tunnel » au lieu de « LAN »
- Vérifiez si votre pare-feu bloque les connexions
- Consultez le guide de dépannage d’Expo
Les modifications ne s'affichent pas dans l'application
Les modifications ne s'affichent pas dans l'application
- Essayez de recharger l’application (secouez l’appareil et sélectionnez « Reload »)
- Assurez-vous d’avoir enregistré vos modifications dans l’éditeur de projet
- Vérifiez la console pour les erreurs éventuelles
- Consultez la documentation sur le mode développement d’Expo
Le build échoue sur EAS
Le build échoue sur EAS
- Vérifiez votre configuration app.json
- Vérifiez si toutes les dépendances sont compatibles
- Assurez-vous d’avoir configuré les bonnes permissions
- Examinez les messages d’erreur dans les journaux de build
- Consultez le guide de dépannage EAS Build
Conclusion
Avec Replit et Expo, créer des applications mobiles n’a jamais été aussi simple ou rapide. Vous pouvez passer d’une idée à une prévisualisation mobile native fonctionnelle en quelques heures, pas en semaines ou en mois. La combinaison d’un environnement de développement basé sur navigateur et d’un framework mobile multiplateforme supprime les barrières traditionnelles d’entrée dans le développement mobile.Pour des informations plus détaillées, consultez :