Skip to main content
Stytch is architected to be embedded directly into your application, offering you flexibility and control over your integration and creating a seamless and native experience for users. There are three different high level approaches to integrating Stytch directly into your application:
  1. Backend Integration: entirely server-side integration, where your backend calls Stytch’s API through our backend SDK
  2. Headless Frontend Integration: your client invokes Stytch’s headless frontend SDKs, which handles things like client-side session management out of the box, while providing flexibility in UX and UI
  3. Pre-built UI Frontend Integration: your client mounts the Stytch UI component on relevant routes, and the Stytch SDK handles the full login flow automatically
While we describe these as distinct integration options, most customers mix-and-match approaches to fit their needs. If you are using our pre-built UI for login, you might still leverage the headless methods for post-login changes (e.g. updating profile information) and if you are using our frontend SDKs, it is important to still do server-side session authentication checks with our backend SDKs for security reasons. Stytch offers APIs and SDKs for backend, frontend headless, and frontend pre-built UI integrations.

Choosing an integration approach

Stytch’s frontend SDKs are built on top of our backend SDKs, and you can always change integration approaches in the future without any disruption to your application. Picking which approach to use to start largely comes down to how much you want to offload to Stytch vs how much flexibility and control you want. The below are key differences to consider when deciding which approach is right for your use case and needs:

Pre-built UI integration

Stytch UI is the fastest way to ship login and signup. Your frontend renders pre-built UI components, while the SDK handles authentication and session creation. At a high level, the flow looks like this:
  1. The end user attempts to log into your application with Stytch’s pre-built UI components configured on your frontend.
  2. The frontend SDK handles UI events and calls the Stytch API with the authentication data.
  3. The Stytch API processes the request and returns a response.
  4. Your frontend handles the response via callbacks or redirect URLs, and may relay data to your backend.
  5. The frontend SDK manages session tokens in browser cookies or mobile storage.

When to use headless methods

Even with Stytch UI, some flows require headless SDK calls (or backend integration), such as completing a magic link redirect or handling advanced session logic. The headless integration guide covers these shared considerations.

Unsupported auth methods

Pre-built UI supports Email Magic Links, OAuth, OTPs, Passwords, and more. Auth methods like TOTP and WebAuthn require headless SDK or backend integration.

Frontend JS SDKs

Mobile SDKs

API & Backend SDKs

Read the backend implementation guide for more in-depth implementation details and considerations.

Still unsure what to choose?

If you have additional questions about our different integration options, please feel free to reach out to us in our community Slack, our developer forum, or at support@stytch.com for further guidance.