> ## Documentation Index
> Fetch the complete documentation index at: https://docs-th.stardeck.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# การเชื่อมต่อ External APIs

> เรียนรู้วิธีการเชื่อมต่อ external APIs เช่น บริการสภาพอากาศ, แผนที่, email providers, และอื่นๆ เข้ากับแอปพลิเคชัน Stardeck ของคุณ

## ภาพรวม

ยกระดับแอปพลิเคชัน Stardeck ของคุณด้วยการเชื่อมต่อ external APIs สำหรับข้อมูลสภาพอากาศ, แผนที่, การแจ้งเตือนทางอีเมล, SMS, และบริการอื่นๆ คู่มือนี้ครอบคลุมการตั้งค่าบัญชี API, การกำหนดค่า credentials ใน Stardeck, และการใช้ AI agent เพื่อสร้างการเชื่อมต่อ

<Info>
  คู่มือนี้ใช้ weather API เป็นตัวอย่างหลัก แต่หลักการเดียวกันนี้ใช้ได้กับการเชื่อมต่อ external API ใดๆ
</Info>

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

ก่อนเริ่มต้น ตรวจสอบให้แน่ใจว่าคุณมี:

* โปรเจค Stardeck ที่ใช้งานอยู่
* ความคุ้นเคยกับ [environment variables](/environment-variables) ใน Stardeck
* บัญชีกับบริการ API ที่คุณต้องการใช้

## บริการ API ยอดนิยม

นี่คือ APIs ที่มักถูกนำมาเชื่อมต่อ:

* **Payment Gateways**: Stripe, Omise, PayPal - [ดูคู่มือการเชื่อมต่อการชำระเงินโดยละเอียด](/payment-gateways)
* **Weather**: OpenWeatherMap, WeatherAPI, Tomorrow\.io
* **Maps & Location**: Google Maps, Mapbox, OpenStreetMap
* **Email**: SendGrid, Mailgun, Resend
* **SMS**: Twilio, MessageBird, Vonage
* **AI/ML**: OpenAI, Anthropic, Google Gemini
* **Social Media**: Twitter API, Instagram API, LinkedIn API

<Note>
  สำหรับการเชื่อมต่อ payment gateways (Stripe, Omise) ดูที่ [คู่มือการเชื่อมต่อ Payment Gateway](/payment-gateways) ที่ครอบคลุมการประมวลผลบัตรเครดิต, webhooks, และ Thai QR payments
</Note>

## การตั้งค่า OpenWeatherMap (ตัวอย่าง)

เราจะใช้ OpenWeatherMap เป็นตัวอย่างสำหรับคู่มือนี้

### การสร้างบัญชี

