React Guide

React Authentication

Add authentication to any React app with pre-built components, hooks, and protected routes. Works with Vite, CRA, and any React 18+ setup.

Why GitHat for React

No framework lock-in. GitHat's React SDK works with Vite, Create React App, Remix, or any React setup. Same components, same hooks, same developer experience everywhere.

Quick Setup

Three steps to auth: install the SDK, add the provider, and use the components. ProtectedRoute handles redirects for unauthenticated users. useAuth() gives you the current user and org.

Route Protection

Client-side route protection is simple: wrap dashboard pages in ProtectedRoute. It checks auth state, shows a loading fallback, and redirects to sign-in if needed. Combine with React Router for full SPA auth.

Install

npm install @githat/nextjs

Example

// main.jsx (Vite)
import { GitHatProvider } from '@githat/nextjs';
import '@githat/nextjs/styles';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')).render(
  <GitHatProvider config={{
    publishableKey: import.meta.env.VITE_GITHAT_KEY,
    afterSignInUrl: '/dashboard',
  }}>
    <App />
  </GitHatProvider>
);
Try GitHat free

Ship authenticated apps in minutes, not weeks.

Related