Why

The creator economy is a rapidly emerging economic model in which individuals are empowered by the internet to directly monetize their skills, talents, and creative outputs without the need for traditional intermediaries like publishers or distributors. As technology continues to democratize access to global markets, creators from various fields, including artists, writers, musicians, and educators, are increasingly able to establish direct connections with their audiences, facilitating a more personalized and authentic exchange of value. This paradigm shift emphasizes the importance of fostering a supportive ecosystem, where financial transactions are secure, efficient, and adaptable to the unique needs of both creators and their supporters.

The Lightning Network, a second layer protocol built on top of the Bitcoin blockchain, is an ideal solution for facilitating payments within the creator economy, offering numerous advantages over conventional platforms like PayPal. Lightning Network transactions are not only instant and irreversible, but they also boast significantly lower fees, making it possible for creators to accept micro-donations without being weighed down by excessive costs. This stands in stark contrast to PayPal, where fees can disproportionately affect smaller transactions. Additionally, the decentralized and censorship-resistant nature of Bitcoin aligns with the core principles of the creator economy, promoting financial independence and freedom of expression.

How

To help cover the server costs and copious hours spent building ulti-verse.com, I’m now accepting donations. I accept USD via PayPal and Bitcoin via Lightning. Here’s how I implemented lightning network donations:

0. Setting Up a Lightning Node

A lightning network node is need to generate invoices and receive payments. Here are three ways to access a node:

• Custodial Lightning Provider: Use a third-party service that manages a Lightning node on your behalf. It's a user-friendly solution that doesn't require much technical know-how, but it comes with extra fees and know-your-customer requirements (kyc). You may not have access to the node directly, but rather a set of APIs to interact with the network.
• Self-hosted Node: For those who value autonomy, self-hosting a Lightning node is the way to go. This method demands more technical expertise, as you'll be responsible for setting up and maintaining the node’s hardware.
• Paying for a Hosted Node: This approach combines the benefits of a custodial provider and self-hosting. By paying for a hosted node, you don’t have to worry about the physical infrastructure while maintaining privacy and full control over your channels.

I opted to use a lightning node hosting provider and am happy with the decision so far. I’ve only just started down the rabbit hole learning about how to run a lightning node. The node operator must open/close channels, set fee rates, and manage inbound and outbound liquidity, all of which are non-trivial tasks and have no one-size-fits-all solutions.

Learn more about the lightning network here: https://docs.lightning.engineering/the-lightning-network/overview

1. Creating a Backend API with Express.js

I started by developing a simple backend API using Express.js and Alex Bosworth’s ln-service, serving two primary functions:

1. Generate Lightning invoices
2. Notify the frontend when an invoice is confirmed

I implemented the /generate_invoice endpoint that interacted with the Lightning node to create an invoice based on the desired payment amount:

app.post('/generate_invoice', async (req, res) => {
  // Generate invoice using LND node
    const { request } = await lnService.createInvoice({
        lnd,
        description: "Ultiverse donation",
        tokens: satoshis,
    });
});

Next, I set up a WebSocket server for real-time invoice confirmation updates. This allowed me to "subscribe" to my invoices and send notifications to the frontend when payments were confirmed:

invoiceSubscription = lnService.subscribeToInvoice({
    lnd,
    id: paymentHash,
});

2. Frontend Implementation with React

With the backend ready, I proceeded to create a React component for the frontend. This component enabled users to choose a payment amount, generate a Lightning invoice, and display a QR code for payment.

// Inside the LightningInvoiceButton component
<Button onClick={handleClickOpen}>Pay with Lightning</Button>
<Dialog open={open} onClose={handleClose}>
    {/* ... Select amount and generate invoice */}
    <QRCode value={invoice} />
</Dialog>

Subsequently, I established a WebSocket connection to listen for invoice confirmations. When a payment was confirmed, I displayed a message to the user:

useEffect(() => {
  if (invoice) {
    const newWs = new WebSocket('ws://localhost:3000');
    // ...
  }
}, [invoice]);

3. Check it out!

To see the donation button in action, head to ulti-verse.com/support

If you found this interesting or have any questions, leave a comment!