React Native SDK বেসিক ইন্টিগ্রেশন গাইড

এই বিভাগে আপনার অ্যাপ্লিকেশনে Pushwoosh React Native SDK কীভাবে ইন্টিগ্রেট করতে হয় সে সম্পর্কে তথ্য রয়েছে।

পূর্বশর্ত

আপনার অ্যাপে Pushwoosh React Native SDK ইন্টিগ্রেট করার জন্য, আপনার নিম্নলিখিত জিনিসগুলির প্রয়োজন হবে:

প্রয়োজনীয়তা

• একটি Pushwoosh অ্যাকাউন্ট।
• আপনার অ্যাকাউন্টে একটি Pushwoosh প্রজেক্ট সেট আপ করা।
• iOS ইন্টিগ্রেশনের জন্য:
  • পুশ নোটিফিকেশন পাঠানোর জন্য কনফিগার করা একটি iOS প্ল্যাটফর্ম। আমরা সবচেয়ে সহজ পদ্ধতি হিসাবে টোকেন-ভিত্তিক প্রমাণীকরণ কনফিগারেশন ব্যবহার করার সুপারিশ করি।
  • সিমুলেটরে পুশ পাঠানোর জন্য গেটওয়ে Sandbox-এ সেট করুন।
• Android ইন্টিগ্রেশনের জন্য:
  • একটি কনফিগার করা Android প্ল্যাটফর্ম
  • আপনার Firebase প্রজেক্ট থেকে প্রজেক্ট নম্বর (Sender ID নামেও পরিচিত), google-services.json ফাইল এবং প্যাকেজের নাম।
  • আপনার Android অ্যাপ্লিকেশনের সাথে সংযুক্ত একটি Firebase প্রজেক্ট। প্রয়োজনে Firebase সেটআপ গাইড অনুসরণ করুন।
• আপনার অ্যাপ্লিকেশনের জন্য Pushwoosh কন্ট্রোল প্যানেল থেকে আপনার Pushwoosh অ্যাপ্লিকেশন কোড এবং Pushwoosh ডিভাইস API টোকেন।

ইন্টিগ্রেশন ধাপ

১. Pushwoosh React Native SDK ডিপেন্ডেন্সি যোগ করুন

আপনার প্রজেক্টে Pushwoosh React Native SDK ডিপেন্ডেন্সি যোগ করুন:

npm install pushwoosh-react-native-plugin --save

২. React Native SDK ইনিশিয়ালাইজেশন

আপনার index.js ফাইলের রুট কম্পোনেন্টে:

• pushwoosh-react-native-plugin ইম্পোর্ট করুন।
• Pushwoosh SDK ইনিশিয়ালাইজ করুন।
• পুশ নোটিফিকেশনের জন্য রেজিস্টার করতে আপনার ইনিশিয়ালাইজেশন লজিকে register() কল করুন।

index.js

import Pushwoosh from 'pushwoosh-react-native-plugin';

AppRegistry.registerComponent(appName, () => App);

Pushwoosh.init({
    "pw_appid" : "__YOUR_APP_ID__" ,
    "project_number" : "__YOUR_FCM_SENDER_ID__"
});

Pushwoosh.register();

যেখানে:

• __YOUR_APP_ID__ হল Pushwoosh কন্ট্রোল প্যানেল থেকে অ্যাপ্লিকেশন কোড।
• __YOUR_FCM_SENDER_ID__ হল Firebase কনসোল থেকে Firebase প্রজেক্ট নম্বর।

৩. iOS নেটিভ সেটআপ

৩.১ Capabilities

আপনার প্রজেক্টে পুশ নোটিফিকেশন সক্রিয় করতে, আপনাকে কিছু capabilities যোগ করতে হবে।

Signing & Capabilities বিভাগে, নিম্নলিখিত capabilities যোগ করুন:

• Push Notifications
• Background Modes। এই capability যোগ করার পর, Remote notifications-এর জন্য বক্সটি চেক করুন।

আপনি যদি টাইম সেনসিটিভ নোটিফিকেশন (iOS 15+) ব্যবহার করতে চান, তাহলে Time Sensitive Notifications capability-টিও যোগ করুন।

৩.২ Info.plist

আপনার Runner/Info.plist-এ __PUSHWOOSH_DEVICE_API_TOKEN__ কী-টি Pushwoosh ডিভাইস API টোকেন-এ সেট করুন:

