Simplify your Auth flow when working with React apps
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) |
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 |
Install the core library:
npm install @forward-software/react-authDefine 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-googlepackage provides a drop-in Google Sign-In adapter with a pre-builtAuthClientandGoogleSignInButtonfor both Web and React Native. See its README for setup instructions.
This project is a monorepo managed with pnpm workspaces:
react-auth/
├── lib/ # @forward-software/react-auth (core library)
├── packages/
│ └── google-signin/ # @forward-software/react-auth-google (Google Sign-In adapter)
└── examples/ # Example applications (base, reqres, refresh-token, expo)
For a detailed breakdown of the source layout and architecture, see the Contributing Guide.
pnpm installSee the Contributing Guide for the full list of build, test, and lint commands.
Contributions are welcome! Here's how to get started:
- Fork the repo and create your branch from
main - Install dependencies:
pnpm install - Make your changes and add/update tests
- Ensure everything works:
pnpm -r lint && pnpm -r test && pnpm -r build - Commit using Conventional Commits (e.g.,
feat: ...,fix: ...) - 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.
This library has been inspired by react-keycloak and similar libraries.
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.