# Front-end Integration for 3DS

In addition to the Forter's Javascript snippet and Mobile SDKs that share user behavior information, you'll need to incorporate Forter's 3DS client components into the front-end of your website and mobile applications. These are used in the 3DS Initialization and 3DS Challenge phases for easier integration. See usage in [client-side handling](https://docs.forter.com/VJT0xm_khCBeO6KMsqfMC#client-side-handling-of-managedordertoken "client-side handling").

### [3DS Javascript for your website](https://docs.forter.com/front-end-integration-for-3ds#3ds-javascript-for-your-website) 3DS Javascript for your website

Add Forter's checkoutTools library to your checkout page, wherever the card entry iframe is located. The script should be pasted directly before the closing HTML </body> tag. Note that this should not override or conflict any other existing Forter JavaScript snippets already on the site.

```html
<script type="text/javascript" data-site-id="{your-forter-site-id}" id="checkoutTools__script" src="https://sdk.checkouttools.com/v1.2/managedOrders.js"></script>
```

Do not remove any existing Forter JavaScript snippets.

### [3DS Mobile SDKs / JS for your App](https://docs.forter.com/front-end-integration-for-3ds#3ds-mobile-sdks-js-for-your-app) 3DS Mobile SDKs / JS for your App

If your application is developed using native code, utilize the native [3DS Android SDK](https://docs.forter.com/3ds-android-sdk "3DS Android SDK") and [3DS iOS SDK](https://docs.forter.com/3ds-ios-sdk "3DS iOS SDK") seamless integration.

For non-native applications (React Native/Flutter) using a **WebView**, the addition of the **3DS** JS to your checkout page covers apps that incorporate hybrid or mobile browsers.
