Hoppa till huvudinnehåll

GitHub Repository

Komplett Expo + React Native + Dodo Payments-boilerplate

​
Översikt

En produktionsklar boilerplate för att integrera Dodo Payments i Expo/React Native-applikationer. Denna mall inkluderar skapande av checkout-sessioner, betalningshantering och korrekt TypeScript-konfiguration för att hjälpa dig att snabbt börja ta emot betalningar i din mobilapp.
Detta boilerplate använder Expo SDK med TypeScript och inkluderar exempelimplementationer för kassasessioner och betalningshantering.

​
Förutsättningar

  • Node.js 18+
  • Expo CLI eller EAS CLI
  • Dodo Payments-konto (API-nyckel från instrumentpanelen)
  • iOS Simulator eller Android Emulator (eller fysisk enhet)

​
Snabbstart

1

Clone the Repository

Klona boilerplate-förvaret och gå till projektkatalogen:
git clone https://github.com/dodopayments/expo-boilerplate.git
cd expo-boilerplate
2

Get Your API Credentials

Hämta dina uppgifter från Dodo Payments-instrumentpanelen i Testläge:
  • API-nyckel: Navigera till Utvecklare → API-nycklar i din instrumentpanel
Börja i Testläge för att säkert testa din integration utan att hantera riktiga betalningar.
3

Configure Environment Variables

Skapa en .env-fil i rotkatalogen:
touch .env
Lägg till dina Dodo Payments-referenser:
.env
EXPO_PUBLIC_DODO_API_KEY=your_test_api_key_here
Begå aldrig din .env-fil till versionshantering. Den ingår redan i .gitignore.
4

Install Dependencies

Installera de nödvändiga npm-paketen:
npm install
5

Start the Development Server

Starta Expo-utvecklingsservern:
npx expo start
Skanna QR-koden med Expo Go-appen på din enhet, eller tryck i för iOS-simulatorn eller a för Android-emulatorn.
Du är redo att börja bygga! Boilerplaten innehåller exempel på skärmar och komponenter som hjälper dig förstå integrationen.

​
Vad som ingår

Boilerplate kommer med förkonfigurerade nödvändigheter:

Checkout Integration

Exempelimplementation för att skapa och hantera kassasessioner

Payment Handling

Komplett betalflöde med hantering av framgång och fel

TypeScript Support

Fullständig TypeScript-konfiguration med korrekta typdefinitioner

Expo Router

Navigationsuppsättning med Expo Router för smidig routning

​
Projektstruktur

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

​
Nästa Steg

När du har boilerplate igång:
1

Create Your Products

Lägg till produkter i din Dodo Payments dashboard för att aktivera kassafunktionalitet.
2

Customize the Integration

Anpassa exempel-koden så att den matchar din applikations behov och design.
3

Test on Real Devices

Testa betalflödet på fysiska enheter för att säkerställa att allt fungerar korrekt.
4

Go Live

När du är redo, byt till Live Mode API-nycklar och bygg din app för produktion.

​
Bygga för Produktion

1

Install EAS CLI

npm install -g eas-cli
2

Configure EAS

eas build:configure
3

Build Your App

För iOS:
eas build --platform ios
För Android:
eas build --platform android

​
Ytterligare Resurser

Mobile Integration Guide

Detaljerad guide för att implementera betalningar i mobilappar

React Native Integration

React Native-specifik integrationsdokumentation

Integration Guide

Detaljerad guide för att implementera engångsbetalningar

API Reference

Utforska hela Dodo Payments API-dokumentationen

​
Support

Behöver du hjälp med boilerplate?