simple-boost – The Lightning Payment Button

A web component button to trigger a WebLN payment request. The easiest and fastest way for your website visitors to send you sats.

Lightning invoices can either be automatically generated through a LNURL-pay Lightning Address or the payment can be sent as a keysend payment.

---

🚀 Usage

HTML / Web Component

Include the script and drop the <simple-boost> tag anywhere on your page:

<script type="module" src="https://esm.sh/simple-boost@latest"></script>

<simple-boost address="[email protected]" amount="2100" currency="sats">
  Support our work
</simple-boost>

---

React / Next.js Setup

Install the package:

npm install simple-boost

⚠️ Important: Required Packages The React wrapper depends on the following packages:

• react
• react-dom
• @lit/react

Install them with:

npm install react react-dom @lit/react

The React wrapper will not work in non-React projects.

---

Example Usage (React)

import {SimpleBoostButton} from 'simple-boost/react';

function Boost() {
  return (
    <SimpleBoostButton
      address="[email protected]"
      amount={2100}
      currency="sats"
    >
      Support our work
    </SimpleBoostButton>
  );
}

export default Boost;

---

Example Usage (Next.js 13+ with App Router)

Since this component relies on client-side rendering, remember to add "use client" at the top of your file:

'use client';

import {SimpleBoostButton} from 'simple-boost/react';

export default function Boost() {
  return (
    <SimpleBoostButton
      address="[email protected]"
      amount={2100}
      currency="sats"
    >
      Support our work
    </SimpleBoostButton>
  );
}

Demo and Documentation

• Documentation
• Examples

---

Development Setup

Install dependencies:

npm i

Build

Compile the TypeScript sources:

npm run build

Watch for changes:

npm run build:watch

Dev Server

Run local dev server with Vite:

npm run serve

Open: http://localhost:8000/dev/index.html

For production mode:

npm run serve:prod

---

Documentation Site

Generate docs:

npm run docs

Serve docs locally:

npm run docs:serve

Docs will usually be served at: http://localhost:8000

Credits

Built with ⚡ by the Alby team and contributors.