Vai al contenuto principale

GitHub Repository

Boilerplate completo Expo + React Native + Dodo Payments

​
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.
Questo boilerplate utilizza Expo SDK con TypeScript e include implementazioni di esempio per sessioni di checkout e gestione dei pagamenti.

​
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

1

Clone the Repository

Clona il repository del boilerplate e entra nella directory del progetto:
git clone https://github.com/dodopayments/expo-boilerplate.git
cd expo-boilerplate
2

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
Inizia con la Modalità Test per testare l’integrazione in modo sicuro senza processare pagamenti reali.
3

Configure Environment Variables

Crea un file .env nella directory principale:
touch .env
Aggiungi le tue credenziali Dodo Payments:
.env
EXPO_PUBLIC_DODO_API_KEY=your_test_api_key_here
Non includere mai il tuo file .env nel controllo versione. È già incluso in .gitignore.
4

Install Dependencies

Installa i pacchetti npm richiesti:
npm install
5

Start the Development Server

Avvia il server di sviluppo Expo:
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.
Sei pronto per iniziare a costruire! Il boilerplate include schermate ed elementi di esempio per aiutarti a comprendere l’integrazione.

​
Cosa è Incluso

Il boilerplate viene fornito con essenziali pre-configurati:

Checkout Integration

Implementazione di esempio per creare e gestire sessioni di checkout

Payment Handling

Flusso di pagamento completo con gestione di successi ed errori

TypeScript Support

Configurazione TypeScript completa con definizioni di tipi corrette

Expo Router

Configurazione della navigazione con Expo Router per routing fluido

​
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:
1

Create Your Products

Aggiungi i prodotti nella tua dashboard di Dodo Payments per abilitare la funzionalità di checkout.
2

Customize the Integration

Adatta il codice di esempio alle esigenze e al design della tua applicazione.
3

Test on Real Devices

Testa il flusso di pagamento su dispositivi fisici per assicurarti che tutto funzioni correttamente.
4

Go Live

Quando sei pronto, passa alle chiavi API della Modalità Live e compila la tua app per la produzione.

​
Costruire per la Produzione

1

Install EAS CLI

npm install -g eas-cli
2

Configure EAS

eas build:configure
3

Build Your App

Per iOS:
eas build --platform ios
Per Android:
eas build --platform android

​
Risorse Aggiuntive

Mobile Integration Guide

Guida dettagliata per implementare pagamenti nelle app mobili

React Native Integration

Documentazione specifica per l’integrazione con React Native

Integration Guide

Guida dettagliata per implementare pagamenti una tantum

API Reference

Esplora la documentazione completa delle API di Dodo Payments

​
Supporto

Hai bisogno di aiuto con il boilerplate?