---
title: React Router Framework Mode
description: Add Sudomimus Connect login to React Router Framework Mode.
editUrl: true
head: []
template: doc
sidebar:
  order: 3
  hidden: false
  attrs: {}
pagefind: true
draft: false
---

`@sudomimus/react-router` maps Connect login to server actions and loaders.

```ts
// app/sudomimus.server.ts
import { createReactRouterHandlers } from "@sudomimus/react-router";

export const sudomimus = createReactRouterHandlers(options);
```

```ts
// app/routes/login.tsx
export const action = sudomimus.startAction;

// app/routes/auth.callback.tsx
export const loader = sudomimus.callbackLoader;

// app/routes/logout.tsx
export const action = sudomimus.logoutAction;
```

Use `sudomimus.current({ request })` only from server loaders and actions. Configure a shared durable `WebAuthStore`, keep CSRF protection enabled for POST actions, and permit the callback URL with a CALLBACK ReturnRule.

[View package source](https://github.com/sudomimus/sudomimus/tree/master/sdks/typescript/packages/react-router)