@mathiscode/voucherify-js-sdk

v2.7.7

Published

2 months ago

Downloads

0High
0Medium
0Low

- ! THIS IS THE README OF THE MONOREPO ! -

Go to React Widget readme

Voucherify empowers marketers and developers with flexible building blocks to come up with, implement, and track targeted promotional campaigns.

Visit Voucherify to learn more.

📝 Documentation

Find detailed description and example responses at Voucherify developer documentation. Most method headers point to more detailed descriptions of arguments you can use.

You can also use the detailed JS SDK documentation.

📚 Want to learn more? Visit Voucherify official site or Success Portal.

👽 Having troubles? Check out the Help center.

⚙️ Installation

Voucherify JS SDK

Voucherify JS SDK is a JavaScript SDK and it is fully consistent with the restful API Voucherify provides and it has a fully integrated TypeScript support. It also combines together the previously maintained Voucherify Node.js SDK and Voucherify.js SDK.

Learn more about Voucherify JS SDK installation.

Voucherify React Widget

Voucherify React Widget contains several client-side Voucherify methods, which are useful in integrating your promotion logic straight to your e-commerce store.

Learn more about Voucherify React Widget installation.

🏎 Marketer-ready Voucherify snippet

More HTML-based examples

<body>
  <div id="voucher-validate"></div>

  <link rel="stylesheet" type="text/css" href="https://unpkg.com/@voucherify/[email protected]/dist/voucherify.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/qs/6.5.1/qs.min.js" crossorigin></script>
  <script src="https://unpkg.com/react@17/umd/react.production.min.js" crossorigin></script>
  <script src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js" crossorigin></script>
  <script src="https://unpkg.com/axios/dist/axios.min.js" crossorigin></script>
  <script type="text/javascript" src="https://unpkg.com/@voucherify/[email protected]/dist/voucherifysdk.umd.production.min.js" crossorigin></script>
  <script type="text/javascript" src="https://unpkg.com/@voucherify/[email protected]/dist/voucherifywidget.umd.production.min.js" crossorigin></script>

  <script type="text/javascript">
    window.ReactDOM.render(
      window.React.createElement(VoucherifyWidget.VoucherifyValidate, {
        clientApplicationId: 'CLIENT-APPLICATION-ID',
        clientSecretKey: 'CLIENT-SECRET-KEY',
        amount: true,
      }),
      document.querySelector('#voucher-validate'),
    )
  </script>
</body>

Alternative Ways – iframe and jQuery

If you're looking for something plain and simple, you're used to working with iframe and jQuery on your website, and for whatever technical reason the React-based snippet doesn't work for you, you may want to stick with the legacy voucherify.js SDK for the time being. In this case, refer to the widget section in the documentation.

↔️ Migration

Check out the MIGRATION GUIDE to learn more about switching to the newest Voucherify JS SDK.

🦸 TypeScript

Both the Voucherify JS SDK and Voucherify React Widget support TypeScript declarations. It's recommended to use TypeScript Version 4.2.

Explore also Voucherify TS examples.

😨 Error Handling

A Voucherify error object always has a consistent structure, described in details in the API reference.

Check out code examples for server-side error handling:

Also, see the structure / typing for error returned from Voucherify API:

VoucherifyError class

If you want to receive an original AxiosError when a VoucherifyError is thrown, you need to explicitly set the exposeErrorCause property to true when creating the instance of VouchierfyClient:

const voucherify = VoucherifyServerSide({
	applicationId: 'APPLICATION-ID',
	secretKey: 'SECRET-KEY',
	exposeErrorCause: true
})

The original AxiosError will be available under cause property of VoucherifyError.

👴 Legacy Voucherify JS SDKs

You can always visit legacy Voucherify JS SDKs:

Client-side Voucherify JS SDK: voucherify.js.
Server-side Voucherify JS SDK: voucherify-nodejs-sdk.

🛠️ Contributing

Bug reports and pull requests are welcome through GitHub Issues.

Read more about how to Contribute to Voucherify JS SDK by visiting CONTRIBUTING.md.

🗄️ Changelog

Voucherify JS SDK CHANGELOG.

Voucherify React Widget CHANGELOG.

🧪 SDK Tests

SDK tests are located in a test folder and use real calls to Voucherify API via client.ts.

// add this to your test
import { voucherifyClient as client } from './client'

In order to run SDK tests, you need to copy packages/sdk/.env.example to packages/sdk/.env and fill the file with your credentials.

In order to run SDK tests, go to the packages/sdk folder and run yarn test.