CECYTE Attendance Automation System (CECYTE-AAS)

Sistema completo de automatización de control de asistencia para el Colegio de Estudios Científicos y Tecnológicos del Estado (CECYTE).

🚀 Características

• ✅ Sistema de autenticación con JWT
• ✅ Gestión de grupos y alumnos
• ✅ Registro de asistencia (Asistencia, Retardo, Falta)
• ✅ Consultas y reportes de asistencia
• ✅ Exportación a CSV
• ✅ Interfaz moderna y responsive
• ✅ Arquitectura modular y escalable

📋 Requisitos Previos

• Node.js 18+ y npm
• XAMPP (Apache + MySQL)
• Git

🛠️ Instalación

1. Configurar Base de Datos (MySQL/XAMPP)

1. Inicia XAMPP y asegúrate de que MySQL esté corriendo
2. Abre phpMyAdmin (http://localhost/phpmyadmin)
3. Importa el archivo database/cecyte_aas.sql
   • O ejecuta el script SQL directamente en MySQL

-- El archivo database/cecyte_aas.sql contiene todo el esquema y datos de prueba

2. Configurar Backend

1. Navega a la carpeta backend:

cd backend

2. Instala las dependencias:

npm install

3. Copia el archivo de configuración:

# Windows
copy env.example.txt .env

# Linux/Mac
cp env.example.txt .env

4. Edita el archivo .env con tus credenciales:

PORT=3001
NODE_ENV=development
DB_HOST=localhost
DB_PORT=3306
DB_USER=root
DB_PASSWORD=          # Tu contraseña de MySQL (vacío si no tienes)
DB_NAME=cecyte_aas
JWT_SECRET=tu_secreto_jwt_super_seguro_cambiar_en_produccion
JWT_EXPIRES_IN=24h
CORS_ORIGIN=http://localhost:5173

5. Configura las contraseñas de los profesores de prueba:

node scripts/createAdmin.js EMP001 password123
node scripts/createAdmin.js EMP002 password123
node scripts/createAdmin.js EMP003 password123

6. Inicia el servidor backend:

npm run dev

El backend estará disponible en http://localhost:3001

3. Configurar Frontend

1. En la raíz del proyecto, instala las dependencias:

npm install

2. Copia el archivo de configuración:

# Windows
copy .env.example .env

# Linux/Mac
cp .env.example .env

3. Edita el archivo .env si es necesario (por defecto apunta a localhost:3001):

VITE_API_URL=http://localhost:3001/api

4. Inicia el servidor de desarrollo:

npm run dev

El frontend estará disponible en http://localhost:5173

📁 Estructura del Proyecto

cecyte-aas/
├── backend/                 # API Node.js + Express
│   ├── config/             # Configuración de base de datos
│   ├── controllers/        # Controladores de rutas
│   ├── middleware/         # Middlewares (auth, error handling)
│   ├── routes/             # Definición de rutas
│   ├── scripts/            # Scripts utilitarios
│   ├── server.js           # Punto de entrada del servidor
│   └── package.json
│
├── database/               # Scripts SQL
│   └── cecyte_aas.sql     # Esquema completo de BD
│
├── src/                    # Frontend React
│   ├── components/         # Componentes reutilizables
│   │   ├── ui/            # Componentes UI básicos
│   │   └── layout/        # Componentes de layout
│   ├── context/           # Context API (Auth)
│   ├── pages/             # Páginas principales
│   ├── services/          # Servicios de API
│   ├── config/            # Configuración (API, etc.)
│   └── App.jsx            # Componente principal
│
└── README.md

🔐 Credenciales de Prueba

El sistema incluye datos de prueba:

Profesores:

• Número de empleado: EMP001, Contraseña: password123
• Número de empleado: EMP002, Contraseña: password123
• Número de empleado: EMP003, Contraseña: password123

Grupos de ejemplo:

• 1A, 1B, 1C (matutino, semestre 1)
• 1D, 1E, 1F (vespertino, semestre 1)
• 2A, 2B, 2C (semestre 2 con carreras)

📡 Endpoints de la API

Autenticación

• POST /api/auth/login - Iniciar sesión
• GET /api/auth/verify - Verificar token

Grupos

• GET /api/grupos/profesores/:id/grupos - Obtener grupos de un profesor
• GET /api/grupos/:id/alumnos - Obtener alumnos de un grupo
• GET /api/grupos/:id - Obtener información de un grupo
• GET /api/grupos - Obtener todos los grupos

Asistencias

• POST /api/asistencias/registrar - Registrar asistencias
• GET /api/asistencias/consultar - Consultar asistencias con filtros
• GET /api/asistencias/grupo/:grupo_id/fecha/:fecha - Obtener asistencias por fecha

🎨 Tecnologías Utilizadas

Frontend

• React 19
• React Router DOM
• TailwindCSS 4
• Axios
• Lucide React (iconos)
• date-fns

Backend

• Node.js
• Express
• MySQL2
• bcryptjs (hashing de contraseñas)
• jsonwebtoken (JWT)
• CORS

Base de Datos

• MySQL (XAMPP)

🚀 Scripts Disponibles

Backend

npm start      # Inicia el servidor en producción
npm run dev    # Inicia el servidor en modo desarrollo (nodemon)

Frontend

npm run dev    # Inicia el servidor de desarrollo
npm run build  # Construye para producción
npm run preview # Previsualiza el build de producción

📝 Uso del Sistema

1. Iniciar Sesión: Usa tu número de empleado y contraseña
2. Ver Grupos: Accede a "Mis Grupos" para ver tus grupos asignados
3. Tomar Asistencia:
   • Selecciona un grupo
   • Elige la fecha
   • Marca cada alumno (Asistencia, Retardo, Falta)
   • Guarda los registros
4. Consultar Reportes:
   • Ve a "Reportes"
   • Aplica filtros (grupo, fecha, estado)
   • Exporta a CSV si lo necesitas

🔒 Seguridad

• Contraseñas hasheadas con bcrypt
• Autenticación JWT
• Validación de datos en backend
• Protección contra SQL injection (prepared statements)
• CORS configurado
• Rutas protegidas en frontend

🐛 Solución de Problemas

Error de conexión a MySQL

• Verifica que XAMPP/MySQL esté corriendo
• Revisa las credenciales en .env
• Asegúrate de que la base de datos cecyte_aas exista

Error de CORS

• Verifica que CORS_ORIGIN en backend .env coincida con la URL del frontend
• Por defecto: http://localhost:5173

Token expirado

• El token JWT expira en 24 horas por defecto
• Inicia sesión nuevamente

📄 Licencia

Este proyecto es de uso interno para CECYTE.

👥 Soporte

Para problemas o preguntas, contacta al equipo de desarrollo.

---

Versión: 1.0.0
Última actualización: 2024