badgen / badgen.net Goto Github PK

1. What about a badge without left hand-side label? Like this one with whole blue background:
   

2. The url could be:

   1. /b/:status - b stands for "bare" or shrunk "badge"
   2. /bare/:status
   3. other proposal

The idea comes from this tweet, will it be useful? Maybe use it for twitter badge or something, I think it would be better looking than current social badge.

Take a vote, 👍for useful, 👎for not useful, 😄🎉😕for url options 1/2/3.

badgen.net:

flat.badgen.net:

Looks like it needs an additional 5 spaces at the beggining of each line (excl the first line) to cover the flat.

https://developer.codeclimate.com/#overview

• Issues
• Maintainability
• Coverage
• Technical Debt

Seems there could be a badge for this:

Web Test
https://developers.google.com/speed/pagespeed/insights/?utm_source=analytics&tab=desktop&url=https%3A%2F%2Fbadgen.now.sh%2F

API Explorer
https://developers.google.com/apis-explorer/#p/pagespeedonline/v4/pagespeedonline.pagespeedapi.runpagespeed?url=https%253A%252F%252Fbadgen.net&_h=1&

API Endpoint
https://www.googleapis.com/pagespeedonline/v4/runPagespeed?url=https%3A%2F%2Fbadgen.net

Finally start building docs for live badges 👻

Starting from packagephobia https://badgen.net/docs/packagephobia

This will allow more flexibility and users of the RunKit will be able to access whatever they need. For example, getting req.path parsing it and getting queryparams so depending on some params, to base some logic.

For builtin ones, this will allow for listening on the registry_uri, for example, in the npm live badge. No need to have global support (inside all live badges) for this or such query params. Even can be more, for example in the npm default export it will be passed only to the /npm/v endpoint, so no security or such issues.

So

module.exports = async function npm (req, method, ...args) {
  switch (method) {
    case 'v':
      return version(req, args)
    case 'dt':
      return download('total', args)
  }
  // code ...
}

async function version (req, args) {
  const registry = qs.parse(req.path, true).registry_uri || 'registry.npmjs.org'

  // code ...
}

So nor other npm endpoints, nor other live badges will have access to that registry_uri query param, it just won't matter.

Again. :D

@babel/core is cyan, but shouldn't be, because it is latest.

The cyan should be only if non-latest dist-tag is passed, no matter it is scoped or not.

Some exploration on logo 🤗

Title

Inline

I see that you support flat badges in badgen, are they supported here? I'm not seeing anything about flat icons inside the docs.

Live badge with data from a runkit endpoint.

URL

https://badgen.net/runkit/:endpoint_id/:params

Example Endpoint

RunKit Notebook: https://runkit.com/amio/peoples

RunKit Notebook: https://runkit.com/amio/satisfaction

The number you find here: https://github.com/chalk/chalk/network/dependents

GitHub has a GraphQL API endpoint for it: https://developer.github.com/changes/2018-04-24-preview-dependency-graph-and-vulnerability-hooks/

Can we think for adjust it to our needs?

https://www.vectorlogo.zone/logos/patreon/patreon-ar21.svg

I'm not on SVGs too much. ;d We can only get the "P" one, but should somehow invert the colors. Actually... the orange should be white and and the rest transparent?

The Uptime Robot badges incorrectly have lasy-day, e.g. /uptime-robot/lasy-day/m780731617-a9e038618dc1aee36a44c4af

This is incorrect, and gives unknown topic:

It should instead have day:

I have a repo with 0 issues open. Unfortunately it's badge shows in red, which is discouraging.

Surely, where to draw the line between red/green is debatable, no question about it. But I'd say that 0 is a certain green.

Personally, 0 green and everything else red suits my needs, because my repo is small and I do intend to keep it on zero and will put a lot of effort on it!

Stars, Pulls, Build Status.

And as an example usage of icon.

Check the following badge:

https://badgen.net/github/open-issues/papb/better-promise-error-log

It shows "github | unknown", instead of the expected "open issues | 0".

What could be causing this?

Pretty much.. After the last changes related to the cache, it started to feels.

I sometimes am forced to visit the badgen badge url to trigger refresh.
Not to mention this not always works ;d

Even with F5, even with CTRL+R, even with another browser - nothing.

Run tests on real production environment 💪

Thanks to now alias this can be so easy!

  "scripts": {
    "deploy": "now && now alias badgen-canary",
    "postdeploy": "TARGET=https://badgen-canary.now.sh npm run test"
  }

Official badge documents

