https://github.com/raulrobinson/angular-authentication
Un sistema completo de login y registro desarrollado en Angular con diseño moderno y funcionalidades avanzadas.
https://github.com/raulrobinson/angular-authentication
angular authentication guards loginpage register-page signals
Last synced: 5 months ago
JSON representation
Un sistema completo de login y registro desarrollado en Angular con diseño moderno y funcionalidades avanzadas.
- Host: GitHub
- URL: https://github.com/raulrobinson/angular-authentication
- Owner: raulrobinson
- License: mit
- Created: 2025-07-31T16:39:25.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2025-08-02T17:39:08.000Z (11 months ago)
- Last Synced: 2025-08-20T22:54:39.401Z (10 months ago)
- Topics: angular, authentication, guards, loginpage, register-page, signals
- Language: TypeScript
- Homepage: https://rasysbox.com
- Size: 893 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Sistema de Autenticación Angular
Un sistema completo de login y registro desarrollado en Angular con diseño moderno y funcionalidades avanzadas.
## 🚀 Características
- **Login y Registro**: Formularios completos con validación
- **Protección de Rutas**: Guardias de autenticación implementados
- **Persistencia de Datos**: Almacenamiento en localStorage
- **Diseño Responsive**: Interfaz moderna y adaptable
- **Dashboard**: Panel de usuario con información detallada
- **Animaciones**: Transiciones suaves y atractivas
## 📋 Requisitos Previos
- Node.js (versión 18 o superior)
- npm o yarn
## 🛠️ Instalación
1. **Clonar el repositorio**:
```bash
git clone https://github.com/raulrobinson/angular-authentication
```
2. **Instalar dependencias**:
```bash
npm install
```
3. **Ejecutar el proyecto**:
```bash
ng serve
```
4. **Abrir en el navegador**:
```
http://localhost:4200
```
## 📁 Estructura del Proyecto
```
src/
├── app/
│ ├── components/
│ │ ├── login/ # Componente de login
│ │ ├── register/ # Componente de registro
│ │ └── dashboard/ # Panel de usuario
│ ├── models/ # Modelos de datos
│ │ └── auth-models.ts # Modelo de usuario
│ ├── services/
│ │ └── auth.ts # Servicio de autenticación
│ ├── guards/
│ │ └── auth-guard.ts # Guardia de autenticación
│ ├── app.routes.ts # Configuración de rutas
│ └── app.config.ts # Configuración de la aplicación
└── styles.scss # Estilos globales
```
## 🔧 Funcionalidades
### Login
- Formulario de inicio de sesión
- Validación de campos requeridos
- Manejo de errores
- Redirección automática al dashboard
### Registro
- Formulario de creación de cuenta
- Validación de contraseñas
- Verificación de campos
- Redirección automática al dashboard
### Dashboard
- Información del usuario
- Funcionalidades disponibles
- Botón de cerrar sesión
- Diseño responsive
### Autenticación
- Guardias de ruta
- Persistencia de sesión
- Manejo de tokens
- Logout automático
## 🎨 Diseño
El sistema utiliza un diseño moderno con:
- Gradientes atractivos
- Sombras y efectos visuales
- Animaciones suaves
- Paleta de colores coherente
- Tipografía legible
## 🔒 Seguridad
- Validación de formularios
- Protección de rutas
- Manejo seguro de tokens
- Limpieza de datos al logout
## 📱 Responsive
El diseño es completamente responsive y funciona en:
- Dispositivos móviles
- Tablets
- Escritorio
## 📸 Capturas de Pantalla
## 🚀 Despliegue
Para desplegar en producción:
```bash
ng build --configuration production
```
## 🤝 Contribuir
1. Fork el proyecto
2. Crea una rama para tu feature
3. Commit tus cambios
4. Push a la rama
5. Abre un Pull Request
## 📄 Licencia
Este proyecto está bajo la Licencia MIT.
## 🆘 Soporte
Si tienes alguna pregunta o problema, por favor abre un issue en el repositorio.
---
**¡Disfruta usando el sistema de autenticación!** 🎉