Authenticate with Passkey

Recommended: JavaScript SDK with React Hooks

For new React apps, we recommend the JavaScript SDK with React Hooks (@dynamic-labs-sdk/react-hooks) instead of the legacy React SDK documented here. The JS SDK comes with many benefits such as a much smaller bundle size and other optimizations. Use the React quickstart (JavaScript SDK) to get started.

Dashboard Configuration

Simply toggle on “Passkey” in the Log in & User Profile section of the dashboard.

The user must have already signed in via another method (e.g. email/password, social, etc.) and added a passkey to their account before they can use it to sign in with.

You can prompt a user to add a passkey to their account using your SDK’s passkey registration method (see SDK-specific Tabs) or by directing them to the “Account & Security” section of the Dynamic Widget.

Using our UI

Once toggled on, these methods will be available in the Dynamic widget.

Using your UI

All we will need for this use case is the useSignInWithPasskey hook.

Once you have those available in your component, the rest is as simple as building your form!

Code Example

React

import { useSignInWithPasskey } from '@dynamic-labs/sdk-react-core';

const App = () => {
  const signInWithPasskey = useSignInWithPasskey();

  return (
    <button
      onClick={() => signInWithPasskey()}
    >
      Sign in with passkey
    </button>
  );
};