Giter VIP home page Giter VIP logo

codewars-stat-card's Introduction

Codewars Stat Badge/Card (WiP)

This is not the original Codewars Badge, just a redesign I made for fun.

Good to know

  1. ⚠ This app is deployed on Heroku and it has a limit of 50 concurrent conections so, If you like it please πŸ™ clone the repo and deploy it on your favourite platform.

  2. Heroku + β˜•. This app is kaffeinated. It pings every 30 minutes to keep the dyno awake. Due to Heroku's policies for free dynos to sleep for 6 hours a day, I've set mine to fall asleep😴 from 1:00am to 7:00am GMT.

  3. In this 6 hour span the app will take around 7 seconds to start.

  4. Because of the aggressive cache of github camo images I've set the headers to no-store, this prevents github from cahcing the image but it also prevents the image from showing when Heroku's dyno are asleep, to fix this just refresh the page. (If you know a solution to this please let me know)

Options

The URL has to contain the following queries to function properly:

  • username=[your codewars username]
  • card or badge (without value, just the key)
  • colormode=[dark_mode or bright_mode]

Examples

  • Default mode

    https://github-readme-codewars-stats.herokuapp.com/api/?username=vanhaaggen&badge&colormode=dark_mode

  • bright_mode

    https://github-readme-codewars-stats.herokuapp.com/api/?username=vanhaaggen&badge&colormode=bright_mode

  • name_only

    https://github-readme-codewars-stats.herokuapp.com/api/?username=[your username]&badge&name_only

  • alias_only (combined with bright_mode)

    https://github-readme-codewars-stats.herokuapp.com/api/?username=vanhaaggen&badge&alias_only&colormode=bright_mode

  • Card

    https://github-readme-codewars-stats.herokuapp.com/api/?username=vanhaaggen&card&colormode=dark_mode


Customize your badge/card

https://github-readme-codewars-stats.herokuapp.com/api/?username=vanhaaggen&[badge or card]&customcolor=[query-string] The query options are:

  • bg (background)
  • fg (foreground)
  • text
  • secText (secondary text)
  • stroke (only in badge)
  • logo

The query string is formated the following way: customcolor=bg:[HEX code without #]

To join different options use underscore _: customcolor=bg:[HEX code without #]_fg:[HEX code]_text:[HEX code]

Example Badge

https://github-readme-codewars-stats.herokuapp.com/api/?username=vanhaaggen&badge&customcolor=bg:2a295b_fg:b500ed_text:fc4646_logo:2a295b_stroke:f75402

Example Card

https://github-readme-codewars-stats.herokuapp.com/api/?username=vanhaaggen&card&customcolor=bg:2a295b_fg:b500ed_text:fc4646_logo:2a295b_stroke:f75402


Any suggestions or contributions are very welcome 😊

  • For suggestions please open a new Issue
  • For contributions Pull-request

things to do:

  • Choose to display username. Default is both name and username.

  • If name return null, display username in big.

  • Make colors customizable.

  • Create codewars stat Card with more user info.

  • Make a button to automate the deployement on diferent platforms. ...

codewars-stat-card's People

Contributors

vanhaaggen avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.