info.plist

<key>Pushwoosh_API_TOKEN</key>
<string>__PUSHWOOSH_DEVICE_API_TOKEN__</string>

৩.৩ মেসেজ ডেলিভারি ট্র্যাকিং

আপনাকে অবশ্যই আপনার প্রজেক্টে একটি নোটিফিকেশন সার্ভিস এক্সটেনশন টার্গেট যোগ করতে হবে। এটি সঠিক ডেলিভারি ট্র্যাকিং এবং iOS-এ রিচ মিডিয়ার মতো বৈশিষ্ট্যগুলির জন্য অপরিহার্য।

এক্সটেনশন টার্গেট এবং এর মধ্যে প্রয়োজনীয় Pushwoosh কোড যোগ করতে নেটিভ গাইডের ধাপগুলি অনুসরণ করুন।

৩.৪ iOS React Native প্রজেক্টের জন্য ডিপেন্ডেন্সি ইনস্টল করা

iOS React Native প্রজেক্টের জন্য ডিপেন্ডেন্সি ইনস্টল করতে টার্মিনালে ios ফোল্ডারে নেভিগেট করুন এবং চালান:

pod install --repo-update

৪. Android নেটিভ সেটআপ

৪.১ ডিপেন্ডেন্সি ইনস্টল করুন

নিশ্চিত করুন যে প্রয়োজনীয় ডিপেন্ডেন্সি এবং প্লাগইনগুলি আপনার Gradle স্ক্রিপ্টে যোগ করা হয়েছে:

আপনার প্রজেক্ট-স্তরের build.gradle ডিপেন্ডেন্সিতে Google Services Gradle প্লাগইন যোগ করুন:

android/build.gradle

buildscript {
  dependencies {
    classpath 'com.google.gms:google-services:4.3.15'
  }
}

আপনার অ্যাপ-স্তরের build.gradle ফাইলে প্লাগইনটি প্রয়োগ করুন:

app/build.gradle

apply plugin: 'com.google.gms.google-services'

৪.২ Firebase কনফিগারেশন ফাইল যোগ করুন

আপনার প্রজেক্ট ডিরেক্টরিতে android/app ফোল্ডারের মধ্যে google-services.json ফাইলটি রাখুন।

৪.৩ Pushwoosh মেটাডেটা যোগ করুন

আপনার main/AndroidManifest.xml-এ <application> ট্যাগের ভিতরে Pushwoosh ডিভাইস API টোকেন যোগ করুন:

AndroidManifest.xml

<meta-data android:name="com.pushwoosh.apitoken" android:value="__YOUR_DEVICE_API_TOKEN__" />

গুরুত্বপূর্ণ: আপনার Pushwoosh কন্ট্রোল প্যানেলে টোকেনটিকে সঠিক অ্যাপে অ্যাক্সেস দিতে ভুলবেন না। আরও জানুন

৫. প্রজেক্টটি চালান

১. প্রজেক্টটি বিল্ড এবং রান করুন। ২. Pushwoosh কন্ট্রোল প্যানেলে যান এবং একটি পুশ নোটিফিকেশন পাঠান। ৩. আপনার অ্যাপে নোটিফিকেশনটি দেখতে পাওয়া উচিত।

বর্ধিত ইন্টিগ্রেশন

এই পর্যায়ে, আপনি ইতিমধ্যে SDK ইন্টিগ্রেট করেছেন এবং পুশ নোটিফিকেশন পাঠাতে ও গ্রহণ করতে পারেন। এখন, আসুন মূল কার্যকারিতা অন্বেষণ করি।

পুশ নোটিফিকেশন ইভেন্ট লিসেনার

Pushwoosh SDK-তে দুটি ইভেন্ট লিসেনার রয়েছে, যা পুশ নোটিফিকেশন পরিচালনার জন্য ডিজাইন করা হয়েছে:

• pushReceived ইভেন্টটি ট্রিগার হয়, যখন একটি পুশ নোটিফিকেশন পাওয়া যায়
• pushOpened ইভেন্টটি ট্রিগার হয়, যখন একজন ব্যবহারকারী একটি নোটিফিকেশন খোলেন

