🪄 Create your first product

After completing the steps in Getting Started, you can finally create your first product on the BrixPay Console. When you connected your wallet, you need to go to /products, where you'll see a product creation form, and below that your created products:

Now you need to provide your information, such as name, network, interval, token address, amount and a webhook Url (which you can change later on).

Note: When you change the network, a window from your wallet provider might pop up, don't be confused by that, it is not a bug, it only changes the network you're on, and it does not create the product.

An example on how your filled out form could look like:

Now click on "Create Product" and sign the transaction which costs about a $0.05 fee (called "gas fee") for the blockchain, but because we are on a testnet, that doesn't cost you any real money or crypto. After one refresh you will see your newly created product under the form, and you can change your webhook Url if needed.

💸 implement the checkout link

Happy you made it this far! In order to be able to start accepting payments, you'll of course need a checkout page. Each of your products has a checkout page, which consists of our domain, the network the product's on, the address that created the product, the product ID (that is you can get from /products, but the product IDs are sequential, so it shouldn't be hard 😄) and a user ID which will be covered in the /webhooks part. Available networks for the url are arbitrumsepolia, unichainsepolia and basesepolia. Its format is:

https://checkout.brixpay.io/[network]/[merchantAddress]/[productId]?userId={userId}

Example:

https://checkout.brixpay.io/arbitrumsepolia/0x694B21d5190000149a7016743955A49986176796/0?userId=user_918gIcIdVUv03Nk

(You can ignore the userId for now.) When you constructed your checkout link, you should definitely check it out by pasting the url in your browser. To implement it in your code, you just a simple <a> tag with the text i.e. "Pay with crypto":

export default function BuyButton({ userId }) {
  return (
    <a
      // TODO: Change the chain, merchantAddress and productId!
      href={`https://checkout.brixpay.io/arbitrumsepolia/0x694B21d5190000149a7016743955A49986176796/0?userId=${userId}`}
      target="_blank"
      className="px-4 py-2 bg-[#29f6e3] text-black cursor-pointer hover:shadow-lg shadow-[#29f6e3]/40 active:shadow-[#29f6e3]/70 transition duration-150"
    >
      Pay with crypto
    </a>
  )
}
And you will get:Pay with crypto

Great, so if you're using BrixPay to let people tip or support you, you're done and you can ignore the userId and cut the ?userId= from the url. If you have a SaaS or need webhooks anyway, you will need to provide a userId, this ID is the way you identify your users, this could be a wallet address, email address, or some uuid. This is crucial because in the first webhook you receive, you get this userId back and the Brix wallet address of the user, but in every other webhook only the Brix wallet address, so you need to map to know who paid for what. More on that in /webhooks.