https://github.com/opencollective/opencollective/wiki/Github-banner

Preview

• https://opencollective.com/parcel/backers/badge.svg
  
• https://opencollective.com/parcel/sponsors/badge.svg
  

More of a note to me.

Currently we get the "first in response array" tag/release.
The Babel example is perferct for showing the problem.

I think with /github/release/owner/repo we should show latest stable release/tag. In the case with Babel latest one happens to be a "prerelease", so it shows it in orange.

I'm thinking for this

• /github/release/owner/repo should show lastest stable release (e.g. Babel's v6), in blue
• /github/release/owner/repo/prerelease show latest prerelease

Or what about /github/prerelease/owner/repo for the prereleases and /github/release for the stable ones?

Perfect would be /github/release and /github/prerelease, because this will allow for static github badges like /github/release/owner/repo/v1.2.3 ... which... actually, not make much sense because you can just /badge/release/v1.2.3/color ;d

🎉🎉🎉

Badgen gets flatten!

• https://flat.badgen.net for flat style
• https://badgen.net for classic style

What about badgen.now.sh?

https://badgen.now.sh will serves exactly the same as badgen.net, as long as badgen.net exists.
Secret: they are all now aliases of same service ;)

New live badges since Badgen’s reveal:

chrome-web-store, circleci, codecov, crates, david, github, homebrew, and uptime-robot, looking foward for more!

Query params support

label, emoji, list, checkout docs for details.

Badgen is on twitter

Say hi @badgen_net 🤗, updates are comming 💪

For example:

More: https://shields.io/#/examples/social

So this is not a real issue but just an idea.

I see that today, loading badgen.net takes 144 KB of bandwidth, and it will become bigger every time new badges are added.

As you said on your comment, the bandwidth usage is already pretty high, and I guess the index page is a big part of it.
Also, the response time on uptime robot is now > 500ms, which is a lot more than a few weeks ago.

Maybe you could use the free plan of Cloudflare to cache live badges for a few minutes, and static badges for a whole week!
Docs and index could also be cached for a few minutes
It could even prevent occasional downtime

Maybe introduce another color?

It's always, or mostly always, a zero.

Probably we should use the /range for the previous day, not for the current one.

I can dig what Shields does, but probably is that - for the previous day.

That's problem with the API actually:
https://api.npmjs.org/downloads/point/last-day/react

In most of the time it will show 0, i assume.

Docs

https://david-dm.org/

Example

https://david-dm.org/zeit/pkg/
https://david-dm.org/zeit/pkg/info.json
https://david-dm.org/zeit/pkg/dev-info.json
https://david-dm.org/zeit/pkg/peer-info.json
https://david-dm.org/zeit/pkg/optional-info.json

There are two kinds of live badge in badgen service:

1. Has "official" badge service with same style, like travis, circleci.
   badgen service will respond a 302 redirect to the official address, theoretically that should be the fastest badge service.
2. Has an api for generating badge, like npm version, npm downloads.
   badgen service will respond a 302 redirect to resolved static badge url(In favor of Now CDN, no more perf tricks 🎉💪) the badge, depends on api response, and cache that response data for 60 seconds.

If you would like to propose a badge, please post it here, the api service or the official badge url schema.

There's a long list on shields.io to implement one by one, hope that won't take too long :P

Pretty strange. Now it wants to be 3 days before ... ;d wat the heck. I totally should see how Shields handles this.

See https://forthebadge.com/
shields.io does support custom generation (not complete though) of those, what do you think ?

https://cirrus-ci.org/guide/writing-tasks/#embedded-badges

But not sure for the states. Also not sure which projects uses it so to use for examples.

I'm consider switching to it in near future. The only thing that stopping me currently is environment variables handling, which i highly depend on for my full automation of auto-release, auto-update and auto-publish flow.

The cool thing about CircleCi is that it allows you to have one "global store" of environment variables, so you set it once and every old and new project you setup you can access it.

It's quite slow to do that for each project. Add cirrus config file, go to cirrus dashboard add env to that specific repo and etc. All that was one of the reason i switched from travis.

So yea, Cirrus CI is amazing and fast, but. :D

Related to one answer in Reddit.

https://www.reddit.com/r/javascript/comments/91m0cn/badgen_fast_badge_generating_service_shieldsio/e2zje8w

SO: https://stackoverflow.com/questions/50122026/how-to-get-the-number-of-people-in-a-getsatisfaction-community-for-shields-io/50122101#50122101

The suffix is kinda good idea. But uri may be a bit more complex.

