openfort-xyz/openfort-react

React SDK for embedded wallets. Includes authentication, wallet connector and payments. Both with UI elements and headless.

Website | Documentation | X | Demo

Openfort React SDK

The easiest way to use embedded wallets, with built-in authentication and payments capabilities in React.

Features

• 💡 TypeScript Ready — Get types straight out of the box.
• 🌱 Ecosystem Friendly — Uses top libraries such as wagmi for hooks.
• 🎨 Simple UI — Use prebuilt elements for authenticaiton and wallet connection.
• 🖥️ React Hooks - To interact directly with embedded wallet capabilities.

and much more...

Quick Start

New app

Get started with create Openfort + wagmi + viem project by running one of the following in your terminal:

npm

npx create openfort

yarn

yarn create openfort

pnpm

pnpm create openfort

Import Openfort to your project

Add Openfort to your already existing project.

npm

npm install @openfort/react @tanstack/react-query wagmi viem

yarn

yarn add @openfort/react @tanstack/react-query wagmi viem

pnpm

pnpm add @openfort/react @tanstack/react-query wagmi viem

Examples

There are various runnable examples included in this repository in the examples folder:

• Create React App Example (TypeScript)
• Next.js Example (TypeScript)
• Vite Example (TypeScript)

Running Examples Locally

Clone the project and install the necessary dependencies:

$ git clone git@github.com:openfort-xyz/openfort-react.git
$ cd openfort
$ yarn install

and start the code bundler:

$ yarn dev:kit

and then simply select the example you'd like to run:

$ yarn dev:vite # Vite
$ yarn dev:nextjs # Next.js
$ yarn dev:cra # Create React App

License

See LICENSE for more information.

Credits

Openfort is a fork of Connectkit developed by Family. We're grateful to them for making Connectkit fast, beautiful and open-source.