1. ไปที่ [openweathermap.org](https://openweathermap.org) และคลิก **Sign In** หรือ **Sign Up**
2. ทำการลงทะเบียนให้เสร็จสมบูรณ์
3. ยืนยันที่อยู่อีเมลของคุณ
4. คุณจะถูกลงทะเบียนใน **Free tier** โดยอัตโนมัติ

<Note>
  Free tier รวม 1,000 API calls ต่อวัน ซึ่งเหมาะสำหรับการพัฒนาและแอปพลิเคชันขนาดเล็ก
</Note>

### การรับ API Key ของคุณ

1. หลังจากเข้าสู่ระบบ ไปที่หน้าบัญชีของคุณโดยคลิกที่ username ของคุณ
2. ไปที่แท็บ **API keys**
3. คุณจะเห็น API key เริ่มต้นที่สร้างไว้แล้ว หรือคุณสามารถสร้างใหม่ได้
4. คัดลอก API key ของคุณ (เริ่มต้นด้วย string ตัวอักษรและตัวเลขยาว)

<Warning>
  API keys อาจใช้เวลาสักครู่เพื่อเปิดใช้งานหลังจากสร้างบัญชี หากคุณได้รับข้อผิดพลาด authentication รอ 10-15 นาทีและลองอีกครั้ง
</Warning>

### ทำความเข้าใจขีดจำกัดของ API

* **Free tier**: 1,000 calls/วัน, 60 calls/นาที
* **Data**: สภาพอากาศปัจจุบัน, พยากรณ์อากาศ 5 วัน, แผนที่สภาพอากาศ
* **Updates**: ข้อมูลสภาพอากาศอัปเดตทุก 10 นาที

## การตั้งค่า APIs ทั่วไปอื่นๆ

### Google Maps API

1. ไปที่ [Google Cloud Console](https://console.cloud.google.com)
2. สร้างโปรเจคใหม่หรือเลือกที่มีอยู่
3. เปิดใช้งาน **Maps JavaScript API** และ **Geocoding API**
4. ไปที่ **Credentials** และสร้าง **API key**
5. จำกัด key โดย HTTP referrer (เพื่อความปลอดภัย)

### SendGrid (Email)

1. สมัครที่ [sendgrid.com](https://sendgrid.com)
2. ยืนยันที่อยู่อีเมลผู้ส่งของคุณ
3. ไปที่ **Settings** > **API Keys**
4. สร้าง API key พร้อมสิทธิ์ที่เหมาะสม
5. คัดลอก key (แสดงเพียงครั้งเดียว)

### Twilio (SMS)

1. สมัครที่ [twilio.com](https://www.twilio.com)
2. รับหมายเลขโทรศัพท์ทดลองฟรีของคุณ
3. หา **Account SID** และ **Auth Token** ของคุณใน dashboard
4. คัดลอกข้อมูลประจำตัวทั้งสอง

## การกำหนดค่า Environment Variables ใน Stardeck

เพิ่ม API credentials ของคุณไปยังโปรเจค Stardeck ของคุณเป็น environment variables

### การเพิ่ม API Keys

1. เปิดโปรเจคของคุณใน Stardeck dashboard
2. คลิกปุ่ม **Settings** (ไอคอนเฟือง)
3. ไปที่แท็บ **Environment Variables**

### การกำหนดค่า OpenWeatherMap

#### API Key (Non-Secret)

* **Key**: `WEATHER_API_KEY`
* **Value**: OpenWeatherMap API key ของคุณ
* **Secret Variable**: Off (ไม่เลือก)
* **Deployment Targets**: เลือก **Sandbox** สำหรับการทดสอบ

<Note>
  สำหรับ public APIs เช่นบริการสภาพอากาศ API keys สามารถเป็น non-secret หากมีการจำกัด rate ต่อ key สำหรับ production พิจารณาทำเครื่องหมายเป็น secret
</Note>

### การกำหนดค่า Google Maps

* **Key**: `GOOGLE_MAPS_API_KEY`
* **Value**: Google Maps API key ของคุณ
* **Secret Variable**: Off (สำหรับการใช้งานฝั่ง client) หรือ On (สำหรับฝั่ง server)
* **Deployment Targets**: เลือก **Sandbox**

### การกำหนดค่า SendGrid

* **Key**: `SENDGRID_API_KEY`
* **Value**: SendGrid API key ของคุณ (เริ่มต้นด้วย `SG.`)
* **Secret Variable**: On (เลือก) - เก็บ email API keys เป็น secret เสมอ
* **Deployment Targets**: เลือก **Sandbox**

### การกำหนดค่า Twilio

เพิ่มหลาย variables สำหรับ Twilio:

* **Key**: `TWILIO_ACCOUNT_SID`

* **Value**: Account SID ของคุณ

* **Secret Variable**: Off

* **Key**: `TWILIO_AUTH_TOKEN`

* **Value**: Auth Token ของคุณ

* **Secret Variable**: On (เลือก)

* **Key**: `TWILIO_PHONE_NUMBER`

* **Value**: หมายเลขโทรศัพท์ Twilio ของคุณ (เช่น +15551234567)

* **Secret Variable**: Off

<Success>
  API credentials ของคุณได้รับการกำหนดค่าแล้ว! Dev server จะรีสตาร์ทโดยอัตโนมัติเพื่อใช้การเปลี่ยนแปลงเหล่านี้
</Success>

## การใช้ AI Agent เพื่อสร้างการเชื่อมต่อ API

ตอนนี้คุณสามารถใช้ AI agent ของ Stardeck เพื่อสร้างการเชื่อมต่อ API ของคุณได้ นี่คือตัวอย่าง prompts สำหรับสถานการณ์ทั่วไป:

### แอปสภาพอากาศพร้อมสภาพปัจจุบัน

```
Build a weather app that shows current weather for any city.

Requirements:
- Search box where users can enter a city name
- Display current temperature, weather condition, humidity, and wind speed
- Use OpenWeatherMap API with WEATHER_API_KEY environment variable
- Show a weather icon matching the condition
- Handle invalid city names gracefully
```

### แดชบอร์ดสภาพอากาศพร้อมพยากรณ์

```
Create a weather dashboard for my local business showing the 5-day forecast.

Requirements:
- Display weather for my city (Bangkok) automatically
- Show 5-day forecast with daily high/low temperatures
- Use WEATHER_API_KEY to fetch data from OpenWeatherMap
- Update automatically every hour
- Show weather icons for each day
```

### บริการตามตำแหน่งพร้อมแผนที่

```
Add a store locator to my website with an interactive map.

Requirements:
- Display Google Map with markers for my 5 store locations
- Use GOOGLE_MAPS_API_KEY for the map
- Show store details (name, address, hours) when clicking markers
- Add a search box to find nearest store by address
- Mobile-responsive map
```

### การแจ้งเตือนทางอีเมล

```
Send confirmation emails to customers when they submit the contact form.

Requirements:
- Use SendGrid with SENDGRID_API_KEY to send emails
- Email template with our company logo and branding
- Include customer's message and contact details
- Send copy to our support email
- Handle send failures gracefully
```

### การแจ้งเตือน SMS

```
Send SMS notifications to customers when their order is ready for pickup.

Requirements:
- Use Twilio with TWILIO_ACCOUNT_SID and TWILIO_AUTH_TOKEN
- Send SMS from TWILIO_PHONE_NUMBER
- Message format: "Your order #[ORDER_ID] is ready for pickup at [LOCATION]"
- Store SMS delivery status in database
- Only send to valid phone numbers
```

### การเชื่อมต่อหลาย API

```
Build a travel planning tool that combines weather and map data.

Requirements:
- Let users search for a destination
- Show the location on Google Maps using GOOGLE_MAPS_API_KEY
- Display current weather and 5-day forecast using WEATHER_API_KEY
- Show nearby attractions on the map
- Save favorite destinations to database
```

### เคล็ดลับสำหรับการใช้ Prompt อย่างมีประสิทธิภาพ

1. **ตั้งชื่อ environment variables ให้ชัดเจน** - Agent จะใช้พวกเขาโดยอัตโนมัติ
2. **ระบุข้อมูลที่จะแสดง** - ชัดเจนเกี่ยวกับข้อมูลที่คุณต้องการแสดง
3. **กล่าวถึงการจัดการข้อผิดพลาด** - APIs สามารถล้มเหลว, timeout, หรือส่งข้อผิดพลาดกลับมา
4. **ขอการแคช** - พิจารณาขอให้แคช API responses เพื่อประหยัดต้นทุน
5. **ระบุความถี่** - ควรรีเฟรชข้อมูลบ่อยแค่ไหน?

<Info>
  AI agent เข้าใจรูปแบบ API ยอดนิยมและจะใช้การจัดการข้อผิดพลาด, rate limiting, และ best practices โดยอัตโนมัติ
</Info>

## การทดสอบการเชื่อมต่อของคุณ

### การทดสอบ Weather API

ทดสอบด้วยสถานการณ์ต่างๆ:

* **เมืองที่ถูกต้อง**: ลอง "London" หรือ "Bangkok"
* **เมืองที่ไม่ถูกต้อง**: ลอง "XYZ123" เพื่อทดสอบการจัดการข้อผิดพลาด
* **อักขระพิเศษ**: ลอง "São Paulo" เพื่อทดสอบการเข้ารหัส
* **ขีดจำกัด rate**: ทำ requests หลายๆ ครั้งอย่างรวดเร็วเพื่อทดสอบการจัดการ rate limit

### การทดสอบ Email/SMS APIs

สำหรับ SendGrid และ Twilio:

* ใช้อีเมล/โทรศัพท์ส่วนตัวของคุณในระหว่างการพัฒนา
* ตรวจสอบโฟลเดอร์ spam สำหรับอีเมลทดสอบ
* ตรวจสอบขีดจำกัดการเรียกใช้ API บน dashboard
* ทดสอบกับผู้รับที่ไม่ถูกต้องเพื่อตรวจสอบการจัดการข้อผิดพลาด

### การตรวจสอบการใช้งาน API

1. ตรวจสอบ dashboard ของผู้ให้บริการ API ของคุณเป็นประจำ
2. ตรวจสอบการใช้งานรายวันเทียบกับขีดจำกัด
3. ตั้งค่าการแจ้งเตือนสำหรับการใช้งานสูง
4. ตรวจสอบ error logs สำหรับ requests ที่ล้มเหลว

<Warning>
  ทดสอบอย่างละเอียดใน sandbox mode เสมอก่อน deploy ไปยัง production บาง APIs คิดค่าใช้จ่ายสำหรับการใช้งานเกิน free tiers
</Warning>

## Best Practices

### ความปลอดภัย

* **ทำเครื่องหมาย keys ที่ละเอียดอ่อนเป็น secret** - Email, SMS, และ payment APIs ควรเป็น secret เสมอ
* **จำกัด API keys** - ใช้การจำกัด HTTP referrer หรือ IP เมื่อมี
* **หมุนเวียน keys เป็นประจำ** - เปลี่ยน API keys เป็นระยะ
* **ห้าม commit keys ไปยัง git** - ใช้ environment variables เสมอ

### ประสิทธิภาพ

* **แคช API responses** - อย่าดึงข้อมูลเดียวกันซ้ำๆ
* **ใช้ rate limiting** - เคารพขีดจำกัดของผู้ให้บริการ API
* **ใช้ webhooks เมื่อมี** - มีประสิทธิภาพมากกว่าการ polling
* **จัดการข้อผิดพลาดอย่างเหมาะสม** - APIs สามารถไม่พร้อมใช้งานชั่วคราว

### การจัดการต้นทุน

* **ตรวจสอบการใช้งาน** - ตรวจสอบ dashboards เป็นประจำ
* **ตั้งขีดจำกัดการใช้จ่าย** - ใช้การแจ้งเตือนการเรียกเก็บเงิน
* **เลือก tier ที่เหมาะสม** - อัปเกรดเฉพาะเมื่อจำเป็น
* **เพิ่มประสิทธิภาพ requests** - ดึงเฉพาะสิ่งที่คุณต้องการ

## การเผยแพร่ด้วย Production

เมื่อคุณพร้อมที่จะเผยแพร่:

### การย้ายไปยัง Production

1. **อัปเกรดแผน API หากจำเป็น** - ตรวจสอบว่า free tier เพียงพอหรือไม่
2. **รับ production API keys** - หลายบริการมี prod keys แยกต่างหาก
3. **เพิ่ม production environment variables** ใน Stardeck
4. ตั้ง **Deployment Targets** เป็น **Production**
5. **กำหนดค่า webhooks** - อัปเดต webhook URLs ไปยังโดเมน production
6. **ทดสอบอย่างละเอียด** - ตรวจสอบการเชื่อมต่อ API ทั้งหมดทำงานใน production

### Production Checklist

* [ ] ได้รับ production API keys แล้ว
* [ ] กำหนดค่าวิธีการเรียกเก็บเงิน/การชำระเงินกับผู้ให้บริการ API
* [ ] ตั้งค่าการแจ้งเตือนการใช้งาน
* [ ] กำหนดค่า API keys ใน Stardeck production environment
* [ ] มีการตรวจสอบข้อผิดพลาดอยู่
* [ ] ขีดจำกัด rate เหมาะสมสำหรับ production traffic
* [ ] ตรวจสอบ webhook endpoints แล้ว
* [ ] เอกสารสำหรับสมาชิกในทีม

<Warning>
  Production API keys มีขีดจำกัด rate ที่แตกต่างกันและอาจเกิดค่าใช้จ่าย ตรวจสอบการใช้งานอย่างใกล้ชิดหลังจากเปิดตัว
</Warning>

## แหล่งข้อมูลเพิ่มเติม

### Weather APIs

* [OpenWeatherMap Documentation](https://openweathermap.org/api)
* [WeatherAPI Docs](https://www.weatherapi.com/docs/)

### Maps & Location

* [Google Maps Platform](https://developers.google.com/maps/documentation)
* [Mapbox Documentation](https://docs.mapbox.com/)

### Communication

* [SendGrid Documentation](https://docs.sendgrid.com/)
* [Twilio Documentation](https://www.twilio.com/docs)

### AI & ML

* [OpenAI API Documentation](https://platform.openai.com/docs)
* [Anthropic API Documentation](https://docs.anthropic.com/)

***

ต้องการความช่วยเหลือในการเชื่อมต่อ API? ติดต่อทีมสนับสนุนของเราผ่าน dashboard ของคุณหรือติดต่อที่ [support@stardeck.ai](mailto:support@stardeck.ai)
