react-auth-utils

🔐 Simple and lightweight React authentication library for seamless user authentication in your projects.

Features

• Easy integration with React applications
• Authentication state management
• Protected route components
• Token handling utilities

Installation

You can install react-auth-utils using npm or yarn:

npm install react-auth-utils
# or
yarn add react-auth-utils

Usage

AuthProvider

Wrap your application with the AuthProvider to provide authentication state to your components.

import { AuthProvider } from 'react-auth-utils';

function App() {
  return <AuthProvider>{/* Your application components */}</AuthProvider>;
}

useAuth

Use the useAuth hook to access authentication state in your components. The useAuth hook provides the following properties:

Property	Description
isAuthenticated	A boolean indicating whether the user is authenticated.
user	The user object containing user information (optional, may be null if not authenticated).
token	The authentication token (optional, may be null if not authenticated).
signIn	A function to sign in the user.
signOut	A function to sign out the user.

Sign In

const { signIn } = useAuth();

const fakeJWT = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.';
const expireIn2MinFromNow = Date.now() + 2 * 60 * 1000;
const fakeUser = {
  id: 1,
  username: 'admin',
  email: '[e-mail]',
};

signIn(fakeJWT, expireIn2MinFromNow, fakeUser);

ProtectedRoute

Use the RequireAuth component to protect routes that require authentication.

<RequireAuth unauthenticated={<Navigate to="/login" replace={true} />}>
  <ProtectedHomePage />
</RequireAuth>

Contributing

We welcome contributions! Feel free to submit issues and pull requests.