visitor-badge

0. Simple description

A service about badge generator to count visitors of your site (based on counter-service and shields.io).

1. How to use

1.1 register a namespace in counter-service to help manage your data

There is a simple management panel here: management-panel.

1.2 request visitor-badge

1.2.1 query parameters(almost the same with counter-service and shields.io)

parameter	value
?namespace	usually a domain name, like: plantree.me
?key	usually a relative URL path, like: about.html
?label	left text in the badge, default: visitors
?labelColor	left color in the badge
?color	right color in the badge
?style	just like styles in shields.io

Styles examples:

?style=plastic&logo=appveyor

?style=flat&logo=appveyor

?style=flat-square&logo=appveyor

?style=for-the-badge&logo=appveyor

?style=social&logo=appveyor

1.2.2 different ways of using

• The default badge:

  https://api.visitor.plantree.me/visitor-badge/pv?namespace=example.com&key=index.html

  

• Change a style:

  https://api.visitor.plantree.me/visitor-badge/pv?namespace=example.com&key=index.html&style=for-the-badge

  

• Change colors:

  https://api.visitor.plantree.me/visitor-badge/pv?namespace=example.com&key=index.html&color=blue

  

2. Why do this

I am running a personal website, which is plantree.me, and I need a way to count the number of visitors.

Currently, there are some ready-made service to do this, just like: visitor-badge, HITS, etc. However, like I have post in counter, there is no clear decoupling of presentation service and data service. That's why I develop two separate services:

• data service
• presentation service (this project)

You can use them independently and they all have clear documentations and interfaces for ease of use.

3. Technology inside

3.1 stack

Component	Implementation
runtime	Vercel Serverless
dependency services	counter-service & shieds.io

3.2 process

sequenceDiagram
	Client->>VisitorBadgeService: request with parameters
	VisitorBadgeService->>CounterService: incr value
	CounterService->>VisitorBadgeService: get value
	VisitorBadgeService->>ShieldsService: generate badge
	ShieldsService->>Client: response
	Client->>Client: present

Loading

4. Changelogs

0.9.0 (2022-12-26)

Feature

1. basic service is ready
2. deploy to Vercel Serverless

5. Reference

1. https://github.com/jwenjian/visitor-badge#readme
2. https://github.com/dwyl/hits
3. https://vercel.com/docs/concepts/functions/serverless-functions/runtimes/python
4. https://github.com/vercel/examples/tree/main/python/flask
5. https://shields.io/