Mascota digital
Esta es una versión personalizada de un Tamagotchi, la mascota virtual portátil de los años 90, construida en un curso de Brian Holt en Frontend Masters. El proyecto se desarrolla con Javascript vainilla y el objetivo es refactorizar el código con otras tecnologías. En mi caso, decidí hacerlo con React pero evitando utilizar create-react-app y configurar un proyecto desde cero con Webpack, Redux y TypeScript.
Características
- La mascota tiene ciclos de sueño dependiendo de la duración del dia y la noche, el usuario no puede interactuar con ello.
- Cada cierto tiempo, nos indicará que tiene hambre pidiendo alimento.
- Una vez alimentada, hará sus necesidades esperando a ser limpiadas.
- Si ambas necesidades no son cubiertas en un breve espacio de tiempo, la mascota morirá.
- Se puede cambiar a modo lluvia y modo normal siempre que se desee.
Qué he aprendido
- A arrancar un proyecto desde cero con Webpack.
- A configurar CSS y SCSS módulos con Webpack.
- A configurar TypeScript con Webpack.
- A obtener un mayor entendimiento sobre las 'closures' de Javascript con la función 'requestsAnimationFrame'.
- A realizar animaciones avanzadas con sprites.
- A construir código en Javascript Vanilla y refactorizarlo a React con TypeScript y Redux.
Tecnologías
- Front-end: React con TypeScript configurado desde cero con Webpack, Redux y SCSS módulos.
- Front-end: Javascript Vanilla
- Backend: -