• uri is for replacing the request endpoint, for example, to npm API
• query is for selecting things from the return by uri data
• suffix is value appeded to the right side of the badge

• Contributors
• Release downloads (total/latest)
• Last commit

No, seriously, that's all i need :D

And this service would be just enough and finished :D :)

Currently it should shows 100.0% or 76.0% and that's ugly. It should have decimal only if it is different than 0.

It seems it's missing.

![](https://img.shields.io/npm/dt/react.svg)

badge:

daaaamn, btw.. more often and more often Shields goes too slow.

I've added a "Badgen Story" to README.md (@olstenlarck I stole you a word :P), hoping to give new comers a general idea how Badgen comes from.

While I'm not sure I spells everything correctly and didn't cause anything confusion, if you find something weird please let me know 😅

Besides that, do you think there should be a guide(some sort of anatomy of the project) helping new contributor to get hands on this quickly? What should get explained/mentioned in the guide?

I see that the URI for the uptime of badgen-service is

https://badgen.net/uptime-robot/day/m780731617-a9e038618dc1aee36a44c4af

How to find the ID at the end of the URI ? I cannot find it from the stats page, which is https://stats.uptimerobot.com/z6nqBfYGB

Thanks for your help

Because the "workaround" https://github.com/amio/badgen-service/blob/master/libs/live-fns/npm.js#L96

It seems that https://registry.npmjs.org/@babel%2Fcore/* shows empty object
but removing the star shows all versions.

proof: https://registry.npmjs.org/@babel%2Fcore

It's interesting why with @nestjs/core/* it still works 😆

I'm not sure if this is a bug in badgen or Coveralls API, but shields.io seems to be returning the expected 100% while badgen seems to be using a percentage from a recent PR.

Badgen URL: https://flat.badgen.net/coveralls/c/github/expressjs/morgan/master
shields.io URL: https://img.shields.io/coveralls/expressjs/morgan/master.svg?style=flat-square

Rendered:
Badgen:
shields.io:

Could you add VSCode Marketplace badge like this

For consistency, i think it would be good all of the CIs to be build | passing or build | success, or every CI to have label its name, or every CI badge to be same, except icons

• CircleCI or
• TravisCI or
• AppVeyorCI or

Always dreamed about that 😆

Would be awesoome if they include icons by default and be build | passing.

Hm. What about "icon style" at icon.badgen.net? So all badges will have their respective icons (if they have). How cool is that (btw, should add white icons too ;d)

I understand that my package kinda don't have downloads and/or api not refreshed yet, but would be better to show dowloads/month | unknown or such like that.

Otherwise badges are broken.

https://github.com/olstenlarck/flow-reporter-codeframe

Each issue can have some labels, for example: bug. It'd be very nice to retrieve the amount of open issues labeled bug :) The label doesn't have to be named bug. Note it can be bleeding bug or buggy or something like that :)

Example badge:

I have a repo: https://github.com/styfle/packagephobia

I tried visiting https://badgen.now.sh/travis/styfle/packagephobia which redirects to https://api.travis-ci.com/styfle/packagephobia.svg?branch=master but that shows "build unknown".

My readme is currently using https://travis-ci.org/styfle/packagephobia.svg?branch=master which redirects to https://api.travis-ci.org/styfle/packagephobia.svg?branch=master and this correctly hows "build passing"

Note the difference here is .com vs .org.

Maybe you could add hackage bagdes like shields io

Would be nice to have a badge to show off how many npm packages depend on my package. For example, the 1717 Dependents number at https://www.npmjs.com/package/got.

You could either:

• Use the API. Example: https://github.com/chrisdickinson/npm-get-dependents
• Scrape. Example: https://github.com/astur/check-npm-dependents

david-dm supports passing a path parameter to read package.json related to the github repo + path specified in the parameter.

This makes it possible for monorepos that include multiple packages (mulitple package.json files) to list dependency information via david-dm for the specific packages. Zendesk Garden is a monorepo using this feature of david-dm: https://github.com/zendeskgarden/react-components#installation

Note that zendesk garden is using shields.io for these badges.

This feature request is for adding path support for david-dm badges to badgen.

Here is a valid david-dm URL using path to get dependency info for package in a monorepo:
https://david-dm.org/cerner/terra-framework?path=packages/terra-hookshot

Here is what I'm thinking for the badgen API for this:
https://badgen.net/david/cerner/terra-framework?path=packages/terra-hookshot

It shows (1,967,277.00) but it is 19,672.77 and same for the yearly income.

but it is a lot smaller ;d