# เริ่มต้นใช้งาน Capacitor SDK ฉบับย่อ

เริ่มต้นใช้งาน Pushwoosh Capacitor SDK ด้วยตัวอย่างที่ง่ายและรวดเร็วนี้

## ข้อกำหนดเบื้องต้น

ในการผสาน Pushwoosh Capacitor SDK เข้ากับแอปของคุณ คุณจะต้องมีสิ่งต่อไปนี้:

<TranslatedFragment id="prerequisites-plugins" />

## ดาวน์โหลดโปรเจกต์ตัวอย่าง

โคลน repository ของ SDK:
```bash
git clone https://github.com/Pushwoosh/pushwoosh-capacitor-plugin.git
```

ไปที่ไดเรกทอรีของปลั๊กอิน:
```bash
cd pushwoosh-capacitor-plugin
```

## สร้างปลั๊กอิน

ก่อนที่จะรันแอปตัวอย่าง คุณต้องสร้างปลั๊กอิน Capacitor ก่อน
ติดตั้ง dependencies ของปลั๊กอิน:
```bash
npm i
```

สร้างปลั๊กอิน:
```bash
npm run build
```

## กำหนดค่าแอปตัวอย่าง

ไปที่ไดเรกทอรีของแอปตัวอย่าง:

```bash
cd example
```

ติดตั้ง dependencies ของแอป:

```bash
npm i
```

สร้าง web assets:

```bash
npm run build
```

เปิด **src/js/example.js** และอัปเดตการเรียก `Pushwoosh.onDeviceReady`:

```javascript
Pushwoosh.onDeviceReady({
    appid: "__YOUR_APP_CODE__"
});
```

โดยที่:

`__YOUR_APP_CODE__` คือรหัสแอปพลิเคชันจาก Pushwoosh Control Panel

### iOS

###### 1. ติดตั้ง dependencies ของ CocoaPods

ไปที่ไดเรกทอรีแพลตฟอร์ม iOS และติดตั้ง dependencies ของ CocoaPods:
```bash
cd ios/App
pod install --repo-update
cd ../..
```

###### 2. ซิงค์ Capacitor กับ iOS

หลังจากติดตั้ง CocoaPods แล้ว ให้ซิงค์การกำหนดค่า Capacitor:

```bash
npx cap sync ios
```

###### 3. เปิดโปรเจกต์ iOS

เปิดโปรเจกต์ใน Xcode:

```bash
npx cap open ios
```

###### 4. ตั้งค่า Bundle Identifier

ใน Xcode ให้ตั้งค่า **Bundle Identifier** เป็นชื่อแพ็กเกจของแอปของคุณ (เช่น `com.example.pushwoosh`)

###### 5. เพิ่ม capabilities

เพื่อเปิดใช้งาน Push Notifications คุณต้องเพิ่ม capabilities บางอย่าง

ในส่วน `Signing & Capabilities` ให้เพิ่ม capabilities ต่อไปนี้:
- `Push Notifications`
- `Background Modes` หลังจากเพิ่ม capability นี้แล้ว ให้เลือกช่องสำหรับ `Remote notifications`

###### 6. ตั้งค่า API Token

เปิด `ios/App/App/Info.plist` ใน Xcode และเพิ่มรายการต่อไปนี้พร้อมกับ [Pushwoosh Device API Token](/th/developer/api-reference/api-access-token/#device-api-token) ของคุณ:

```xml title="Info.plist"
<key>Pushwoosh_API_TOKEN</key>
<string>__YOUR_PUSHWOOSH_DEVICE_API_TOKEN__</string>
```

### Android

###### 1. ซิงค์ Capacitor กับ Android

ซิงค์การกำหนดค่า Capacitor กับแพลตฟอร์ม Android:

```bash
npx cap sync android
```

###### 2. ตั้งค่า google-services.json

คัดลอกไฟล์ `google-services.json` ของคุณไปยังไดเรกทอรี **android/app**

###### 3. ตั้งค่าชื่อแพ็กเกจ

เปิด **android/app/build.gradle** และตั้งค่า **applicationId** เป็นชื่อแพ็กเกจของแอปของคุณ (เช่น `com.example.pushwoosh`)

###### 4. ตั้งค่า API Token

เปิดไฟล์ **android/app/src/main/AndroidManifest.xml** ของคุณและเพิ่ม metadata ต่อไปนี้ภายในแท็ก `<application>`:

```xml title="AndroidManifest.xml"
<meta-data android:name="com.pushwoosh.apitoken" android:value="__YOUR_PUSHWOOSH_DEVICE_API_TOKEN__" />
```
แทนที่ `__YOUR_PUSHWOOSH_DEVICE_API_TOKEN__` ด้วย [Pushwoosh Device API Token](/th/developer/api-reference/api-access-token/#device-api-token) ของคุณ

###### 5. เปิดโปรเจกต์ Android

เปิดโปรเจกต์ใน Android Studio:

```bash
npx cap open android
```

## รันโปรเจกต์

1. สร้างและรันโปรเจกต์
2. แตะปุ่ม **"Click Me!"**
3. ให้สิทธิ์สำหรับการแจ้งเตือนแบบพุช อุปกรณ์จะถูกลงทะเบียนกับ Pushwoosh

## ส่งการแจ้งเตือนแบบพุช

กลับไปที่ Pushwoosh Control Panel และ [ส่งการแจ้งเตือนแบบพุช](/th/product/messaging-channels/push-notifications/send-push-notifications/one-time-push) ไปยังอุปกรณ์ที่ลงทะเบียนไว้ของคุณ