> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.alphax.asia/llms.txt.
> For full documentation content, see https://docs.alphax.asia/llms-full.txt.

# SDK

## Obtain Public Client Key

Visit AlphaX's dashboard, go to **Developers > Public Clients** and create a new Public Client.

Once you have created the Public Client, you will be able to see the Public Client Key. This key is essential for integrating the AlphaX Payments SDK into your web application.

## Inject the SDK

```
https://alphax-payment-sdk.b-cdn.net/main/payment-sdk.js
```

To integrate the AlphaX Payments SDK into your web application, include the following script tag in your HTML:

```html
<script src="https://alphax-payment-sdk.b-cdn.net/main/payment-sdk.js"></script>
```

<Info>
  Please don't download the SDK and host it on your own server, as we will be updating the SDK regularly to add new features and fix bugs. By using the CDN link, you will always have access to the latest version of the SDK without needing to manually update it.
</Info>

## Initialize the SDK

After including the SDK script in your HTML, you can initialize the SDK using the following code:

```javascript
await AlphaXPayment.init({
    clientId: '<your_client_id_here>',
    environment: 'production', // available: production, demo
    onInitialized() {
        // on initialized, do your stuff
    },
    onPaymentSucceeded(res) {
        // when we submit the payment and it's all good, this function will be triggered
        // you will have the order information in "res"
        console.log('Payment succeeded', res);
    },
    onPaymentFailed(error) {
        // When it fails to charge the user, you can use the "error" to show up to your
        // customer
        console.error('Payment failed', error);
    },
});
```

### Create a Payment Element

To create a payment element, use the following code:

```javascript
await AlphaXPayment.createPaymentElement({
    // Pass your unique orderID here
    orderId: 'order' + Date.now(),
    amount: 10.50,
    currency: 'USD',
    mountElement: '#payment',
    firstName: 'John', // not required
    lastName: 'Snow', // not required
});
```