Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/michaelcurrin/badge-generator
Magically generate Markdown badges for your docs 🛡️ 🦡 🧙
https://github.com/michaelcurrin/badge-generator
badge badge-generator boilerplate docs-generator documentation-generator documentation-tool javascript markdown markdown-badges nodejs readme-badge readme-badges shield shields shields-io shieldsio typescript vue
Last synced: 13 days ago
JSON representation
Magically generate Markdown badges for your docs 🛡️ 🦡 🧙
- Host: GitHub
- URL: https://github.com/michaelcurrin/badge-generator
- Owner: MichaelCurrin
- License: mit
- Created: 2020-01-26T11:27:02.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2024-09-21T07:11:00.000Z (about 2 months ago)
- Last Synced: 2024-10-12T19:36:38.247Z (about 1 month ago)
- Topics: badge, badge-generator, boilerplate, docs-generator, documentation-generator, documentation-tool, javascript, markdown, markdown-badges, nodejs, readme-badge, readme-badges, shield, shields, shields-io, shieldsio, typescript, vue
- Language: TypeScript
- Homepage: https://michaelcurrin.github.io/badge-generator/
- Size: 35.8 MB
- Stars: 387
- Watchers: 8
- Forks: 113
- Open Issues: 82
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# Badge Generator
:shield: :badger: :mage:> Magically generate Markdown badges for your docs
[![GH Pages Deploy](https://github.com/MichaelCurrin/badge-generator/workflows/GH%20Pages%20Deploy/badge.svg)](https://github.com/MichaelCurrin/badge-generator/actions/workflows/main.yml "GitHub Actions workflow status")
[![GitHub tag](https://img.shields.io/github/tag/MichaelCurrin/badge-generator)](https://github.com/MichaelCurrin/badge-generator/releases/?include_prereleases&sort=semver "View GitHub releases")
[![License](https://img.shields.io/badge/License-MIT-blue)](#license "Go to license section")[![CodeQL](https://github.com/MichaelCurrin/badge-generator/workflows/CodeQL/badge.svg)](https://github.com/MichaelCurrin/badge-generator/actions?query=workflow%3ACodeQL "Code quality workflow status")
[![Known Vulnerabilities](https://snyk.io/test/github/MichaelCurrin/badge-generator/badge.svg?targetFile=package.json)](https://snyk.io/test/github/MichaelCurrin/badge-generator?targetFile=package.json "Snyk vulnerabilities")[![Made with Node](https://img.shields.io/badge/dynamic/json?label=node&query=%24.engines%5B%22node%22%5D&url=https%3A%2F%2Fraw.githubusercontent.com%2FMichaelCurrin%2Fbadge-generator%2Fmaster%2Fpackage.json)](https://nodejs.org "Go to Node.js homepage")
[![Package - Yarn](https://img.shields.io/badge/yarn->=1-blue?logo=yarn&logoColor=white)](https://classic.yarnpkg.com "Go to Yarn classic homepage")
[![Package - Vue](https://img.shields.io/github/package-json/dependency-version/MichaelCurrin/badge-generator/vue?logo=vue.js&logoColor=white)](https://www.npmjs.com/package/vue "Go to Vue on NPM")
[![Package - Typescript](https://img.shields.io/github/package-json/dependency-version/MichaelCurrin/badge-generator/dev/typescript?logo=typescript&logoColor=white)](https://www.npmjs.com/package/typescript "Go to TypeScript on NPM")[Website](https://michaelcurrin.github.io/badge-generator/) — [Sample badges](#sample-badges) — [Documentation](/docs/#readme)
## Overview
A convenience tool that makes it easy to generate custom Markdown for badges to put on your documentation or website.
Choose a page, enter your details, and click _Submit_ to generate some Markdown code for you to copy and paste.
External tools are used to actually render badges - mostly using [shields.io](https://shields.io).
## Preview
## Open the web app
Start creating badges for your docs.
[![Site](https://img.shields.io/badge/View_site-Badge_Generator-2ea44f?style=for-the-badge)](https://michaelcurrin.github.io/badge-generator/)
## Sample badges
Examples of a few badges generated with the app and rendered here on a markdown doc
Note that most of the badges at the top of this `README.md` file were also generated using this app.
### Social badges
Link to your project. From another project - even paste these in an online forum or your blog.
[![MichaelCurrin - badge-generator](https://img.shields.io/static/v1?label=MichaelCurrin&message=badge-generator&color=blue&logo=github)](https://github.com/MichaelCurrin/badge-generator)
[![stars - badge-generator](https://img.shields.io/github/stars/MichaelCurrin/badge-generator?style=social)](https://github.com/MichaelCurrin/badge-generator)
[![forks - badge-generator](https://img.shields.io/github/forks/MichaelCurrin/badge-generator?style=social)](https://github.com/MichaelCurrin/badge-generator)### Repo metadata
Add to the top of your `README.md` file. These are about your specific repo. Some are dynamic and some are hardcoded (like license below).
[![GitHub tag](https://img.shields.io/github/tag/MichaelCurrin/badge-generator?include_prereleases=&sort=semver)](https://github.com/MichaelCurrin/badge-generator/releases/)
[![License](https://img.shields.io/badge/License-MIT-blue)](#license)
[![issues - badge-generator](https://img.shields.io/github/issues/MichaelCurrin/badge-generator)](https://github.com/MichaelCurrin/badge-generator/issues)### Generic
Put whatever text value you want in this static (fixed) badge. You can change the color, logo and destination link. Use the badge for your repo, website or documentation.
[![Foo - Bar](https://img.shields.io/badge/Foo-Bar-2ea44f)](#)
![Maintained - yes](https://img.shields.io/badge/Maintained-yes-green)
![Contributions - welcome](https://img.shields.io/badge/Contributions-welcome-blueviolet)### Packages
You might want to list a dependency of your repo with the value actually in use, instead of a static badge.
Here we have Vue listed as a dependency of this Badge Generator repo and the version number changes to reflect what is in the `package.json` file.
[![package - vue](https://img.shields.io/github/package-json/dependency-version/MichaelCurrin/badge-generator/vue?logo=vue.js&logoColor=white)](https://www.npmjs.com/package/vue)
### Dynamic data
Similar to above but more flexible.
Create a badge that references _any_ value within a public data file (currently only JSON files are supported by Badge Generator). The badge stays up to date with whatever value is in the target file.
In the example below, we lookup the version of VS Code IDE needed by a VS Code extension. The query is `$.engines.vscode` and that is done against this target [package.json](https://github.com/MichaelCurrin/auto-commit-msg/blob/master/package.json) file on GitHub.
![auto-commit-msg](https://img.shields.io/badge/dynamic/json?label=vscode&query=%24.engines.vscode&url=https%3A%2F%2Fraw.githubusercontent.com%2FMichaelCurrin%2Fauto-commit-msg%2Fmaster%2Fpackage.json)
### Catalogue
Pre-made badges around languages and tools. Just copy and paste them - no form input needed. You might put a static value there for what version you support without making it dynamic.
If you can't find a badge you're looking for there, use the Generic badge option to make your own.
[![OS - Linux](https://img.shields.io/badge/OS-Linux-blue?logo=linux&logoColor=white)](https://www.linux.org/ "Go to Linux homepage")
[![Made with Bash](https://img.shields.io/badge/Bash->=3-blue?logo=gnu-bash&logoColor=white)](https://www.gnu.org/software/bash/ "Go to Bash homepage")
[![Made with Python](https://img.shields.io/badge/Python->=3.6-blue?logo=python&logoColor=white)](https://python.org "Go to Python homepage")## Documentation
> User guide for using the app and how setup and run the app yourself[![view - Documentation](https://img.shields.io/badge/view-Documentation-blue?style=for-the-badge)](/docs/#readme "Go to project documentation")
## License
Released under [MIT](/LICENSE) by [@MichaelCurrin](https://github.com/MichaelCurrin).
- You can freely modify and reuse.
- The _original license_ must be included with copies of this software.
- Please _link back_ to this repo if you use a significant portion the source code.