Skip to main content

GitHub Repository

Expo, React Native और Dodo Payments boilerplate।

अवलोकन

Expo boilerplate एक काम करने वाला Expo app है, जो Dodo Payments hosted checkout के ज़रिए subscription plan बेचता है। इसके दो भाग हैं: TypeScript में बना Expo Router app और server/ में बना एक छोटा Express server, जो आपकी API key से checkout sessions बनाता है। app server से checkout URL मांगता है, उसे expo-web-browser के साथ system browser में खोलता है और deep link के ज़रिए परिणाम प्राप्त करता है।
Boilerplate में Expo SDK 54, Expo Router और TypeScript का उपयोग किया गया है। API key server पर रहती है। app को केवल server का URL पता होता है।

पूर्वापेक्षाएँ

  • Node.js 18 या उसके बाद का संस्करण।
  • Expo CLI या EAS CLI।
  • product वाला Dodo Payments account। Dashboard में Products के अंतर्गत product बनाएं।
  • iOS Simulator, Android Emulator या physical device।

त्वरित प्रारंभ

1

Clone the Repository

Boilerplate repository को clone करें और project directory में जाएं:
2

Get Your API Credentials

Test mode में Dodo Payments dashboard से अपनी API key प्राप्त करें:
  • API Key: अपने dashboard में Developer → API Keys पर जाएं।
Test mode में build करें, जो वास्तविक धन स्थानांतरित किए बिना payments का simulation करता है।
3

Configure Environment Variables

app और server, दोनों अपनी-अपनी .env file पढ़ते हैं। दोनों example files को copy करें:
server/.env में अपनी API key जोड़ें। DODOPAYMENTS_RETURN_URL को app.json की scheme का उपयोग करना चाहिए, जो boilerplate में dodoexpo है:
server/.env
Root .env में EXPO_PUBLIC_BACKEND_URL को server के URL पर set करें, उदाहरण के लिए http://localhost:3000। app checkout requests को EXPO_PUBLIC_BACKEND_URL/checkout पर भेजता है।फिर server/server.js खोलें और your-product-id को अपने product की ID से replace करें। Product IDs की शुरुआत pdt_ से होती है।
अपनी .env files को version control में कभी commit न करें। Root .gitignore पहले से ही .env को exclude करता है।Dodo Payments API key को कभी भी EXPO_PUBLIC_* variable में न रखें। Expo इन variables को JavaScript bundle में embed करता है, इसलिए आपका app download करने वाला कोई भी व्यक्ति उन्हें पढ़ सकता है। Key को server पर रखें, जैसा boilerplate करता है, और app को केवल परिणामी checkout_url भेजें। Mobile Integration देखें।
4

Install Dependencies

app और server के लिए packages install करें:
5

Start the Development Server

एक terminal में backend शुरू करें, फिर दूसरे terminal में Expo शुरू करें:
iOS Simulator के लिए i या Android Emulator के लिए a दबाएँ, या अपने डिवाइस पर QR code स्कैन करें। प्रोजेक्ट में expo-dev-client शामिल है, और dodoexpo:// return link के लिए आपके ऐप की अपनी scheme आवश्यक है, इसलिए Expo Go के बजाय ऐप को development build (npx expo run:ios या npx expo run:android) में चलाएँ।Physical device आपके computer पर localhost तक नहीं पहुंच सकता। Device पर test करने के लिए EXPO_PUBLIC_BACKEND_URL को अपने computer के local network address पर set करें, उदाहरण के लिए http://192.168.1.10:3000।
Home screen पर checkout button वाला plan card दिखाई देता है। Checkout खोलने के लिए उसे tap करें, test card 4242 4242 4242 4242 से pay करें और app अपना payment result screen खोल देता है।

इसमें क्या शामिल है

Boilerplate में शामिल हैं:

Checkout Integration

एक demo server, जो checkout sessions बनाता है, और एक app service, जो उन्हें request और open करती है।

Payment Handling

एक result screen, जो dodoexpo://payment/result deep link से status पढ़ती है और success या failure दिखाती है।

TypeScript Support

Checkout request और response के लिए types वाली TypeScript configuration।

Expo Router

Expo Router के साथ file-based navigation, जिसमें tab layout और payment result route शामिल हैं।

Project Structure

Repository में मुख्य files ये हैं:

अगले चरण

Boilerplate चलने के बाद:
1

Create Your Products

अपने Dodo Payments dashboard में products जोड़ें और उनकी IDs को server/server.js में उपयोग करें।
2

Customize the Integration

config/product.ts में plan text बदलें और app.json में app name, scheme और bundle identifiers बदलें। यदि आप scheme बदलते हैं, तो मेल खाने के लिए DODOPAYMENTS_RETURN_URL को update करें।
3

Test on Real Devices

Physical iOS और Android devices पर payment flow और deep-link return को test करें।
4

Go Live

Demo server को अपने ऐसे backend से replace करें, जो users को authenticate करता हो और webhooks से access प्रदान करता हो। फिर live mode API key पर switch करें और production के लिए अपना app build करें।

Production के लिए Building

EAS Build के साथ store-ready binaries build करें:
1

Install EAS CLI

2

Configure EAS

Repository में eas.json नहीं है। यह command इसे बनाती है:
3

Build Your App

iOS के लिए:
Android के लिए:

अतिरिक्त Resources

Mobile Integration Guide

Mobile checkout SDKs, deep-link setup और mobile checkout settings।

Integration Guide

Checkout sessions, payment links और webhooks।

API Reference

हर Dodo Payments API endpoint।

Support

Boilerplate के लिए सहायता पाने हेतु:
अंतिम संशोधन 26 सितंबर 2026