Now with your BTCPay server setup and configured, you’ll want to make sure that you configured your Lightning implementation correctly, if you’re confused check the official .
In the services section you want to make sure that c-lightning charge-server appears.
Now let’s move on to our web application. Let’s make a directory to hold our application, then create an express backend using express generator and a react front-end using react-create-app. If you have your own methods, ignore this.
Next, we’ll install the required npm packages.
Now, we’ll set up our lightning-charge-client. In this step you’ll need to grab the credentials from your btcpay server. You’ll access this in server settings → services → C-Lightning (Charge server) → see information.
In our back-end we’ll set up lightning-charge-client using credentials from above, like this
// Initialize the client
const ChargeClient = require(“lightning-charge-client”);
// new is optional
const ln_charge = new ChargeClient(
“https://btcpay.myawesomedomain.com",
“mysupersecretkey”
);
For this basic example, we’ll create 2 simple routes. 1 route will create an Invoice, the other will wait until that invoice is payed. I’ve kept them simple, but you can imaging passing data into the Invoice and adjusting the satoshis based on your lApps need.
The first back-end route will simply call lightning-charge-client to create an invoice with given parameters
router.post(“/createInvoice”, async (req, res, next) => );
return res.json();
});
The second back-end route will wait until that invoice is payed and eventually return a payload
router.get(“/fetchInvoice/:id/wait”, async (req, res, next) => );
else if (paid === false)
console.log(“invoice expired and can no longer be paid”);
else if (paid === null)
console.log(“timeout reached without payment”);
} while (paid === null);
});
I hope that you’re already thinking about the possibilities!
Now in our front end, we’re going to make a button that when clicked will request an invoice from our back-end, pass the invoice payload into a QR code, display a popup, and lastly wait until invoice is paid.
Here we request an invoice from our back-end then render a modal, you can imagine sending data in the post and creating a custom-invoice as per your needs.
Note: using react-hooks
First, let’s make a button that when clicked requests our back-end to create a lightning invoice
async function onButtonClick()
Then we’ll pass the invoice data over to a QR
async function loadQr(BOLT11) );
setQrCode(qrCode);
}
Lastly, wait until that invoice is paid in full, and return some action to user.
async function waitForPayment(invoiceId) /wait`
);
return payment ? paymentSuccess() : waitForPayment(invoiceId);
}
That’s all! You’ve just built a basic lightning-app using BTCPay/c-lightning/lightning-charge. PLEASE keep in mind I kept this simple for demonstration purposes only. I hope you enjoyed reading!
Here’s the finished product!
Full code is posted on Github here →
Twitter:
Github:
Published at Sat, 30 Mar 2019 01:16:07 +0000
