Make sure to register for free to get an app token to use the interface.

We offer an existing form that can be customized and seamlessly integrated into any React application. Run npm install iltio to install it.

import { Authentication } from 'iltio/react'

export const MyAuthentication = () => (
  <Authentication
    configuration={{ token: APP_TOKEN }}
    onSuccess={(name, token) => console.log(name, token)}
  />
)

It's possible to route the requests through your own server in order to keep the app token or the use of this service hidden. Refer to the Node Backend Integration chapter in advanced concepts.

The React Native Authentication mostly mirrors the React plugin except it's using custom UI components.

import { Authentication } from 'iltio/native' // Requires "unstable_enablePackageExports" in metro configuration.
import { Authentication } from 'iltio/dist/native/index.js' // Fallback without exports.

export const MyNativeAuthentication = () => <Authentication {...} />

Check out the React Native Forms chapter for more details on customization of this form.

iltio offers Next.js plugins allowing you to access authentication through your own server and use first-party cookies to store the authentication tokens in. Properly integrating authentication into the Next.js architecture requires additional effort. To still keep it as simple as possible iltio offers an API handler as well as the necessary middleware and the cookie storage configuration.

import { useRouter } from 'next/router'
import { CookieStorage } from 'iltio'
import { Authentication } from 'iltio/react'

export default function Home() {
  const router = useRouter()

  return (
    <Authentication
      configuration={{
        url: '/api/authentication',
        token: 'demo',
        storage: CookieStorage,
      }}
      onSuccess={() => router.push('/user')}
    />
  )
}

// File: pages/api/authentication/[...path].ts
import { handler } from 'iltio/next'

export default handler

Read more about the integration into Next.js under Advanced Concepts.

The plugin is also available for Vue and Svelte .

If you want to build your own form the plugin also provides helper methods for various parts that will be required for the authentication. The Interface documentation lists all the routes available.