> ## Documentation Index
> Fetch the complete documentation index at: https://docs.replit.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Applications Mobiles Natives

> Apprenez à créer une application mobile native avec Agent, à la tester sur votre téléphone et à la soumettre à la révision d'Apple pour la publication sur l'App Store.

export const MobileArchitectureDiagram = () => {
  if (typeof document !== 'undefined' && !document.getElementById('mobile-arch-styles-v3')) {
    const style = document.createElement('style');
    style.id = 'mobile-arch-styles-v3';
    style.textContent = `
      .mobile-arch-v3 {
        --arch-bg: var(--replit-docs-bg, #F6F6F4);
        --arch-surface: var(--replit-docs-bg-elevated, #F1F1EE);
        --arch-border: var(--replit-docs-border, #DEDAD5);
        --arch-text: var(--replit-docs-text, #1D1D1D);
        --arch-muted: var(--replit-docs-text-subtle, #858585);
        --arch-accent: #F26522;
        --arch-accent-soft: #FEF3EE;
      }
      
      .dark .mobile-arch-v3,
      html.dark .mobile-arch-v3,
      [data-theme="dark"] .mobile-arch-v3 {
        --arch-bg: var(--replit-docs-bg, #1E1E1F);
        --arch-surface: var(--replit-docs-bg-elevated, #222223);
        --arch-border: var(--replit-docs-border, #39393D);
        --arch-text: var(--replit-docs-text, #F5F5F5);
        --arch-muted: var(--replit-docs-text-subtle, #8E8F97);
        --arch-accent: #F26522;
        --arch-accent-soft: #1F1A17;
      }

      .arch-panel {
        transition: all 0.25s ease;
      }
      .arch-panel:hover {
        border-color: var(--arch-accent) !important;
      }
    `;
    document.head.appendChild(style);
  }
  const serverItems = [{
    label: 'Database',
    detail: 'PostgreSQL for structured data'
  }, {
    label: 'Object Storage',
    detail: 'Files, images, and media'
  }, {
    label: 'Secrets',
    detail: 'API keys stored securely'
  }, {
    label: 'API routes',
    detail: 'Server-side logic and endpoints'
  }];
  const clientItems = [{
    label: 'Native UI',
    detail: 'Real iOS and Android components'
  }, {
    label: 'Local state',
    detail: 'Fast, offline-capable data'
  }, {
    label: 'Device APIs',
    detail: 'Camera, location, notifications'
  }, {
    label: 'Live reload',
    detail: 'Instant preview via Expo Go'
  }];
  return <div className="mobile-arch-v3" style={{
    padding: '24px',
    borderRadius: '8px',
    border: '1px solid var(--arch-border)',
    background: 'var(--arch-bg)'
  }}>
      {}
      <div style={{
    marginBottom: '20px'
  }}>
        <div style={{
    fontSize: '18px',
    fontWeight: '600',
    color: 'var(--arch-text)'
  }}>
          Architecture
        </div>
        <div style={{
    fontSize: '14px',
    color: 'var(--arch-muted)',
    marginTop: '4px'
  }}>
          Your server runs on Replit. The app runs natively on devices.
        </div>
      </div>

      {}
      <div style={{
    display: 'flex',
    alignItems: 'stretch',
    gap: '16px'
  }}>
        
        {}
        <div className="arch-panel" style={{
    flex: 1,
    padding: '20px',
    borderRadius: '8px',
    border: '1px solid var(--arch-border)',
    background: 'var(--arch-surface)'
  }}>
          <div style={{
    fontSize: '13px',
    color: 'var(--arch-accent)',
    fontWeight: '600',
    marginBottom: '6px'
  }}>
            Replit Cloud
          </div>
          <div style={{
    fontSize: '16px',
    fontWeight: '600',
    color: 'var(--arch-text)',
    marginBottom: '16px'
  }}>
            Server
          </div>
          
          <div style={{
    display: 'flex',
    flexDirection: 'column',
    gap: '12px'
  }}>
            {serverItems.map(item => <div key={item.label}>
                <div style={{
    fontSize: '14px',
    fontWeight: '500',
    color: 'var(--arch-text)'
  }}>
                  {item.label}
                </div>
                <div style={{
    fontSize: '13px',
    color: 'var(--arch-muted)',
    marginTop: '2px'
  }}>
                  {item.detail}
                </div>
              </div>)}
          </div>
        </div>

        {}
        <div className="arch-panel" style={{
    flex: 1,
    padding: '20px',
    borderRadius: '8px',
    border: '1px solid var(--arch-border)',
    background: 'var(--arch-surface)'
  }}>
          <div style={{
    fontSize: '13px',
    color: 'var(--arch-accent)',
    fontWeight: '600',
    marginBottom: '6px'
  }}>
            User device
          </div>
          <div style={{
    fontSize: '16px',
    fontWeight: '600',
    color: 'var(--arch-text)',
    marginBottom: '16px'
  }}>
            Native app
          </div>
          
          <div style={{
    display: 'flex',
    flexDirection: 'column',
    gap: '12px'
  }}>
            {clientItems.map(item => <div key={item.label}>
                <div style={{
    fontSize: '14px',
    fontWeight: '500',
    color: 'var(--arch-text)'
  }}>
                  {item.label}
                </div>
                <div style={{
    fontSize: '13px',
    color: 'var(--arch-muted)',
    marginTop: '2px'
  }}>
                  {item.detail}
                </div>
              </div>)}
          </div>
        </div>
      </div>
    </div>;
};

