Principiante
Unas 20 horasProyecto 1 de 4Gestor de gastos personales sin frameworks
Crea una aplicación web para controlar gastos e ingresos: alta con formulario validado, categorías, filtros por mes, resumen con totales y un gráfico sencillo dibujado con Canvas o SVG. Todo con JavaScript sin frameworks y los datos guardados en localStorage.
HTMLCSSJavaScriptlocalStorageCanvas o SVG
Tu avance0/15 · 0 %
Objetivos de aprendizaje
- •Manipular el DOM y delegar eventos
- •Validar formularios con la API de validación y mensajes propios
- •Persistir datos en el navegador y trabajar con fechas e importes
Requisitos mínimos
Fases sugeridas
- 1
Estructura
- 2
Datos y lista
- 3
Formulario y filtros
- 4
Resumen y gráfico
Qué entregar
- Repositorio
- Web publicada
- README con capturas
Para ir más allá
- Importar un CSV del banco
- Presupuestos mensuales con avisos
Rúbrica de evaluación
| Criterio | Peso | Para la máxima nota |
|---|---|---|
| Funcionalidad | 30 % | Todas las operaciones y cálculos correctos |
| Calidad del JavaScript | 30 % | Funciones pequeñas, estado centralizado y sin variables globales sueltas |
| Formularios y accesibilidad | 20 % | Validación clara y uso completo con teclado |
| Diseño | 20 % | Responsive y cuidado |
Úsala para autoevaluarte antes de entregar. Tu profesorado puede usar otros criterios.
Consejos y errores típicos
- Guarda los importes en céntimos para evitar errores de redondeo.
- Pinta la lista desde los datos en lugar de modificar el DOM a mano en cada cambio.