SpeedType: mejora tus habilidades de mecanografía
SpeedType es un juego de mecanografía interactivo basado en web diseñado para mejorar la velocidad y precisión de la escritura. Construido con una pila de tecnología moderna, ofrece una forma atractiva de mejorar sus habilidades con el teclado.
Características
- Seguimiento de errores en tiempo real
- Cálculo de WPM (palabras por minuto)
- Interfaz de usuario elegante y responsiva
- Soporte de modo oscuro
- Soporte multilingüe (inglés y español)
? Pila de tecnología clave
- React : para construir la interfaz de usuario.
- Next.js : para renderizado y enrutamiento del lado del servidor
- TypeScript : para código con seguridad de escritura
- Framer Motion : para animaciones y transiciones fluidas
- Tailwind CSS : para un estilo rápido y responsivo
- Zustand : Por una gestión estatal eficiente
- Visual Studio Code : como entorno de desarrollo principal
? Empezando
Para ejecutar el proyecto localmente:
- Clonar el repositorio
- Dependencias de instalación:
npm install
o yarn install
- Ejecute el servidor de desarrollo:
npm run dev
o yarn dev
- Abra http://localhost:3000 en su navegador
Despliegue
El proyecto se implementa en https://speedtype-v1.netlify.app
? UI/UX
- Diseño responsivo usando Tailwind CSS
- Animaciones fluidas impulsadas por Framer Motion
- Temas personalizables con soporte para modo oscuro
? Gestión del Estado
Utiliza Zustand para una gestión estatal eficiente y sencilla.
Métricas de rendimiento
Según PageSpeed Insights (al 12 de agosto de 2024):
- Puntuación de rendimiento : 94/100 (excelente)
- Accesibilidad : 100/100
- Mejores prácticas : 100/100
- SEO : 100/100
Estos puntajes indican que SpeedType está altamente optimizado para dispositivos móviles, ofreciendo tiempos de carga rápidos, excelente accesibilidad, cumplimiento de las mejores prácticas web y sólidos fundamentos de SEO.
?autor
Manjunath R
? Contribuyendo
¡Las contribuciones, los problemas y las solicitudes de funciones son bienvenidos! No dudes en consultar la página de problemas.
Licencia
Este proyecto tiene licencia del MIT.
Demostración del proyecto
Demostración en vídeo
Vídeo.sin.título.-.Hecho.con.Clipchamp.6.mp4
Capturas de pantalla







Hecho con ❤️ por Manjunath R