Skip to main content

If you are using our backend SDK that is lesser than the following versions, please visit the older documentation link here.

Frontend Integration

Supported frameworks#

React logoVue.js logoAngular logoAndroid logoIOS logoElectron logoCapacitor.js logoJavascript logo

1) Install#

npm i -s supertokens-web-js

2) Call the init function#

Call the following init function at the start of your app (ideally on the global scope).

import SuperTokens from 'supertokens-web-js';
import Session from 'supertokens-web-js/recipe/session';
import ThirdParty from 'supertokens-web-js/recipe/thirdparty'
import Passwordless from 'supertokens-web-js/recipe/passwordless'

SuperTokens.init({
appInfo: {
apiDomain: "<YOUR_API_DOMAIN>",
apiBasePath: "/auth",
appName: "...",
},
recipeList: [
Session.init(),
Passwordless.init(),
ThirdParty.init()
],
});

What to do next?#

The above code snippet sets up session management network interceptors on the frontend. Our frontend SDK will now be able to automatically save and add session tokens to each request to your API layer and also do auto session refreshing.

The next steps are to:

  • Step 2: setup the backend SDK in your API layer
  • Step 3: Setup the SuperTokens core (sign up for managed service, or self host it)
  • Step 4: Enable the user management dashboard
  • Use the frontend SDK's helper functions to build your own UI - follow along the docs in the "Using your own UI" section and you will find docs for this after "Step 4".
Looking for older versions of the documentation?
Which UI do you use?
Custom UI
Pre built UI