telegram-badge
Version:
Generate Telegram group member count badges for GitHub README
270 lines (196 loc) • 13.3 kB
Markdown
# Telegram Group Badge Generator
[🇷🇺 Русский](README.ru.md) | [🇺🇸 English](README.md) | [🇨🇳 中文](README.zh.md) | [🇹🇭 ไทย](README.th.md) | [🇸🇦 العربية](README.ar.md) | [🇯🇵 日本語](README.ja.md) | [🇰🇷 한국어](README.ko.md)
[](https://github.com/chatman-media/telegram-badge/actions)
[](https://github.com/chatman-media/telegram-badge/actions)
[](https://www.npmjs.com/package/telegram-badge)
[](https://jsr.io/@chatman-media/telegram-badge)
[](https://bundlephobia.com/package/telegram-badge)
[](https://www.typescriptlang.org/)
[](https://opensource.org/licenses/MIT)
[](https://github.com/chatman-media/telegram-badge)
[](https://dev.to/chatman-media/show-your-telegram-group-member-count-in-github-readme-46pl)
[](https://x.com/chatman_media/status/1947399700795244694)
โปรเจ็กต์นี้สร้างป้าย SVG ที่แสดงจำนวนสมาชิกปัจจุบันของกลุ่ม Telegram ของคุณ เหมาะอย่างยิ่งสำหรับแสดงความคล่องแคล่วของชุมชนในไฟล์ README ของ GitHub หรือบนเว็บไซต์
## 🚀 เริ่มต้นอย่างรวดเร็ว
เพียงใช้พารามิเตอร์ URL เพื่อสร้างป้ายสำหรับช่องหรือกลุ่ม Telegram ใดๆ:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel
```
---
## 📦 เทคโนโลยีที่ใช้
- Node.js / TypeScript
- Telegram Bot API
- Vercel (Serverless API)
- Jest สำหรับการทดสอบ
---
## 🧩 วิธีใช้งาน
### วิธีหลัก: พารามิเตอร์ URL (ไม่ต้องตั้งค่า!)
เพียงเพิ่ม ID ช่อง/กลุ่ม Telegram ของคุณไปยัง URL:
```markdown
```
เพียงเท่านี้! ไม่ต้อง deploy ไม่ต้องใช้โทเค็นบอท
### วิธีทางเลือก: โฮสต์ด้วยตนเอง
สำหรับผู้ใช้ขั้นสูงที่ต้องการโฮสต์อินสแตนซ์ของตนเอง:
#### 1. ข้อกำหนดเบื้องต้น
- โทเค็นบอท Telegram (สร้างผ่าน [@BotFather](https://t.me/botfather))
- บัญชี Vercel (หรือโฮสติ้ง Node.js ใดๆ)
#### 2. Deploy ไปยัง Vercel
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fchatman-media%2Ftelegram-badge)
ตั้งค่าตัวแปรสภาพแวดล้อม:
- `BOT_TOKEN`: โทเค็นบอท Telegram ของคุณ
- `CHAT_ID`: ID แชทเริ่มต้น (ไม่จำเป็นหากใช้พารามิเตอร์ URL)
#### 3. การพัฒนาในเครื่อง
```bash
git clone https://github.com/chatman-media/telegram-badge.git
cd telegram-badge
npm install
# สร้างไฟล์ .env
echo "BOT_TOKEN=your_bot_token" > .env
echo "CHAT_ID=@your_channel" >> .env
npm run dev
```
### 🎨 พารามิเตอร์การปรับแต่ง
คุณสามารถปรับแต่งรูปลักษณ์ของป้ายได้โดยใช้พารามิเตอร์ต่อไปนี้:
| พารามิเตอร์ | คำอธิบาย | ค่าเริ่มต้น |
|-----------|-------------|---------------|
| `channelId` | ID หรือชื่อผู้ใช้ของแชท Telegram (เช่น `@timelinestudiochat`) | จากสภาพแวดล้อม |
| `style` | รูปแบบป้าย | `flat` |
| `label` | ข้อความป้ายกำกับ | `Telegram` |
| `color` | สีป้ายหลัก | `2AABEE` (สี Telegram) |
| `labelColor` | สีป้ายกำกับ | `555555` |
| `logo` | แสดงโลโก้ Telegram | `true` |
#### รูปแบบที่ใช้ได้:
- `flat` - รูปแบบเรียบ (เริ่มต้น)
- `plastic` - รูปแบบพลาสติกกับไล่ระดับสี
- `flat-square` - รูปแบบเรียบเหลี่ยมไม่มีมุมมน
- `for-the-badge` - รูปแบบกว้างกับตัวพิมพ์ใหญ่
- `social` - รูปแบบโซเชียลของ GitHub
#### ตัวอย่าง:
ป้ายมาตรฐาน (รูปแบบ flat):
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel
```
ป้ายกับรูปแบบ plastic:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=plastic
```
ป้ายกับรูปแบบ flat-square:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=flat-square
```
ป้ายกับรูปแบบ for-the-badge:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=for-the-badge
```
ป้ายกับรูปแบบ social:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=social
```
ป้ายกับป้ายกำกับและสีที่กำหนดเอง:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&label=เข้าร่วมแชท&color=00FF00
```
ป้ายที่ปรับแต่งเต็มรูปแบบ:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=for-the-badge&label=ชุมชน&color=FF5733&labelColor=1A1A1A
```
ป้ายไม่มีโลโก้:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&logo=false
```
ป้ายสำหรับช่องเฉพาะ:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel
```
ป้ายกับการปรับแต่งที่กำหนดเอง:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=for-the-badge&color=FF5733
```
## ✨ คุณสมบัติ
- 👥 แสดงจำนวนสมาชิกแบบเรียลไทม์
- 🔗 พารามิเตอร์ URL โดยตรง - ไม่ต้องตั้งค่า!
- 🎨 ปรับแต่งรูปลักษณ์ป้ายได้เต็มรูปแบบ
- 🔒 โฮสต์ด้วยตนเองแบบเลือกได้กับการจัดเก็บโทเค็นอย่างปลอดภัย
- ⚡ แคชที่ปรับปรุงแล้วสำหรับการโหลดที่รวดเร็ว
- 🛡️ การจัดการข้อผิดพลาดกับข้อความที่ให้ข้อมูล
- 🆓 ใช้งานฟรี
- 📡 สามารถขยายเพื่อแสดงกิจกรรม/จำนวนข้อความ
- 🧪 ชุดทดสอบที่ครอบคลุมกับ TypeScript
## 🔧 การใช้งาน API
### เป็นแพ็คเกจ npm:
```bash
npm install telegram-badge
```
```typescript
import badgeHandler from 'telegram-badge';
// ใช้ในเซิร์ฟเวอร์เลสฟังก์ชันของคุณ
export default badgeHandler;
```
### การเรียก API โดยตรง:
```typescript
GET /api/telegram-badge?style=flat&label=สมาชิก&color=2AABEE&labelColor=555555
```
## 🧪 การทดสอบ
รันแพ็คเกจทดสอบ:
```bash
npm test
```
รันการตรวจสอบประเภท:
```bash
npm run type-check
```
สร้างโปรเจ็กต์:
```bash
npm run build
```
## 🤝 การมีส่วนร่วม
1. Fork รีพอซิทอรี
2. สร้าง branch ฟีเจอร์ของคุณ (`git checkout -b feature/amazing-feature`)
3. Commit การเปลี่ยนแปลงของคุณ (`git commit -m 'Add some amazing feature'`)
4. Push ไปยัง branch (`git push origin feature/amazing-feature`)
5. เปิด Pull Request
## ติดตาม
[](https://www.tiktok.com/@chatman.media)
[](https://www.twitch.tv/chatman1984)
[](https://www.youtube.com/@chatman-media)
[](https://t.me/alexanderkireyev)
[](https://x.com/chatman_media)
## สนับสนุน 💝🚀
- **BTC:** 14s9Y9Rb2CUWHSAatiQMhfkpx1MWXofUzw
- **TON:** UQD1M80nPyzph5ZW1vfp_r19XI5MaerNhDq4dWXbXCo96WFj
- **NOT:** UQD1M80nPyzph5ZW1vfp_r19XI5MaerNhDq4dWXbXCo96WFj
- **ETH:** 0x286D65151b622dCC16624cEd8463FDa45585fd60
<div align="center">
<table>
<tr>
<td><img src="public/btc.png" alt="BTC" height="185" /></td>
<td><img src="public/ton.png" alt="TON" height="185" /></td>
<td><img src="public/not.png" alt="NOT" height="185" /></td>
<td><img src="public/eth.png" alt="ETH" height="185" /></td>
</tr>
</table>
</div>
## ประวัติดาว
<a href="https://www.star-history.com/#chatman-media/telegram-badge&Date">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=chatman-media/telegram-badge&type=Date&theme=dark" />
<source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=chatman-media/telegram-badge&type=Date" />
<img alt="Star History Chart" src="https://api.star-history.com/svg?repos=chatman-media/telegram-badge&type=Date" />
</picture>
</a>
## กิจกรรมรีพอซิทอรี
## 📜 ใบอนุญาต
โปรเจ็กต์นี้ได้รับอนุญาตภายใต้ใบอนุญาต MIT - ดูไฟล์ [LICENSE](LICENSE) สำหรับรายละเอียด
---
สร้างด้วย ❤️ โดย [Chatman Media](https://github.com/chatman-media)