@nerdlat/auth/README.md

Authentication library similar to Clerk for React and Express applications

# @nerd/auth

Una librería de autenticación simple e inspirada en Clerk para aplicaciones React y Express.

## Instalación

```bash
npm install @nerd/auth
# o
yarn add @nerd/auth
# o
pnpm add @nerd/auth
```

## Configuración del Servidor

### 1. Configuración básica con Express

```typescript
import express from 'express';
import cookieParser from 'cookie-parser';
import { createAuthRouter } from '@nerd/auth';

const app = express();

app.use(express.json());
app.use(cookieParser());

// Crear y montar las rutas de autenticación
const authRouter = createAuthRouter();
app.use('/api/auth', authRouter);

app.listen(3000);
```

### 2. Configuración avanzada

```typescript
const authRouter = createAuthRouter({
  sessionCookie: 'my-custom-token',
  onUserCreate: (user) => {
    console.log('Usuario creado:', user.email);
    // Enviar email de bienvenida, etc.
  },
  onUserLogin: (user) => {
    console.log('Usuario logueado:', user.email);
    // Analytics, logs, etc.
  },
  validateEmail: (email) => {
    return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
  },
  validatePassword: (password) => {
    return password.length >= 8;
  }
});
```

### 3. Proteger rutas

```typescript
import { requireAuth } from '@nerd/auth';

// Ruta protegida
app.get('/api/protected', requireAuth(), (req, res) => {
  res.json({ 
    message: 'Contenido protegido',
    user: req.user 
  });
});
```

## Configuración del Cliente (React)

### 1. Envolver tu aplicación con AuthProvider

```jsx
import { AuthProvider } from '@nerd/auth';

function App() {
  return (
    <AuthProvider fallback={<div>Cargando...</div>}>
      <YourAppContent />
    </AuthProvider>
  );
}
```

### 2. Usar los componentes de autenticación

```jsx
import { SignIn, SignUp, UserProfile, useAuth } from '@nerd/auth';

function AuthSection() {
  const { isSignedIn, isLoading } = useAuth();

  if (isLoading) return <div>Cargando...</div>;

  if (!isSignedIn) {
    return (
      <div>
        <SignIn />
        <SignUp />
      </div>
    );
  }

  return <UserProfile />;
}
```

### 3. Usar el hook useAuth

```jsx
import { useAuth, useUser } from '@nerd/auth';

function MyComponent() {
  const { user, isSignedIn, isLoading, setUser } = useAuth();
  
  // O solo obtener el usuario
  const user = useUser();

  if (!isSignedIn) {
    return <div>Por favor inicia sesión</div>;
  }

  return <div>¡Hola {user.email}!</div>;
}
```

### 4. HOC para proteger componentes

```jsx
import { withAuth } from '@nerd/auth';

const ProtectedComponent = withAuth(function MyComponent() {
  return <div>Este componente solo se muestra a usuarios autenticados</div>;
});
```

## Configuración Personalizada

Si tu API está en una URL diferente o usas un path personalizado:

```typescript
import { configureAuth } from '@nerd/auth';

// Configurar antes de usar los componentes
configureAuth({
  baseUrl: 'https://mi-api.com',
  apiPath: '/auth' // en lugar de /api/auth
});
```

## Variables de Entorno

Crea un archivo `.env` en tu proyecto:

```env
AUTH_SECRET=tu-secreto-jwt-muy-seguro
NODE_ENV=production
```

## API Endpoints

La librería crea automáticamente estos endpoints:

- `POST /api/auth/login` - Iniciar sesión
- `POST /api/auth/signup` - Registrarse
- `GET /api/auth/me` - Obtener usuario actual
- `POST /api/auth/logout` - Cerrar sesión
- `POST /api/auth/reset-password` - Resetear contraseña

## Componentes Disponibles

- `<AuthProvider>` - Proveedor de contexto de autenticación
- `<SignIn>` - Formulario de inicio de sesión
- `<SignUp>` - Formulario de registro
- `<UserProfile>` - Perfil del usuario con opción de logout
- `<ResetPassword>` - Formulario para resetear contraseña

## Hooks Disponibles

- `useAuth()` - Hook principal con toda la información de auth
- `useUser()` - Solo retorna el usuario actual
- `useSession()` - Retorna `isSignedIn` e `isLoading`

## Funciones de Utilidad

- `configureAuth(config)` - Configurar URLs personalizadas
- `createAuthRouter(options)` - Crear router de Express
- `requireAuth(cookieName?)` - Middleware para proteger rutas
- `withAuth(Component)` - HOC para proteger componentes

## Licencia

MIT