> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dynamic.xyz/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# MFA Overview

<Card title="Recommended: JavaScript SDK with React Hooks" icon="react" color="#4779FE">
  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)](/javascript/reference/react-quickstart) to get started.
</Card>

Multi-Factor Authentication (MFA) adds a layer of security to your app. MFA is structured as **enrollment** (users register a second factor) and **enforcement** (when it is required—at login and/or for specific actions like transactions).

<Info>
  Before implementing MFA in your application, configure MFA settings in the dashboard. See [End-User MFA](/overview/developer-dashboard/end-user-mfa) for enrollment and enforcement (session-based and/or action-based), configuration options, and dashboard setup.
</Info>

<Tip>
  Users can use passkeys or TOTP devices for MFA - each guide covers both.
</Tip>

<CardGroup>
  <Card title="MFA Enrollment" href="/react/authentication-methods/mfa/account-based">
    Learn how to implement MFA enrollment (registering a TOTP device or Passkey).
  </Card>

  <Card title="Action-based enforcement" href="/react/authentication-methods/mfa/action-based">
    Learn how to implement action-based enforcement (MFA for sensitive actions).
  </Card>

  <Card title="Step-up authentication" href="/react/authentication-methods/step-up-auth/overview">
    Step-up auth (the broader category) requires re-verification before sensitive actions; MFA is one way to satisfy it. This guide uses the useStepUpAuthentication hook.
  </Card>
</CardGroup>