Skip to content

Commit 1033ef8

Browse files
committed
Actualizar README.md con descripción del proyecto, características, estructura y requerimientos no implementados
1 parent 7465c03 commit 1033ef8

1 file changed

Lines changed: 50 additions & 41 deletions

File tree

README.md

Lines changed: 50 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,59 @@
1-
# React + TypeScript + Vite
1+
# 🏨 Plataforma de Gestión de Hoteles y Reservas
22

3-
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
3+
## 📌 Descripción del Proyecto
4+
Este proyecto es una **plataforma web** desarrollada con **React y TypeScript** que permite a los usuarios **gestionar hoteles y realizar reservas**. Se diseñó con un enfoque en la administración de hoteles, habitaciones y clientes, proporcionando una interfaz intuitiva y funcional.
45

5-
Currently, two official plugins are available:
6+
## 🚀 Funcionalidades Principales
7+
- Creación, edición y eliminación de hoteles.
8+
- Administración de habitaciones (precios, capacidad, estado).
9+
- Realización de reservas con validaciones detalladas.
10+
- Gestión de estados de hoteles y habitaciones (habilitar/deshabilitar).
11+
- Visualización de reservas con filtros por hotel y fecha.
12+
- Despliegue automatizado con **GitHub Actions**.
613

7-
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
8-
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
14+
## 🛠️ Desarrollo del Proyecto
15+
### 1️⃣ **Manejo del API con Mocks**
16+
No se desarrollaron servicios web reales para el API. En su lugar, utilizamos **MirageJS** para simular las respuestas del servidor y manejar los datos de manera local sin necesidad de un backend real.
917

10-
## Expanding the ESLint configuration
18+
### 2️⃣ **Pruebas Automatizadas**
19+
Se implementaron pruebas automatizadas con **Jest** para validar la renderización básica de los componentes. **Las pruebas son sencillas**, enfocadas en verificar que los componentes se montan correctamente y que los elementos clave existen en la UI.
1120

12-
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
21+
> ⚠️ **Nota**: No se realizaron pruebas avanzadas de integración o end-to-end debido a la naturaleza del proyecto.
1322
14-
- Configure the top-level `parserOptions` property like this:
23+
### 3️⃣ **Despliegue con GitHub Actions**
24+
El proyecto se despliega automáticamente en cada `push` o `pull request` utilizando **GitHub Actions**. Se configuró un flujo de trabajo que:
25+
- Instala dependencias.
26+
- Ejecuta las pruebas automatizadas.
27+
- Facilita la integración y la entrega continua.
1528

16-
```js
17-
export default tseslint.config({
18-
languageOptions: {
19-
// other options...
20-
parserOptions: {
21-
project: ['./tsconfig.node.json', './tsconfig.app.json'],
22-
tsconfigRootDir: import.meta.dirname,
23-
},
24-
},
25-
})
26-
```
29+
🔗 **URL del despliegue**: [Hotel System](https://hotel-system-blue.vercel.app/)
30+
31+
### 4️⃣ **Patrones de Diseño Implementados**
32+
Durante el desarrollo del código, aplicamos algunos patrones de diseño clave:
33+
- **Store Pattern** con Zustand para la gestión del estado global.
34+
- **Componentes Reutilizables** para la UI, como formularios y modales.
35+
- **Separación de Responsabilidades** con hooks personalizados y utilidades externas.
36+
37+
### 5️⃣ **Envío de Correos Electrónicos**
38+
El requerimiento de enviar correos electrónicos **no se implementó** porque habría sido necesario **exponer la llave del servicio de correo**, lo cual comprometería la seguridad del sistema. Si hubiéramos implementado esta funcionalidad, habríamos optado por crear un **servicio en Express** para manejar el envío de correos desde el backend, asegurando una mejor gestión de credenciales y seguridad.
2739

28-
- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
29-
- Optionally add `...tseslint.configs.stylisticTypeChecked`
30-
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
31-
32-
```js
33-
// eslint.config.js
34-
import react from 'eslint-plugin-react'
35-
36-
export default tseslint.config({
37-
// Set the react version
38-
settings: { react: { version: '18.3' } },
39-
plugins: {
40-
// Add the react plugin
41-
react,
42-
},
43-
rules: {
44-
// other rules...
45-
// Enable its recommended rules
46-
...react.configs.recommended.rules,
47-
...react.configs['jsx-runtime'].rules,
48-
},
49-
})
40+
## 📂 Estructura del Proyecto
5041
```
42+
📦 src
43+
┣ 📂 components # Componentes reutilizables
44+
┣ 📂 pages # Páginas principales (Home, Login, Hotels, Reservations)
45+
┣ 📂 services # API y lógica de negocio
46+
┣ 📂 store # Gestión de estado con Zustand
47+
┣ 📂 types # Tipado y modelos de datos
48+
┣ 📂 Mocks # Simulación del backend con MirageJS
49+
┣ 📂 __tests__ # Pruebas automatizadas con Jest
50+
┗ 📜 main.tsx # Punto de entrada de la aplicación
51+
```
52+
53+
## 📜 Conclusión
54+
Este proyecto demuestra el uso de **React con TypeScript** para construir una plataforma de gestión de hoteles sin necesidad de un backend real. Se implementaron **pruebas automatizadas, mocks de API y despliegue continuo** para garantizar una mejor calidad del software. Aunque no se desarrolló la funcionalidad de envío de correos electrónicos, se dejó documentado cómo podría integrarse en un futuro con una API en **Express**.
55+
56+
> **🚀 Próximos pasos:**
57+
> - Mejorar las pruebas automatizadas con más validaciones.
58+
> - Optimizar la experiencia de usuario en el flujo de reservas.
59+
> - Implementar un backend real para manejar datos de manera persistente.

0 commit comments

Comments
 (0)