Introducing a Modernized Braintree JavaScript SDK

Updated August 11, 2016

We're proud to introduce version 3 of our Braintree JS SDK.

Late last year, we refreshed our mobile SDKs. Now we’re rolling out new JavaScript SDK improvements to match.

Our prior JavaScript SDK assumes an integration with forms and form-based event handlers. That SDK made such integrations easy by handling the work required to build a form-based checkout flow.

The web has changed. Today, merchants commonly build single-page apps and dynamic, JS-heavy checkout experiences. To prevent the need for unpleasant workarounds, we've architected the next version of our SDK to be perfectly at home in the modern web.

With this release, we've redesigned the JS SDK to be flexible enough to suit a wide variety of scenarios, including single-page apps. The API no longer relies on forms, and now uses a limited amount of DOM interaction. If the high-level API doesn’t do what you need, we’ve exposed the API client for fine-grained control of how you use Braintree. We make fewer assumptions about your page, giving you the power to do what you want.

We've also added plenty of improvements.

With Hosted Fields, we now automatically format card numbers and expiration dates to make entering and reading text easier. We have open-sourced this piece of functionality as the restricted-input npm package. The new Hosted Fields is easy to customize. Here are some examples of how you can create a custom theme for your Hosted Fields.

The Braintree JS SDK v3 is organized as a collection of separate components, not pre-baked integrations. Rather than one big .js file, you can pick and choose the components that you need. This flexibility makes including Braintree smaller and lighter on load times.

Why upgrade?

  • Composable components: better for advanced integrations.
  • Smaller file size: faster load times, better performance.
  • Custom PayPal button: the flexibility to trigger a PayPal payment on any user action.
  • Hosted Fields formatting: enables a friendly user interface.
  • No dependence on forms: plays nicely with single-page apps.

New reference documentation

API documentation is a first-class citizen in our development process. With this new release, we are introducing a JSDoc reference to provide specific, in-context explanations and examples for all of our public APIs.

Available now

The release includes:

Open source

We've open sourced version 3 of our Braintree JS SDK, as we've done for iOS and Android. We love open source, and we're pleased to involve the community in our development process!

Stay in touch

To be the first to know about our upcoming releases, join the Braintree SDK Announce mailing list. We'll use this list to email you about future releases.

Have feedback or questions? Please create Issues and Pull Requests on our braintree-web GitHub repository.

Resources

***
Elliot Lee Elliot built a solar car and developed a bunch of mobile apps. He fell into payments by way of bitcoin. Now he's on the Developer Experience team at Braintree. He loves learning and picnics. More posts by this author

You Might Also Like