telegram-badge
Version:
Generate Telegram group member count badges for GitHub README
265 lines (192 loc) β’ 9.18 kB
Markdown
# π‘οΈ Telegram Group Badge Generator
[π·πΊ Π ΡΡΡΠΊΠΈΠΉ](README.ru.md) | [πΊπΈ English](README.md) | [π¨π³ δΈζ](README.zh.md)
[](https://github.com/chatman-media/telegram-badge/actions)
[](https://www.npmjs.com/package/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/status/1947399700795244694)
This project generates SVG badges with the current member count of your Telegram group. Perfect for displaying community activity in GitHub README files or on websites.
## π Quick Start
Just use URL parameters to generate badges for any Telegram channel or group:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel
```

---
## π¦ Tech Stack
- Node.js / TypeScript
- Telegram Bot API
- Vercel (Serverless API)
- Jest for testing
---
## π§© Usage
### Primary Method: URL Parameters (No Setup Required!)
Simply add your Telegram channel/group ID to the URL:
```markdown

```
That's it! No deployment, no bot token needed.
### Alternative Method: Self-Hosted Deployment
For advanced users who want to host their own instance:
#### 1. Prerequisites
- Telegram Bot Token (create via [@BotFather](https://t.me/botfather))
- Vercel account (or any Node.js hosting)
#### 2. Deploy to Vercel
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fchatman-media%2Ftelegram-badge)
Set environment variables:
- `BOT_TOKEN`: Your Telegram bot token
- `CHAT_ID`: Default chat ID (optional if using URL parameters)
#### 3. Local Development
```bash
git clone https://github.com/chatman-media/telegram-badge.git
cd telegram-badge
npm install
# Create .env file
echo "BOT_TOKEN=your_bot_token" > .env
echo "CHAT_ID=@your_channel" >> .env
npm run dev
```
### π¨ Styling Parameters
You can customize the badge appearance using the following parameters:
| Parameter | Description | Default Value |
|-----------|-------------|---------------|
| `channelId` | Telegram chat ID or username (e.g., ``) | From environment |
| `style` | Badge style | `flat` |
| `label` | Label text | `Telegram` |
| `color` | Main badge color | `2AABEE` (Telegram color) |
| `labelColor` | Label color | `555555` |
| `logo` | Show Telegram logo | `true` |
#### Available styles:
- `flat` - flat style (default)
- `plastic` - plastic style with gradient
- `flat-square` - flat square style without rounded corners
- `for-the-badge` - wide style with uppercase letters
- `social` - GitHub social style
#### Examples:
Standard badge (flat style):
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel
```

Badge with plastic style:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=plastic
```

Badge with flat-square style:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=flat-square
```

Badge with for-the-badge style:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=for-the-badge
```

Badge with social style:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=social
```

Badge with custom label and color:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&label=Join%20Chat&color=00FF00
```

Fully customized badge:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=for-the-badge&label=Community&color=FF5733&labelColor=1A1A1A
```

Badge without logo:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&logo=false
```

Badge for specific channel:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel
```
Badge with custom styling:
```
https://telegram-badge.vercel.app/api/telegram-badge?channelId=@your_channel&style=for-the-badge&color=FF5733
```
## β¨ Features
- π₯ Real-time member count display
- π Direct URL parameters - no setup required!
- π¨ Full badge appearance customization
- π Optional self-hosting with secure token storage
- β‘ Optimized caching for fast loading
- π‘οΈ Error handling with informative messages
- π Free to use
- π‘ Can be extended to show activity/message count
- π§ͺ Comprehensive test suite with TypeScript
## π§ API Usage
### As npm package:
```bash
npm install telegram-badge
```
```typescript
import badgeHandler from 'telegram-badge';
// Use in your serverless function
export default badgeHandler;
```
### Direct API calls:
```typescript
GET /api/telegram-badge?style=flat&label=Members&color=2AABEE&labelColor=555555
```
## π§ͺ Testing
Run the test suite:
```bash
npm test
```
Run type checking:
```bash
npm run type-check
```
Build the project:
```bash
npm run build
```
## Star History
<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>
## π€ Contributing
1. Fork the repository
2. Create your feature branch (`git checkout -b feature/amazing-feature`)
3. Commit your changes (`git commit -m 'Add some amazing feature'`)
4. Push to the branch (`git push origin feature/amazing-feature`)
5. Open a Pull Request
## Subscribe
[](https://www.tiktok.com/@chatman.media)
[](https://www.twitch.tv/chatman1984)
[](https://www.youtube.com/@chatman-media)
[](https://t.me/alexanderkireyev)
[](https://x.com)
## Support ππ
- **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>
## π License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
---
Made with β€οΈ by [Chatman Media](https://github.com/chatman-media)