Prueba Técnica Front-End Tipo D

 Instrucciones generales

• Tienes 2 horas para completar el examen.
• El proyecto debe ser desarrollado utilizando React , React Router , Axios y Sass .
• Debes estructurar tu código de manera limpia y modular.
• Al finalizar, sube tu proyecto a GitHub y comparte el enlace.

Ejercicio 1: Aplicación de gestión de tareas.

Descripción:

Desarrolla una aplicación web para gestionar tareas. La aplicación debe tener las siguientes características:

Lista de tareas : Muestra una lista de tareas obtenida desde una API pública. Usa la siguiente API:

• https://jsonplaceholder.typicode.com/todos

Filtrado de tareas : Agrega un filtro para mostrar solo las tareas completadas o pendientes.

Estilos con Sass : Usa Sass para estilizar la aplicación. Asegúrate de que los componentes tengan un diseño limpio y profesional.

Manejo de errores : Si ocurre un error al cargar los datos, muestra un mensaje de error amigable.

Requisitos técnicos:

• Usa React Router para manejar las rutas (/ para la lista de tareas y /tasks/:status para filtrar por estado).
• Usa Axios para realizar las peticiones HTTP.
• Usa useState y useEffect para manejar el estado y cargar los datos.

Ejercicio 2: Creación de una tarea.

Descripción:

Agrega funcionalidad para crear nuevas tareas en la aplicación. Implementa las siguientes características:

Formulario de creación : Agrega un formulario en la página principal para crear una nueva tarea. El formulario debe incluir campos para el título y el estado (completada o pendiente).

Envío de datos : Al enviar el formulario, realiza una petición POST a la API para crear la tarea. Usa la siguiente URL para enviar los datos:

• https://jsonplaceholder.typicode.com/todos

Actualización de la lista : Después de crear una tarea, actualiza la lista de tareas sin recargar la página.

Validación : Valida que el título no esté vacío antes de enviar el formulario.

Requisitos técnicos:

• Usa useState para manejar el estado del formulario.
• Usa Axios para enviar los datos mediante POST.
• Estiliza el formulario y la lista de tareas usando Sass .

Sube el proyecto a GitHub y GitHub Pages y deja los enlaces como comentario en el presente blog