অ্যাপ্লিকেশন শুরু হওয়ার সময় SDK-এর ইনিশিয়ালাইজেশনের ঠিক পরেই আপনার এই ইভেন্ট লিসেনারগুলি সেট আপ করা উচিত:

import {DeviceEventEmitter} from 'react-native'
import Pushwoosh from 'pushwoosh-react-native-plugin';

class PushwooshNotificationHandler {
  setupPushListeners() {

    DeviceEventEmitter.addListener('pushReceived', (e) => {
      console.warn("Push received: " + JSON.stringify(e));
    });

    DeviceEventEmitter.addListener('pushOpened', (e) => {
      console.warn("Push accepted: " + JSON.stringify(e));
    });

  }
}

ব্যবহারকারী কনফিগারেশন

ব্যক্তিগত ব্যবহারকারীর আচরণ এবং পছন্দের উপর ফোকাস করে, আপনি ব্যক্তিগতকৃত সামগ্রী সরবরাহ করতে পারেন, যা ব্যবহারকারীর সন্তুষ্টি এবং আনুগত্য বাড়ায়।

import Pushwoosh from 'pushwoosh-react-native-plugin';

class Registration {
  afterUserLogin(user: User) {

    // ব্যবহারকারীর আইডি সেট করুন
    Pushwoosh.setUserId(user.getId());

    // ব্যবহারকারীর ইমেল সেট করুন
    Pushwoosh.setEmails(user.getEmailList());

    // ব্যবহারকারীর SMS নম্বর সেট করুন
    Pushwoosh.registerSMSNumber(user.getPhoneNumber());

    // ব্যবহারকারীর WhatsApp নম্বর সেট করুন
    Pushwoosh.registerWhatsappNumber(user.getWhatsAppNumber());

    // Pushwoosh-এর জন্য ট্যাগ হিসাবে অতিরিক্ত ব্যবহারকারীর তথ্য সেট করা হচ্ছে
    Pushwoosh.setTags({
      "age": user.getAge(),
      "name": user.getName(),
      "last_login": user.getLastLoginDate()
    });
  }
}

ট্যাগ

ট্যাগ হল ব্যবহারকারী বা ডিভাইসে নির্ধারিত কী-ভ্যালু পেয়ার, যা পছন্দ বা আচরণের মতো অ্যাট্রিবিউটের উপর ভিত্তি করে সেগমেন্টেশন করতে দেয়, ফলে টার্গেটেড মেসেজিং সম্ভব হয়।

import Pushwoosh from 'pushwoosh-react-native-plugin';

class UpdateUser {
  afterUserUpdateProfile(user: User) {

    // পছন্দের ক্যাটাগরির তালিকা সেট করুন
    Pushwoosh.setTags({
      "favorite_categories": user.getFavoriteCategoriesList()
    });

    // পেমেন্টের তথ্য সেট করুন
    Pushwoosh.setTags({
      "is_subscribed": user.isSubscribed(),
      "payment_status": user.getPaymentStatus(),
      "billing_address": user.getBillingAddress()
    });
  }
}

ইভেন্ট

ইভেন্ট হল অ্যাপের মধ্যে নির্দিষ্ট ব্যবহারকারীর ক্রিয়া বা ঘটনা যা আচরণ বিশ্লেষণ করতে এবং সংশ্লিষ্ট বার্তা বা ক্রিয়া ট্রিগার করতে ট্র্যাক করা যেতে পারে।

import Pushwoosh from 'pushwoosh-react-native-plugin';

class Registration {

  // লগইন ইভেন্ট ট্র্যাক করুন
  afterUserLogin(user: User) {
    Pushwoosh.postEvent("login", {
      "name": user.getName(),
      "last_login": user.getLastLoginDate()
    });
  }

  // ক্রয় ইভেন্ট ট্র্যাক করুন
  afterUserPurchase(product: Product) {
    Pushwoosh.postEvent("purchase", {
      "product_id": product.getId(),
      "product_name": product.getName(),
      "price": product.getPrice(),
      "quantity": product.getQuantity()
    });
  }
}

ট্রাবলশুটিং

ইন্টিগ্রেশন প্রক্রিয়া চলাকালীন আপনি যদি কোনো সমস্যার সম্মুখীন হন, অনুগ্রহ করে সাপোর্ট এবং কমিউনিটি বিভাগটি দেখুন।