React Auth

Simplify your Auth flow when working with React apps

Packages

This monorepo contains the following packages:

Package	Version	Description
@forward-software/react-auth		Core library — provides AuthClient, AuthProvider, createAuth, and useAuthClient for integrating authentication flows in any React or React Native app
@forward-software/react-auth-google		Google Sign-In adapter — ready-made AuthClient implementation and drop-in GoogleSignInButton for Web and React Native (Expo)

Examples

The examples folder contains some examples of how you can integrate these libraries in your React app:

Example	Description
base	Basic authentication flow using @forward-software/react-auth
reqres	Authentication using the ReqRes API
refresh-token	Token refresh flow with Axios interceptors
expo	React Native (Expo) integration

Quick Start

Install the core library:

npm install @forward-software/react-auth

Define your auth client:

import { createAuth, type AuthClient } from '@forward-software/react-auth';

const authClient: AuthClient = {
  onLogin: async (credentials) => {
    // Exchange credentials for tokens
    return { token: '...' };
  },
};

export const { AuthProvider, useAuthClient } = createAuth(authClient);

Wrap your app:

import { AuthProvider } from './auth';

function App() {
  return (
    <AuthProvider>
      <YourApp />
    </AuthProvider>
  );
}

Use the hook to interact with the auth client:

import { useAuthClient } from './auth';

function LoginButton() {
  const authClient = useAuthClient();
  return <button onClick={() => authClient.login({ username: '...', password: '...' })}>Log in</button>;
}

For more details, see the @forward-software/react-auth README.

Looking for a ready-made integration? The @forward-software/react-auth-google package provides a drop-in Google Sign-In adapter with a pre-built AuthClient and GoogleSignInButton for both Web and React Native. See its README for setup instructions.

Project Structure

This project is a monorepo managed with pnpm workspaces:

react-auth/
├── lib/                        # @forward-software/react-auth (core library)
│   ├── src/                    # Source code
│   └── test/                   # Unit tests
├── packages/
│   └── google-signin/          # @forward-software/react-auth-google (Google Sign-In adapter)
│       ├── src/
│       │   ├── web/            # Web implementation (Google Identity Services)
│       │   └── native/         # React Native implementation (Expo module)
│       ├── android/            # Android native module
│       ├── ios/                # iOS native module
│       └── test/               # Unit tests
└── examples/                   # Example applications
    ├── base/                   # Basic React example
    ├── reqres/                 # ReqRes API example
    ├── refresh-token/          # Token refresh example
    └── expo/                   # React Native (Expo) example

Getting Started

Prerequisites

• Node.js (LTS recommended)
• pnpm (see packageManager in package.json for the required version)

Installation

pnpm install

Building

# Build all packages
pnpm -r build

Testing

# Run tests across all packages
pnpm -r test

Contributing

Contributions are welcome! Here's how to get started:

1. Fork the repo and create your branch from main
2. Install dependencies: pnpm install
3. Make your changes and add/update tests
4. Ensure everything works: pnpm -r lint && pnpm -r test && pnpm -r build
5. Commit using Conventional Commits (e.g., feat: ..., fix: ...)
6. Open a pull request

For more details, read the Contributing Guide and the Code of Conduct.

Found a security issue? Please report it privately — see our Security Policy.

Credits

This library has been inspired by react-keycloak and similar libraries.

License

MIT

---

Made with ✨ & ❤️ by ForWarD Software and contributors

If you found this project to be helpful, please consider contacting us to develop your React and React Native projects.