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

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

## পূর্বশর্ত

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

<Aside type="note" title="প্রয়োজনীয়তা">
 - একটি [Pushwoosh অ্যাকাউন্ট](https://sso.pushwoosh.com/login)।
 - আপনার অ্যাকাউন্টে সেট আপ করা একটি [Pushwoosh প্রজেক্ট](/bn/product/first-steps/start-with-your-project/create-your-project)।
 - **iOS ইন্টিগ্রেশনের জন্য:**
    - পুশ নোটিফিকেশন পাঠানোর জন্য কনফিগার করা একটি iOS প্ল্যাটফর্ম। আমরা সবচেয়ে সহজ পদ্ধতি হিসাবে [টোকেন-ভিত্তিক প্রমাণীকরণ কনফিগারেশন](/bn/developer/first-steps/connect-messaging-services/ios-configuration/ios-token-based-configuration/) ব্যবহার করার সুপারিশ করি।
    - একটি সিমুলেটরে পুশ পাঠাতে গেটওয়ে `Sandbox`-এ সেট করুন।
 - **Android ইন্টিগ্রেশনের জন্য:**
    - একটি [কনফিগার করা Android প্ল্যাটফর্ম](/bn/developer/first-steps/connect-messaging-services/android-configuration/android-firebase-configuration)
    - আপনার Firebase প্রজেক্ট থেকে `google-services.json` ফাইল এবং `package name`।
    - আপনার Android অ্যাপ্লিকেশনের সাথে সংযুক্ত একটি Firebase প্রজেক্ট। প্রয়োজন হলে [Firebase সেটআপ গাইড](https://firebase.google.com/docs/android/setup#manually_add_firebase) অনুসরণ করুন।
 - আপনার অ্যাপ্লিকেশনের জন্য Pushwoosh কন্ট্রোল প্যানেল থেকে আপনার `Pushwoosh অ্যাপ্লিকেশন কোড` এবং [Pushwoosh ডিভাইস API টোকেন](/bn/developer/api-reference/api-access-token/#device-api-token)।
</Aside>

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

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

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

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

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

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

```javascript title="index.js"
import Pushwoosh from 'pushwoosh-react-native-plugin';

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

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

Pushwoosh.register();
```

যেখানে:
- `__YOUR_APP_ID__` হল Pushwoosh কন্ট্রোল প্যানেল থেকে অ্যাপ্লিকেশন কোড।


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

#### ৩.১ Capabilities

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

Signing & Capabilities বিভাগে, নিম্নলিখিত capabilities যোগ করুন:
- `Push Notifications`
- `Background Modes`। এই capability যোগ করার পর, `Remote notifications`-এর জন্য বক্সটি চেক করুন।

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

#### ৩.২ Info.plist

আপনার `Runner/Info.plist`-এ `__PUSHWOOSH_DEVICE_API_TOKEN__` কী-টি [Pushwoosh ডিভাইস API টোকেন](/bn/developer/api-reference/api-access-token/#device-api-token)-এ সেট করুন:
```swift title="info.plist"
<key>Pushwoosh_API_TOKEN</key>
<string>__PUSHWOOSH_DEVICE_API_TOKEN__</string>
```

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

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

এক্সটেনশন টার্গেট এবং এর মধ্যে প্রয়োজনীয় Pushwoosh কোড যোগ করতে [নেটিভ গাইডের ধাপগুলো](/bn/developer/pushwoosh-sdk/ios-sdk/setting-up-pushwoosh-ios-sdk/basic-integration-guide/#4-message-delivery-tracking) অনুসরণ করুন।

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

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

```bash
pod install --repo-update
```

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

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

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

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

```groovy title="android/build.gradle"
buildscript {
  dependencies {
    classpath 'com.google.gms:google-services:4.3.15'
  }
}
```

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

```groovy title="app/build.gradle"
apply plugin: 'com.google.gms.google-services'
```

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

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

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

আপনার `main/AndroidManifest.xml`-এ `<application>` ট্যাগের ভিতরে [Pushwoosh ডিভাইস API টোকেন](/bn/developer/api-reference/api-access-token/#device-api-token) যোগ করুন:

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

> **গুরুত্বপূর্ণ:** আপনার Pushwoosh কন্ট্রোল প্যানেলে টোকেনটিকে সঠিক অ্যাপে অ্যাক্সেস দিতে ভুলবেন না। [আরও জানুন](/bn/developer/api-reference/api-access-token/#edit-token)

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

১. প্রজেক্টটি বিল্ড করুন এবং চালান।
২. Pushwoosh কন্ট্রোল প্যানেলে যান এবং [একটি পুশ নোটিফিকেশন পাঠান](/bn/product/messaging-channels/push-notifications/send-push-notifications/one-time-push)।
৩. আপনার অ্যাপে নোটিফিকেশনটি দেখতে পাওয়া উচিত।

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

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

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

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

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

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

```javascript
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));
    });

  }
}
```

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

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

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

class Registration {
  afterUserLogin(user: User) {

    // Set user ID
    Pushwoosh.setUserId(user.getId());

    // Set user email
    Pushwoosh.setEmails(user.getEmailList());

    // Set user SMS number
    Pushwoosh.registerSMSNumber(user.getPhoneNumber());

    // Set user WhatsApp number
    Pushwoosh.registerWhatsappNumber(user.getWhatsAppNumber());

    // Setting additional user information as tags for Pushwoosh
    Pushwoosh.setTags({
      "age": user.getAge(),
      "name": user.getName(),
      "last_login": user.getLastLoginDate()
    });
  }
}
```

### ট্যাগ

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

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

class UpdateUser {
  afterUserUpdateProfile(user: User) {

    // Set list of favorite categories
    Pushwoosh.setTags({
      "favorite_categories": user.getFavoriteCategoriesList()
    });

    // Set payment information
    Pushwoosh.setTags({
      "is_subscribed": user.isSubscribed(),
      "payment_status": user.getPaymentStatus(),
      "billing_address": user.getBillingAddress()
    });
  }
}
```

### ইভেন্ট

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

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

class Registration {

  // Track login event
  afterUserLogin(user: User) {
    Pushwoosh.postEvent("login", {
      "name": user.getName(),
      "last_login": user.getLastLoginDate()
    });
  }

  // Track purchase event
  afterUserPurchase(product: Product) {
    Pushwoosh.postEvent("purchase", {
      "product_id": product.getId(),
      "product_name": product.getName(),
      "price": product.getPrice(),
      "quantity": product.getQuantity()
    });
  }
}
```

## সমস্যা সমাধান

ইন্টিগ্রেশন প্রক্রিয়ার সময় যদি আপনি কোনো সমস্যার সম্মুখীন হন, অনুগ্রহ করে [সাপোর্ট এবং কমিউনিটি](/bn/developer/pushwoosh-sdk/support-and-community) বিভাগটি দেখুন।