Skip to content

marcin-slezak/voucherify-js-sdk-issue-206

 
 

Repository files navigation

Official Voucherify JS SDK and React Widget

Build Status SDK NPM Version SDK NPM Downloads React Widget NPM Version React Widget NPM Downloads


Documentation | Marketer-ready Voucherify snippet | Migration | Typescript | Error handling | Legacy SDKs | Contributing | Changelog

Packages: Voucherify JS SDK | Voucherify React Widget

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

Learn more about Voucherify by visiting our site.

📝 Documentation

You will find detailed description and example responses at our official documentation. Most method headers point to more detailed descriptions of arguments you can use.

You can also use our detailed documentation provided by our package here.

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

👽 Having troubles? Check our Help center.

🧪 Looking for promotion ideas? Check our Cookbook to get an inspiration.

⚙️ Installation

Voucherify JS SDK

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

Go here to 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.

Go here to learn more about Voucherify React Widget installation.

🏎 Marketer-ready Voucherify snippet

Go here for 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 way - iframe and jQuery

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

↔️ Migration

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

🦸 TypeScript

Both Voucherify JS SDK and Voucherify React Widget support TypeScript declarations. We recommend using TypeScript Version 4.2.

You can find TS example in examples/sdk/with-nodejs-typescript.

😨 Error handling

Voucherify error object always has consistent structure, described in details in our API reference.

If you wish to see code examples for server-side error handling, you can check it here:

Structure / typing for error returned from Voucherify API can be seen here:

If you wish to receive original AxiosError when VoucherifyError is thrown then you need to explicitly set exposeErrorCause property to true when creating instance of VouchierfyClient, ie:

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

Original AxiosError will be available under cause property of VoucherifyError

👴 Legacy Voucherify JS SDKs

Legacy client-side Voucherify JS SDK is available here: voucherify.js.

Legacy server-side Voucherify JS SDK is available here: 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 React Widget CHANGELOG can be found here.

Voucherify JS SDK CHANGELOG can be found here.

About

Voucherify SDK for JavaScript and node.js – coupons, vouchers, promo codes

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 91.9%
  • CSS 6.6%
  • JavaScript 1.5%