Instant Bitcoin Payments with Replit and ZBD API

As a Bitcoin payments API infrastructure provider, one of the many items we aim to always improve upon is developer-time-to-payment — how long does it take for a new ZBD developer to perform their first global Bitcoin payment?

Because of that, our team is always focused on introducing new ways to quickly get started in a secure server environment and interacting with the ZBD API or SDKs.

Replit is an online integrated development environment (IDE) that allows users to write, run, and collaborate on code directly from their web browser. Basically, any developer can spin up an entire development environment on the language of their choosing, and go from first code commit to full production deployment all in the same web interface.

Add the flexibility developers have with cloud-based IDEs like Replit, to the simplicity of the ZBD API for global instant Bitcoin payments and you have a winner!

​

Getting Started

Head on over to Replit.com and create a free account if you don’t already have one.

Once you’re in, find the zbd-nextjs-dev-playground template.

​

Using the Template

Click the USE TEMPLATE button on top right and give your new project a name. Your repl instance will begin to boot up and you’ll see the robust IDE interface from Replit begin to take shape in the page.

We’re basically done, now just need to connect a ZBD API Key to this new repl instance.

If you don’t yet have a ZBD Dev Dashboard account, head on over to the official how-to documentation or the ZBD Developer Dashboard signup page. Once you’ve got your account setup and verified, create a new Project and fetch its LIVE API Key from the dashboard (important: it HAS to be a LIVE API Key, a SANDBOX API Key will not work). It should look something like this:

​

Setting Environment Variables

Now to place the ZBD API Key securely in the Replit dashboard, search for the Secrets tool on the sidebar:

Click to NEW SECRET and name it ZEBEDEE_API_KEY and paste the key you copied from the ZBD Developer Dashboard.

That’s it! You’re all set.

​

Running the Repl

Now press the big green RUN button on the top of the Replit page and you should see a new Webview module pop up with the template’s frontend loaded.

You can now head on over to your repl’s web url, mine is: https://zebedee-nextjs-dev-playground.andrerfneves.repl.co, and you should see your newly deployed ZEBEDEE-powered application!

​

Template Walkthrough

The bottom 4 navigation item links take you to other ZBD API and ZBD Developer Dashboard learning resources. You can also find detailed documentation about the @zbd/node Node.js SDK. Lastly, there are guides on how to best deploy this starter kit to services like Vercel and Replit (this guide!).

At the top right of the web app you will find the OPEN PLAYGROUND link. Clicking that will take you to the ZBD + Next.js Dev Playground page which contains modules for the main use-cases of the ZBD API — Payments and Payment Requests (Charges), Lightning Address Payouts, Withdrawal QR codes, BTCUSD price ticker and much more.

On the top right you can see the ZBD Project Wallet detailing the balance of Bitcoin (in satoshis) available to this ZBD API Project key.

Each module is self-contained, which means you can just fill in each of the form elements and hit Submit to watch the magic happen. Results will appear inline.

You can now literally send Bitcoin instantly anywhere in the world! No big deal.

Here’s a Bitcoin Lightning Network payment request QR code I created by filling in the two input fields and hitting 1 button click.

Here I am sending a Bitcoin payment that’s settling instantaneously through the Lightning Network — this time sent to a Lightning Address (e.g. andre@zbd.gg).

The template is meant to serve as both a set of example source code files for developers to learn and get ideas from, as well as a full-blown backend + frontend app development environment. Because it is based on the Next.js framework, developers can get started editing code directly on the template’s JavaScript files and watch their changes reflect live on the accompanying Webview.

​

Troubleshooting

If you start your repl and it provides a message like the one below, it means you have not properly configured the ZEBEDEE_API_KEY in your Replit project’s Secrets.