export const MobileStackDiagram = () => {
  if (typeof document !== 'undefined' && !document.getElementById('mobile-stack-styles-v3')) {
    const style = document.createElement('style');
    style.id = 'mobile-stack-styles-v3';
    style.textContent = `
      .mobile-stack-v3 {
        --stack-bg: var(--replit-docs-bg, #F6F6F4);
        --stack-surface: var(--replit-docs-bg-elevated, #F1F1EE);
        --stack-border: var(--replit-docs-border, #DEDAD5);
        --stack-text: var(--replit-docs-text, #1D1D1D);
        --stack-muted: var(--replit-docs-text-subtle, #858585);
        --stack-accent: #F26522;
        --stack-accent-soft: #FEF3EE;
      }
      
      .dark .mobile-stack-v3,
      html.dark .mobile-stack-v3,
      [data-theme="dark"] .mobile-stack-v3 {
        --stack-bg: var(--replit-docs-bg, #1E1E1F);
        --stack-surface: var(--replit-docs-bg-elevated, #222223);
        --stack-border: var(--replit-docs-border, #39393D);
        --stack-text: var(--replit-docs-text, #F5F5F5);
        --stack-muted: var(--replit-docs-text-subtle, #8E8F97);
        --stack-accent: #F26522;
        --stack-accent-soft: #1F1A17;
      }

      .stack-layer {
        transition: all 0.25s ease;
        cursor: pointer;
      }
      .stack-layer:hover,
      .stack-layer.active {
        background: var(--stack-accent-soft) !important;
        border-color: var(--stack-accent) !important;
      }
      .stack-layer .layer-detail {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transition: max-height 0.3s ease, opacity 0.2s ease, margin 0.3s ease;
        margin-top: 0;
      }
      .stack-layer.active .layer-detail {
        max-height: 80px;
        opacity: 1;
        margin-top: 8px;
      }
      
      .platform-item {
        transition: all 0.2s ease;
      }
      .platform-item:hover {
        border-color: var(--stack-accent) !important;
        background: var(--stack-accent-soft) !important;
      }
    `;
    document.head.appendChild(style);
  }
  const handleLayerClick = e => {
    const layer = e.currentTarget;
    const allLayers = document.querySelectorAll('.stack-layer');
    const wasActive = layer.classList.contains('active');
    allLayers.forEach(l => l.classList.remove('active'));
    if (!wasActive) {
      layer.classList.add('active');
    }
  };
  const runAnimation = () => {
    const btn = document.getElementById('stack-animate-btn');
    if (!btn || btn.dataset.running === 'true') return;
    btn.dataset.running = 'true';
    btn.textContent = 'Running...';
    btn.style.opacity = '0.6';
    const layers = document.querySelectorAll('.stack-layer');
    const platforms = document.getElementById('stack-platforms-container');
    let step = 0;
    const totalSteps = layers.length + 1;
    const animate = () => {
      layers.forEach(l => l.classList.remove('active'));
      if (platforms) platforms.style.borderColor = 'var(--stack-border)';
      if (step < layers.length) {
        layers[step].classList.add('active');
        step++;
        setTimeout(animate, 4000);
      } else if (step === layers.length) {
        if (platforms) platforms.style.borderColor = 'var(--stack-accent)';
        step++;
        setTimeout(animate, 4000);
      } else {
        layers.forEach(l => l.classList.remove('active'));
        if (platforms) platforms.style.borderColor = 'var(--stack-border)';
        btn.dataset.running = 'false';
        btn.textContent = 'See the flow';
        btn.style.opacity = '1';
      }
    };
    animate();
  };
  const layers = [{
    title: 'Replit Agent',
    summary: 'Builds your app from a prompt',
    detail: 'Describe what you want in natural language. Agent writes TypeScript code, configures dependencies, and sets up your project.',
    verb: 'writes'
  }, {
    title: 'Your code',
    summary: 'TypeScript + React components',
    detail: 'Your app is standard React code that you own and can customize. No vendor lock-in.',
    verb: 'using'
  }, {
    title: 'Expo',
    summary: 'Development framework',
    detail: 'Expo simplifies React Native development with managed builds, over-the-air updates, and easy access to device APIs.',
    verb: 'simplifies'
  }, {
    title: 'React Native',
    summary: 'Cross-platform UI',
    detail: 'React Native compiles your JavaScript to real native code, not a web view. True native performance.',
    verb: 'compiles to'
  }];
  const platforms = ['iOS', 'Android', 'Web'];
  return <div className="mobile-stack-v3" style={{
    padding: '24px',
    borderRadius: '8px',
    border: '1px solid var(--stack-border)',
    background: 'var(--stack-bg)'
  }}>
      {}
      <div style={{
    display: 'flex',
    justifyContent: 'space-between',
    alignItems: 'flex-start',
    marginBottom: '20px'
  }}>
        <div>
          <div style={{
    fontSize: '18px',
    fontWeight: '600',
    color: 'var(--stack-text)'
  }}>
            Technology stack
          </div>
          <div style={{
    fontSize: '14px',
    color: 'var(--stack-muted)',
    marginTop: '4px'
  }}>
            Tap any layer to learn more
          </div>
        </div>
        <button id="stack-animate-btn" onClick={runAnimation} data-running="false" style={{
    padding: '8px 14px',
    fontSize: '13px',
    color: 'var(--stack-accent)',
    background: 'transparent',
    border: '1px solid var(--stack-accent)',
    borderRadius: '4px',
    cursor: 'pointer'
  }}>
          See the flow
        </button>
      </div>

      {}
      <div style={{
    display: 'flex',
    flexDirection: 'column',
    gap: '8px'
  }}>
        {layers.map(layer => <div key={layer.title}>
            <div className="stack-layer" onClick={handleLayerClick} style={{
    padding: '16px',
    borderRadius: '8px',
    border: '1px solid var(--stack-border)',
    background: 'var(--stack-surface)'
  }}>
              <div style={{
    display: 'flex',
    justifyContent: 'space-between',
    alignItems: 'center'
  }}>
                <div>
                  <div style={{
    fontSize: '16px',
    fontWeight: '500',
    color: 'var(--stack-text)'
  }}>
                    {layer.title}
                  </div>
                  <div style={{
    fontSize: '14px',
    color: 'var(--stack-muted)',
    marginTop: '4px'
  }}>
                    {layer.summary}
                  </div>
                </div>
                <div style={{
    fontSize: '14px',
    color: 'var(--stack-accent)',
    fontWeight: '500'
  }}>
                  {layer.verb}
                </div>
              </div>
              <div className="layer-detail" style={{
    fontSize: '14px',
    color: 'var(--stack-muted)',
    lineHeight: '1.5'
  }}>
                {layer.detail}
              </div>
            </div>
          </div>)}
      </div>

      {}
      <div id="stack-platforms-container" style={{
    display: 'flex',
    gap: '12px',
    padding: '12px',
    marginTop: '8px',
    borderRadius: '8px',
    border: '1px solid var(--stack-border)',
    background: 'var(--stack-surface)',
    transition: 'border-color 0.25s ease'
  }}>
        {platforms.map(platform => <div key={platform} className="platform-item" style={{
    flex: 1,
    padding: '12px',
    borderRadius: '6px',
    border: '1px solid var(--stack-border)',
    background: 'var(--stack-bg)',
    textAlign: 'center',
    fontSize: '15px',
    fontWeight: '500',
    color: 'var(--stack-text)'
  }}>
            {platform}
          </div>)}
      </div>
    </div>;
};

