Bienvenido a la Prueba Técnica para el puesto de Frontend Mid. Este proyecto consiste en desarrollar una aplicación web para los fans de Rick & Morty, con varias funcionalidades y rutas especificadas a continuación.
La aplicación tendrá cuatro rutas principales:
- Inicio
- Ubicaciones
- Favoritos
- Inicio de sesión
Utiliza la API de Rick & Morty para obtener los datos necesarios. Puedes consultar la documentación en el siguiente enlace: Documentación de la API. Tienes la libertad de elegir entre la API REST o GraphQL.
- Framework: Utiliza React o Svelte para la construcción de la interfaz de usuario.
- Gestión de Estado: Para gestionar el estado global de la aplicación, utiliza una de las siguientes opciones:
- React Context
- Contextos de Svelte
- XState
- Lenguaje: El uso de TypeScript es obligatorio.
- Enrutamiento:
- Si eliges React, usa React Vanilla con React Router.
- Si eliges Svelte, usa SvelteKit.
- Navegación: Implementa un menú de navegación.
- Página de Inicio: Debe mostrar tarjetas de personajes con desplazamiento infinito y la posibilidad de agregar personajes a favoritos.
- Página de Ubicaciones: Debe mostrar tarjetas de ubicaciones con desplazamiento infinito y la opción de agregar ubicaciones a favoritos.
- Página de Favoritos: Debe mostrar todos los favoritos combinados y permitir eliminar elementos de la lista.
- Inicio de Sesión: Para añadir un favorito, el usuario deberá iniciar sesión en la página de inicio de sesión.
Envía el enlace del repositorio del proyecto y despliega la aplicación en Vercel, Netlify o Github Pages para tener una página completamente funcional.
-
Configura tu entorno:
- Clona el repositorio (si se ha proporcionado uno).
- Configura TypeScript en tu proyecto.
- Instala las dependencias necesarias para React o Svelte y el gestor de estado elegido.
-
Implementa las Rutas:
- Inicio: Crea la página de inicio con tarjetas de personajes y desplazamiento infinito. Permite agregar personajes a favoritos.
- Ubicaciones: Crea la página de ubicaciones con tarjetas de ubicaciones y desplazamiento infinito. Permite agregar ubicaciones a favoritos.
- Favoritos: Muestra todos los elementos favoritos combinados y permite eliminarlos.
- Inicio de Sesión: Crea la página de inicio de sesión. Asegúrate de que solo los usuarios autenticados puedan agregar favoritos.
-
Gestión de Estado:
- Configura el estado global para gestionar los personajes, ubicaciones y la autenticación del usuario.
-
Despliega tu Proyecto:
- Configura tu proyecto para desplegar en Vercel, Netlify o Github Pages.
- Asegúrate de que el despliegue sea completamente funcional y accesible.
-
Envía tu Trabajo:
- Proporciona el enlace al repositorio del proyecto.
- Incluye el enlace a la versión desplegada de la aplicación.
Si tienes alguna pregunta o necesitas aclaraciones adicionales, no dudes en ponerte en contacto. ¡Buena suerte!