An open API service indexing awesome lists of open source software.

https://github.com/ptkdev-components/webcomponent-patreon-box

My Patreon Tier Box with avatars and link from rest/json api.
https://github.com/ptkdev-components/webcomponent-patreon-box

custom-elements patreon patreon-api patreon-box patreon-photos patreon-tier patreon-widget shadow-dom webcomponent webcomponents

Last synced: 3 months ago
JSON representation

My Patreon Tier Box with avatars and link from rest/json api.

Awesome Lists containing this project

README

        

# 🎁 WebComponent: Patreon Box

[![](https://img.shields.io/badge/version-v1.1.0-lightgrey.svg)](https://github.com/ptkdev-components/webcomponent-patreon-box/releases) [![](https://img.shields.io/npm/v/@ptkdev/webcomponent-patreon-box.svg)](https://www.npmjs.com/package/@ptkdev/webcomponent-patreon-box) [![](https://img.shields.io/badge/license-MIT-brightgreen.svg)](https://github.com/ptkdev-components/webcomponent-patreon-box/blob/master/LICENSE.md) [![](https://img.shields.io/badge/ES-9-F7DF1E.svg)](https://wikipedia.org/wiki/ECMAScript) [![](https://snyk.io/test/github/ptkdev-components/webcomponent-patreon-box/badge.svg)](https://snyk.io/test/github/ptkdev-components/webcomponent-patreon-box) [![](https://discordapp.com/api/guilds/383373985666301975/embed.png)](http://discord.ptkdev.io)

> My Patreon Tier Box with avatars and link from rest/json api.

> ⛔ **DISCLAIMER**: This is an **unofficial** patreon library and offers no warranty! All trademarks and logos belong to their respective owners.

## 🎁 Support: Donate
> This project is **free**, **open source** and I try to provide excellent **free support**. Why donate? I work on this project several hours in my spare time and try to keep it up to date and working. **THANK YOU!**

[![](https://img.shields.io/badge/donate-paypal-005EA6.svg?logo=paypal)](https://www.paypal.me/ptkdev) [![](https://img.shields.io/badge/donate-patreon-F87668.svg?logo=patreon)](https://www.patreon.com/ptkdev) [![](https://img.shields.io/badge/donate-sponsors-ea4aaa.svg?logo=github)](https://github.com/sponsors/ptkdev/) [![](https://img.shields.io/badge/donate-ko--fi-29abe0.svg?logo=ko-fi)](https://ko-fi.com/ptkdev)

![](https://img.shields.io/badge/bitcoin-35jQmZCy4nsxoMM3QPFrnZePDVhdKaHMRH-E38B29.svg?logo=bitcoin) ![](https://img.shields.io/badge/ethereum-0x8b8171661bEb032828e82baBb0B5B98Ba8fBEBFc-4E8EE9.svg?logo=ethereum)

## 📎 Menu
- 💡 [Features](#-features)
- 🕹 [Demo](https://codepen.io/ptkdev/pen/abvLgOE)
- 👔 [Screenshot](#-screenshot)
- 🚀 [How to use](#-installation)
- - 🌎 [Web](#-installation-web)
- - 📦 [Webpack/Browserify](#-installation-npm-module---browserifywebpack)
- - 📖 [Wordpress](#-installation-wordpress)
- - ⚛️ [React](#%EF%B8%8F-installation-react)
- - 🅰️ [Angular](#🅰%EF%B8%8F-installation-angular)
- 🧰 [Options / Attributes](#-options--attributes)
- 📚 [Documentation](#-documentation)
- 👨‍💻 [Contributing](#-contributing)
- 🐛 [Known Bugs](https://github.com/ptkdev-components/webcomponent-patreon-box/issues?q=is%3Aopen+is%3Aissue+label%3Abug)
- 🍻 Community:
- [Discord](http://discord.ptkdev.io) ([🇬🇧 English Channel](https://discord.gg/YkMG26f) | [🇮🇹 Italian Channel](https://discord.gg/HFtdBAJ) | [🇵🇱 Polish Channel](https://discord.gg/TV5EXFd))

## 💡 Features
* [✔️] Easy to use
* [✔️] MIT License
* [✔️] Without jQuery depencence
* [✔️] Configurable with attributes
* [✔️] Work with: Browserify / Webpack / ReactJS / Angular / Wordpress
* [✔️] My Patreon Tier Box with avatars and link from rest/json api.
* [✔️] Translations: 🇬🇧 🇮🇹 🇵🇱 (Help me ❤️)

## 👔 Screenshot
See [Demo here](https://codepen.io/ptkdev/pen/abvLgOE). Photos from ptkdev's patreon rest api:

[![WebComponent: PatreonBox](https://raw.githubusercontent.com/ptkdev-components/webcomponent-patreon-box/nightly/.github/assets/screenshot/webcomponent-patreon-box-screen1.png?)](https://raw.githubusercontent.com/ptkdev-components/webcomponent-patreon-box/nightly/.github/assets/screenshot/webcomponent-patreon-box-screen1.png)

## 🚀 Installation (Web)
1. Add html code to your page (and replace `api` with your endpoint):
```html

```
2. Require javascript in yourpage (before `