<Frame>
  <img src="https://mintcdn.com/replit/TlSUj3SmUsRG399T/images/native-mobile-apps/mobile-screen.png?fit=max&auto=format&n=TlSUj3SmUsRG399T&q=85&s=d512e8c7bf0a86ecacd92fbef1f52749" alt="Application mobile en cours d'exécution dans l'aperçu de l'Éditeur de projet Replit avec le panneau Aperçu sur l'appareil et le QR code" width="1440" height="900" data-path="images/native-mobile-apps/mobile-screen.png" />
</Frame>

Créez des applications iOS et Android avec Agent, prévisualisez-les sur votre téléphone et préparez des builds via un flux guidé.

<Note>
  Pour créer ou prévisualiser une application iOS native, utilisez l'Éditeur de projet sur [replit.com](https://replit.com). Le travail sur les applications mobiles natives est également disponible dans l'application Replit Android où cela est pris en charge.
</Note>

## Premiers pas

Vous pouvez obtenir une application mobile fonctionnelle en quelques étapes :

<Steps>
  <Step title="Créer une application mobile">
    Sur l'écran d'accueil de Replit, décrivez votre idée d'application et sélectionnez **Application mobile** comme type d'application.

    <Frame>
      <img src="https://mintcdn.com/replit/TlSUj3SmUsRG399T/images/native-mobile-apps/prompt.png?fit=max&auto=format&n=TlSUj3SmUsRG399T&q=85&s=21bba53b72382bf6fb0dc37a168de9e8" alt="Invite de l'écran d'accueil Replit avec Application mobile sélectionné comme type d'application" width="1440" height="900" data-path="images/native-mobile-apps/prompt.png" />
    </Frame>
  </Step>

  <Step title="Tester votre application">
    Vous disposez de deux façons de prévisualiser une application mobile pendant sa construction :

    * **Dans l'Éditeur de projet** : Dans le sélecteur d'appareil du panneau d'aperçu, choisissez **Simulateur iOS** ou **Émulateur Android**. Un vrai simulateur est diffusé dans l'Éditeur de projet afin que vous puissiez interagir sans quitter Replit. Ni Xcode ni Android Studio ne sont nécessaires.
    * **Sur un vrai téléphone avec Expo Go** : Installez [Expo Go](https://expo.dev/go) sur votre iPhone ou appareil Android. Dans l'Éditeur de projet, sélectionnez **Ouvrir dans Expo Go** dans le panneau d'aperçu et scannez le QR code.

    <Frame>
      <img src="https://mintcdn.com/replit/TlSUj3SmUsRG399T/images/native-mobile-apps/workspace.png?fit=max&auto=format&n=TlSUj3SmUsRG399T&q=85&s=6508e73ef3c21dcee8221e884164a23c" alt="Éditeur de projet Replit affichant l'aperçu de l'application et l'option Aperçu sur appareil mobile" width="1440" height="900" data-path="images/native-mobile-apps/workspace.png" />
    </Frame>
  </Step>

  <Step title="Itérer avec Agent">
    Demandez à Agent d'ajouter des fonctionnalités, de connecter des sources de données ou d'intégrer des services. Continuez à tester dans le simulateur ou sur votre téléphone au fur et à mesure de vos itérations.
  </Step>
</Steps>

<Tip>
  Le **Simulateur iOS** et l'**Émulateur Android** de l'Éditeur de projet affichent la version native de votre application, y compris le style spécifique à la plateforme et la plupart des composants natifs. Pour les fonctionnalités qui dépendent du matériel réel — haptiques, caméra, notifications push ou localisation — testez sur un vrai téléphone avec Expo Go.
</Tip>

## Prévisualiser sur un simulateur ou un émulateur

Replit vous permet d'exécuter et de tester vos applications mobiles sur votre téléphone avec Expo. Alternativement, Replit diffuse un vrai **Simulateur iOS** ou **Émulateur Android** directement dans le panneau d'aperçu. Les modifications que vous effectuez avec Agent se rechargent à chaud dans le simulateur, tout comme sur un vrai appareil.

<Note>
  Les aperçus du Simulateur iOS et de l'Émulateur Android sont disponibles pour les builders sur les plans Core, Pro et Enterprise. Applications mobiles uniquement — l'option est masquée pour les projets web uniquement.
</Note>

### Comment ouvrir un simulateur

<Steps>
  <Step title="Ouvrir votre projet mobile">
    Ouvrez un projet qui possède un artefact mobile.
  </Step>

  <Step title="Choisir votre appareil">
    Dans le sélecteur d'appareil en haut du panneau d'aperçu, choisissez **Simulateur iOS** ou **Émulateur Android**. Le simulateur démarre à la place de l'aperçu web.
  </Step>

  <Step title="Interagir comme sur un vrai appareil">
    Appuyez, faites glisser, saisissez et naviguez à l'aide de votre souris et de votre clavier. Sélectionnez **Redémarrer** dans la barre d'outils pour recharger l'application sans redémarrer le simulateur.
  </Step>
</Steps>

<Tip>
  Le simulateur s'exécute dans le cloud et est diffusé vers votre navigateur, il n'y a donc rien à télécharger ni à configurer. Les fichiers de votre projet restent sur Replit.
</Tip>

<Frame>
  <video autoPlay muted loop playsInline src="https://cdn.replit.com/sanity/ios-emulator.mp4" />
</Frame>

### Compatibilité des navigateurs

* **Chrome**, **Safari** et les navigateurs basés sur Chromium sont entièrement pris en charge.
* **Firefox** n'est pas pris en charge. Les options iOS et Android apparaissent désactivées avec une note « Firefox non pris en charge » lorsque vous ouvrez Replit dans Firefox. Il s'agit d'une limitation de la technologie de diffusion qui alimente le simulateur.

### Quand utiliser Expo Go à la place

Utilisez Expo Go sur un vrai téléphone lorsque vous devez tester des fonctionnalités qui dépendent du matériel réel ou lorsque vous souhaitez partager un aperçu avec quelqu'un qui n'est pas à votre ordinateur :

* Caméra, microphone, haptiques ou autres capteurs natifs
* Notifications push
* Localisation GPS réelle
* Partager un aperçu de développement avec un coéquipier, un testeur ou un investisseur

Pour ouvrir votre application dans Expo Go, ouvrez le projet sur [replit.com](https://replit.com), sélectionnez **Ouvrir dans Expo Go** dans le panneau d'aperçu de l'Éditeur de projet, et scannez le QR code avec l'application [Expo Go](https://expo.dev/go) sur votre téléphone.

### Simulateur en plein écran

Depuis une carte d'artefact mobile, sélectionnez **Plus d'actions** → **Ouvrir dans le Simulateur iOS** ou **Ouvrir dans l'Émulateur Android** pour ouvrir le simulateur dans son propre onglet avec une plus grande fenêtre d'affichage.

## Pourquoi créer une application mobile ?

Créez une application mobile lorsque vous souhaitez :

* **Une expérience native** : Des performances rapides, des interactions fluides et une interface utilisateur native à la plateforme.
* **Les capacités de l'appareil** : Caméra, notifications push, localisation, et plus encore.
* **Distribution sur l'App Store** : Une liste partageable que les gens peuvent découvrir et installer après le processus de révision d'Apple.

## Fonctionnalités clés

* **Création axée sur l'IA** : Décrivez votre application, et Agent crée une application mobile fonctionnelle.
* **Aperçu dans l'Éditeur de projet** : Testez sur un Simulateur iOS ou un Émulateur Android sans quitter Replit, ou prévisualisez sur votre téléphone avec Expo Go.
* **Full-stack par défaut** : Ajoutez des routes serveur, une base de données, App Storage, des connecteurs et des intégrations IA à mesure que votre application se développe.
* **Soumission guidée** : Préparez des builds pour TestFlight et la soumission à l'App Store sans gérer les chaînes d'outils iOS locales.

## Flux de développement

Il existe trois étapes pour accéder à votre application, chacune avec des audiences et des capacités différentes :

| Étape             | Qui peut accéder      | Comment accéder                                             | Idéal pour                                     |
| ----------------- | --------------------- | ----------------------------------------------------------- | ---------------------------------------------- |
| **Développement** | Vous                  | Simulateur de l'Éditeur de projet, ou QR code pour Expo Go  | Construire et itérer                           |
| **Déploiement**   | Testeurs avec Expo Go | URL publique avec QR code                                   | Aperçus de développement, prototypage et démos |
| **App Store**     | Tout le monde         | Téléchargement depuis l'App Store après la révision d'Apple | Version de production                          |

**Développement** : Lorsque vous démarrez votre application, vous pouvez la prévisualiser dans le **Simulateur iOS** ou l'**Émulateur Android** de l'Éditeur de projet, ou scanner un QR code depuis le panneau d'aperçu pour l'ouvrir dans Expo Go sur votre téléphone.

**Déploiement** : Lorsque vous cliquez sur **Publier**, Replit crée une URL publique avec un QR code pour Expo Go. C'est idéal pour les aperçus de développement et le prototypage — montrez à des investisseurs, recueillez des retours, ou testez avec des amis avant de vous engager dans le processus de l'App Store.

**App Store** : Lorsque vous soumettez à l'App Store, Apple révise votre application. Après approbation, les gens peuvent la télécharger et l'installer depuis l'App Store. Cela nécessite un compte Apple Developer.

## Aperçu de la publication

Lorsque vous préparez une version iOS, le flux est généralement le suivant :

* Publier depuis l'Éditeur de projet
* Soumettre un build à TestFlight
* Promouvoir un build TestFlight vers l'App Store dans App Store Connect

<Note>
  Pour soumettre des builds à TestFlight et à l'App Store, Apple exige une adhésion au programme Apple Developer.
</Note>

Pour une présentation complète, consultez le tutoriel [Créer et lancer une application mobile](/fr/tutorials/build-and-launch-a-mobile-app).

## Où créer des applications mobiles natives

Votre environnement Replit s'exécute dans le cloud, pas sur votre machine locale. Pour créer une application mobile native, utilisez l'Éditeur de projet sur [replit.com](https://replit.com). Le flux de travail des applications mobiles — création par Agent, aperçus Expo Go, tests sur simulateur et émulateur, builds TestFlight et soumission à l'App Store — s'exécute dans l'Éditeur de projet.

Le travail sur les applications mobiles natives est également disponible dans l'[application Replit Android](/references/platforms/mobile-app) où cela est pris en charge. Si vous utilisez l'application Replit iOS, ouvrez le projet sur [replit.com](https://replit.com) pour créer, prévisualiser, construire ou soumettre des applications mobiles natives.

## Fonctionnement de la technologie

Votre application mobile est construite avec une pile de technologies qui fonctionnent ensemble. Cette section explique ce qui alimente votre application et comment les éléments s'assemblent.

### La pile technologique

<MobileStackDiagram />

* **React Native** est un framework open source qui vous permet d'écrire une seule base de code et de la compiler pour iOS, Android et le web. Il rend des composants d'interface utilisateur natifs à la plateforme, pas une webview.
* **Expo** simplifie le développement React Native en gérant les builds, les modules natifs, et en fournissant des outils comme Expo Go pour les aperçus.
* **Expo Go** est une application gratuite que vous installez sur votre téléphone. Elle exécute votre aperçu de développement afin que vous puissiez tester sur un vrai appareil sans construire un binaire natif complet.

Lorsque vous exécutez votre application, le bundler Metro compile votre code et le pousse vers votre appareil. La première construction prend plus de temps car il n'y a pas de cache. Les constructions suivantes sont plus rapides.

### Architecture : serveur et client

Lorsque vous préparez une application mobile pour un aperçu ou une distribution, vous travaillez avec deux éléments :

1. **Un serveur** qui s'exécute sur Replit dans le cloud. Il gère votre base de données, les routes API, les intégrations IA et la logique backend.
2. **Une application cliente** qui s'exécute sur le téléphone d'une personne. Il s'agit de l'application native prévisualisée dans Expo Go pendant le développement ou distribuée via les app stores après révision.

<MobileArchitectureDiagram />

Cette séparation vous offre de la flexibilité. Vous pouvez exécuter une logique complexe sur le serveur (où vous avez accès à la base de données, au stockage d'objets et aux connecteurs de Replit) et garder le client léger. Au fur et à mesure de votre développement, réfléchissez à ce qui doit se passer sur le téléphone et à ce qui doit se passer dans le cloud.

## Considérations

* **Exigences de publication** : Apple définit les conditions pour TestFlight et l'App Store, et Apple révise les applications iOS avant leur distribution.
* **Publication Android** : Vous pouvez créer des applications multiplateformes pour iOS et Android. La publication sur Google Play n'est pas encore prise en charge via une expérience guidée, mais peut être effectuée manuellement.
* **Modifications natives** : Les modifications telles que les icônes d'application ou les autorisations nécessitent généralement un nouveau build pour le store.

## Dépannage

Si vous rencontrez des problèmes lors du développement de votre application mobile, consultez [Dépannage des applications mobiles](/fr/references/troubleshooting/mobile-app) pour les problèmes courants et leurs solutions.

## Étapes suivantes

* Découvrez comment Agent fonctionne : [Agent](/fr/references/agent/overview)
* Explorez les intégrations : [Intégrations](/references/integrations/overview)
* Utilisez Replit sur mobile : [Application mobile Replit](/references/platforms/mobile-app)
* En savoir plus sur Expo : [Expo](https://expo.dev/)
* Gérez TestFlight et les soumissions : [App Store Connect](https://appstoreconnect.apple.com/)

## FAQ

<AccordionGroup>
  <Accordion title="Qu'est-ce qu'Expo ?">
    Expo est ce qu'Agent utilise pour construire votre application mobile sur Replit. Il s'agit d'une plateforme et d'une chaîne d'outils open source pour créer, exécuter et déployer des applications natives multiplateformes avec React Native. En savoir plus sur [https://expo.dev](https://expo.dev).
  </Accordion>

  <Accordion title="Qu'est-ce que React Native ?">
    React Native est un framework open source de Meta pour créer des applications iOS et Android natives en utilisant React et JavaScript ou TypeScript. Il rend des composants d'interface utilisateur natifs à la plateforme (pas une webview), de sorte que votre application a l'apparence et le comportement d'une application native.
  </Accordion>

  <Accordion title="Qu'est-ce qu'Expo Go ?">
    Expo Go est une application gratuite que vous installez sur votre téléphone depuis l'App Store ou Google Play. Elle vous permet de prévisualiser votre application mobile pendant le développement sans construire un binaire natif complet. Lorsque vous scannez le QR code dans l'Éditeur de projet, Expo Go télécharge et exécute le code de votre application.
  </Accordion>

  <Accordion title="Quelle est la différence entre Expo Go et un dev build ?">
    **Expo Go** est une application préconstruite qui exécute votre code. Elle est rapide à configurer mais ne prend en charge que les modules inclus dans le SDK Expo.

    Les **dev builds** sont des binaires natifs personnalisés qui peuvent inclure n'importe quel module natif. Ils nécessitent plus de configuration (EAS Build ou Xcode/Android Studio local) mais offrent plus de flexibilité.

    Replit utilise Expo Go pour les aperçus de développement. Si vous avez besoin de modules natifs non pris en charge dans Expo Go, vous devrez peut-être explorer les dev builds via la [documentation d'Expo](https://docs.expo.dev/develop/development-builds/introduction/).
  </Accordion>

  <Accordion title="En quoi est-ce différent d'une application web responsive sur mobile ?">
    Une application web responsive sur mobile est un site web qui adapte sa mise en page dans le navigateur. Une application React Native est une application native installée sur l'appareil qui utilise les API de la plateforme (caméra, haptiques, notifications push), offre un meilleur accès au matériel et aux capacités hors ligne, et est distribuée via les app stores. Le web responsive peut être idéal pour la portée et l'absence d'installation ; le natif est préférable lorsque vous avez besoin des fonctionnalités de l'appareil, de performances élevées ou d'une distribution via l'App Store.
  </Accordion>

  <Accordion title="Ai-je besoin d'un Mac ou de Xcode ?">
    Non. Replit et Expo gèrent le processus de construction dans le cloud.
  </Accordion>

  <Accordion title="Puis-je prévisualiser sans compte Apple Developer ?">
    Oui. Vous pouvez prévisualiser dans le Simulateur iOS de l'Éditeur de projet ou avec Expo Go sur votre téléphone. Vous n'avez besoin d'un compte Apple Developer que lorsque vous êtes prêt à soumettre à TestFlight ou à l'App Store.
  </Accordion>

  <Accordion title="Android est-il pris en charge ?">
    Oui. Vous pouvez créer des applications multiplateformes pour iOS et Android à partir de la même base de code. Prévisualisez sur un Émulateur Android dans l'Éditeur de projet ou sur un appareil Android avec Expo Go. La publication sur Google Play peut être effectuée manuellement.
  </Accordion>

  <Accordion title="Qu'en est-il des serveurs et des bases de données ?">
    Utilisez le PostgreSQL intégré, le stockage d'objets, les connecteurs et les intégrations IA de Replit — aucune infrastructure séparée n'est requise. Votre serveur s'exécute sur Replit et votre application mobile s'y connecte.
  </Accordion>

  <Accordion title="Dois-je tester dans le simulateur de l'Éditeur de projet ou sur un vrai téléphone ?">
    Utilisez les deux à différents moments. Le **Simulateur iOS** et l'**Émulateur Android** dans l'Éditeur de projet affichent la version native de votre application et couvrent la plupart des tests quotidiens — mise en page, navigation, composants natifs et style de plateforme. Passez à un vrai téléphone avec **Expo Go** lorsque vous devez tester des fonctionnalités qui dépendent du matériel réel, comme la caméra, les haptiques, les notifications push ou la localisation GPS.
  </Accordion>
</AccordionGroup>