https://github.com/nottherealwallyx/codestats-badge
Dynamic SVG badge generator for Code::Stats profiles
https://github.com/nottherealwallyx/codestats-badge
code-stats codestats dashboard developer-tools dynamic-badge github-badge nodejs open-source readme-badge svg-badge vercel
Last synced: 23 days ago
JSON representation
Dynamic SVG badge generator for Code::Stats profiles
- Host: GitHub
- URL: https://github.com/nottherealwallyx/codestats-badge
- Owner: NotTheRealWallyx
- License: mit
- Created: 2025-06-18T19:49:17.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-06-19T08:43:54.000Z (12 months ago)
- Last Synced: 2025-06-19T09:41:45.825Z (12 months ago)
- Topics: code-stats, codestats, dashboard, developer-tools, dynamic-badge, github-badge, nodejs, open-source, readme-badge, svg-badge, vercel
- Language: JavaScript
- Homepage: https://codestats-badge.vercel.app
- Size: 52.7 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
# codestats-badge
[](https://www.codefactor.io/repository/github/nottherealwallyx/codestats-badge)
[](https://github.com/NotTheRealWallyx/codestats-badge/actions/workflows/ci.yml) [](https://codecov.io/github/NotTheRealWallyx/codestats-badge)
📊 A dynamic SVG badge generator for [Code::Stats](https://codestats.net) profiles, perfect for embedding your XP and top languages in your GitHub README.
## 🚀 Features
### XP Badge:
- Displays **total XP** from your Code::Stats profile
- Shows your **top languages** by XP
- Returns a **custom SVG** you can embed anywhere
### Activity Badge:
- Displays **activity squares** for daily XP contributions
- Returns a **custom SVG** you can embed anywhere
## 🎨 Customization
You can control the appearance of your badges using query parameters:
### XP Badge:
- **Show/hide progress bar:**
Use `showProgressBar=false` to hide the progress bar.
Example:
```
/api/code-stats?user=yourusername&showProgressBar=false
```
- **Display language XP instead of level:**
Use `showLangXP=true` to show XP for each language instead of the level.
Example:
```
/api/code-stats?user=yourusername&showLangXP=true
```
- **Theme (light or dark):**
Use `theme=light` for a light background, or `theme=dark` for a dark background (default is dark).
Example:
```
/api/code-stats?user=yourusername&theme=light
```
- **Limit number of languages displayed:**
Use `limit=` to set how many top languages to show (default is 6, max is 20).
Example:
```
/api/code-stats?user=yourusername&limit=10
```
- **Compact mode:**
Use `compact=true` to display a simplified badge showing only total XP.
Example:
```
/api/code-stats?user=yourusername&compact=true
```

### Activity Badge:
- **Theme (light or dark):**
Use `theme=light` for a light background, or `theme=dark` for a dark background (default is dark).
Example:
```
/api/code-stats/activity?user=yourusername&theme=light
```

## 💻 Local Development
This project supports both local Express server and Vercel serverless function usage.
### 1. Install dependencies
```bash
npm install
```
### 2. Run the local Express server
```bash
npm run start
```
Then open:
```
http://localhost:3000/api/code-stats?user=yourusername
```
### 3. (Optional) Use Vercel for local development
If you want to test the Vercel serverless function locally:
```bash
vercel dev
```
## 🚀 Deployment
This project works great on:
- [Vercel](https://vercel.com) (recommended, uses `api/code-stats.js` serverless function)
- [Render](https://render.com) (runs Express server)
- [Heroku](https://heroku.com) (runs Express server)
- Any Node.js-capable host
## 📄 License
This project is licensed under the GNU GPL v3. See [LICENSE](LICENSE) for details.