In this guide, we’ll walk through the process of creating a new end user with a passkey.
@turnkey/sdk-server
: Used on the server-side to leverage the parent organization’s public/private API key pair to create the new user’s sub-organization.@turnkey/sdk-browser
: Used on the client-side to complete the email recovery process by adding an end-user passkey.@turnkey/sdk-react
: Used for Next.js applications to initialize the Turnkey SDK.TurnkeyProvider
providing the required configuration options. This allows you to use the Turnkey client throughout your app via the useTurnkey()
hook.NEXT_PUBLIC_ORGANIZATION_ID
should be set to the parent organization ID which can be found in the Turnkey Dashboard.The NEXT_PUBLIC_TURNKEY_RP_ID
should be set to your application’s desired relying party ID; this is typically your domain, or localhost if developing locally. See this page for more details.passkeyClient
, which will enable your application to interact with passkeys.
"use client"
directive to the Recovery component to as react hooks can only be used client-side.createUserPasskey
SDK function. Calling this method will prompt the user to create a passkey, which will be securely stored by their browser. This credential will be associated with the user’s account (sub-organization) and used for future authentication. Once the credential is created, we’ll use it in the next step to create a new sub-organization that corresponds to the user.
createUserPasskey
includes an encoded challenge and attestation. The encoded challenge ensures the request is fresh and legitimate, while the attestation verifies the authenticity of the device creating the credential. For more information on how passkeys work, including details on the challenge and attestation objects, you can refer to the Passkeys Documentation.@turnkey/sdk-server
package. This allows you to use the parent organization’s public/private API key pair to create sub-organizations.
"use server"
directive at the top of the file where you’re initializing the Turnkey server client. This will ensure that the function is executed on the server-side and will have access to the server-side environment variables e.g. your parent organization’s public/private API key pair. For more information on Next.js server actions, see the Next.js documentation on Server Actions and Mutations.createSubOrganization
that will be used to create a new sub-organization from the server-side. This method will be called from the client-side with the end-user’s details.
createSubOrganization
server action to be called from the client-side.Import the server action
Call createSubOrganization with the end-user's details
create-suborg.tsx