DEV Community

Bruno Luis Panuto Silva
Bruno Luis Panuto Silva

Posted on

WMHub: easy Web Monetization for all

What I built

A web app that allows you to automatically add Web Monetization to your project without having to code JS or add <meta> tags. It also collects metrics on pages with Web Monetization and consolidates that into the platform.

Submission Category:

Foundational Technology

Demo

https://wmhub.live

Link to Code

Wmhub

Here you'll find our application!

Setup

Install the Elixir programming language, clone this repo and run:

mix deps.get
cd assets/ && npm install && cd ..
iex -S mix phx.server



How I built it

The stack for this project is Elixir, with PostgreSQL for the database and Phoenix as the web framework.

The "library" injected in pages to handle Web Monetization events is made in JavaScript, the ES5 version. We want to include everyone!

All interactions apart from the landing page, signin and signup forms are Phoenix LiveViews, which classifies this app as an SPA (after you login).

Communication with pages to broadcast real-time payment pointer updates to users that are already connected to your app are handled by Phoenix Channels.

Additional Resources/Info

The plan is to expand WMHub beyond a simple "payment pointer" update tool. Here are some of the ideas in the roadmap:

  • A templating tool that allows you to hook Web Monetization events and display content. Maybe display a link to paying users! There is a challenge here in flexibility vs mitigating XSS attack vectors.

  • A "trigger" tool that runs on Web Monetization events and allows you to hook any type of code.

  • A marketplace of triggers and templates, so that users can install things without any knowledge whatsoever.

  • Collect (anonimized/with consent) data from users visiting a WMHub powered project, allowing the content creator more insight on how their content is consumed.

Top comments (0)