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

# Expo Boilerplate

> Costruisci app mobili React Native con Dodo Payments utilizzando il nostro boilerplate Expo. Include integrazione del checkout, gestione dei pagamenti e supporto per TypeScript.

<Card title="GitHub Repository" icon="github" href="https://github.com/dodopayments/expo-boilerplate">
  Boilerplate completo Expo + React Native + Dodo Payments
</Card>

## Panoramica

Un boilerplate pronto per la produzione per integrare Dodo Payments nelle applicazioni Expo/React Native. Questo template include la creazione di sessioni di checkout, gestione dei pagamenti e una corretta configurazione di TypeScript per aiutarti a iniziare ad accettare pagamenti nella tua app mobile rapidamente.

<Info>
  Questo boilerplate utilizza Expo SDK con TypeScript e include implementazioni di esempio per sessioni di checkout e gestione dei pagamenti.
</Info>

<Frame>
  <iframe className="w-full aspect-video rounded-md" src="https://www.youtube.com/embed/78N1qw14m0Y" title="Expo Boilerplate Demo | Dodo Payments" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />
</Frame>

## Requisiti

* Node.js 18+
* Expo CLI o EAS CLI
* Account Dodo Payments (chiave API dal dashboard)
* Simulatore iOS o Emulatore Android (o dispositivo fisico)

## Avvio Veloce

<Steps>
  <Step title="Clone the Repository">
    Clona il repository del boilerplate e entra nella directory del progetto:

    ```bash theme={null}
    git clone https://github.com/dodopayments/expo-boilerplate.git
    cd expo-boilerplate
    ```
  </Step>

  <Step title="Get Your API Credentials">
    Ottieni le tue credenziali dalla dashboard di Dodo Payments in Modalità Test:

    * **Chiave API**: Naviga su **Sviluppatore → Chiavi API** nel tuo [dashboard](https://app.dodopayments.com)

    <Tip>
      Inizia con la Modalità Test per testare l’integrazione in modo sicuro senza processare pagamenti reali.
    </Tip>
  </Step>

  <Step title="Configure Environment Variables">
    Crea un file `.env` nella directory principale:

    ```bash theme={null}
    touch .env
    ```

    Aggiungi le tue credenziali Dodo Payments:

    ```bash .env theme={null}
    EXPO_PUBLIC_DODO_API_KEY=your_test_api_key_here
    ```

    <Warning>
      Non includere mai il tuo file `.env` nel controllo versione. È già incluso in `.gitignore`.
    </Warning>
  </Step>

  <Step title="Install Dependencies">
    Installa i pacchetti npm richiesti:

    ```bash theme={null}
    npm install
    ```
  </Step>

  <Step title="Start the Development Server">
    Avvia il server di sviluppo Expo:

    ```bash theme={null}
    npx expo start
    ```

    Scansiona il codice QR con l’app Expo Go sul tuo dispositivo, oppure premi `i` per il simulatore iOS o `a` per l’emulatore Android.

    <Check>
      Sei pronto per iniziare a costruire! Il boilerplate include schermate ed elementi di esempio per aiutarti a comprendere l’integrazione.
    </Check>
  </Step>
</Steps>

## Cosa è Incluso

Il boilerplate viene fornito con essenziali pre-configurati:

<CardGroup cols={2}>
  <Card title="Checkout Integration" icon="shopping-cart">
    Implementazione di esempio per creare e gestire sessioni di checkout
  </Card>

  <Card title="Payment Handling" icon="credit-card">
    Flusso di pagamento completo con gestione di successi ed errori
  </Card>

  <Card title="TypeScript Support" icon="code">
    Configurazione TypeScript completa con definizioni di tipi corrette
  </Card>

  <Card title="Expo Router" icon="route">
    Configurazione della navigazione con Expo Router per routing fluido
  </Card>
</CardGroup>

## Struttura del Progetto

```
expo-boilerplate/
├── app/
│   ├── (tabs)/
│   │   └── index.tsx          # Home screen with examples
│   └── checkout.tsx           # Checkout screen
├── components/
│   └── PaymentButton.tsx      # Payment button component
├── lib/
│   └── dodo.ts                # Dodo Payments client setup
├── .env.example               # Environment variables template
└── package.json
```

## Prossimi Passi

Una volta che hai il boilerplate in esecuzione:

<Steps>
  <Step title="Create Your Products">
    Aggiungi i prodotti nella tua [dashboard di Dodo Payments](https://app.dodopayments.com) per abilitare la funzionalità di checkout.
  </Step>

  <Step title="Customize the Integration">
    Adatta il codice di esempio alle esigenze e al design della tua applicazione.
  </Step>

  <Step title="Test on Real Devices">
    Testa il flusso di pagamento su dispositivi fisici per assicurarti che tutto funzioni correttamente.
  </Step>

  <Step title="Go Live">
    Quando sei pronto, passa alle chiavi API della Modalità Live e compila la tua app per la produzione.
  </Step>
</Steps>

## Costruire per la Produzione

<Steps>
  <Step title="Install EAS CLI">
    ```bash theme={null}
    npm install -g eas-cli
    ```
  </Step>

  <Step title="Configure EAS">
    ```bash theme={null}
    eas build:configure
    ```
  </Step>

  <Step title="Build Your App">
    Per iOS:

    ```bash theme={null}
    eas build --platform ios
    ```

    Per Android:

    ```bash theme={null}
    eas build --platform android
    ```
  </Step>
</Steps>

## Risorse Aggiuntive

<CardGroup cols={2}>
  <Card title="Mobile Integration Guide" icon="mobile" href="/developer-resources/mobile-integration">
    Guida dettagliata per implementare pagamenti nelle app mobili
  </Card>

  <Card title="React Native Integration" icon="react" href="/developer-resources/react-native-integration">
    Documentazione specifica per l’integrazione con React Native
  </Card>

  <Card title="Integration Guide" icon="book" href="/developer-resources/integration-guide">
    Guida dettagliata per implementare pagamenti una tantum
  </Card>

  <Card title="API Reference" icon="brackets-curly" href="/api-reference/introduction">
    Esplora la documentazione completa delle API di Dodo Payments
  </Card>
</CardGroup>

## Supporto

Hai bisogno di aiuto con il boilerplate?

* Unisciti alla nostra [comunità Discord](https://discord.gg/bYqAp4ayYh) per domande e discussioni
* Controlla il [repository GitHub](https://github.com/dodopayments/expo-boilerplate) per problemi e aggiornamenti
* Contatta il nostro [team di supporto](mailto:support@dodopayments.com) per assistenza