Prueba №4

Debes desarrollar una interfaz para el sitio Hacker News, que conste de 2 páginas.

Requisitos del producto

Página principal

• Muestra las últimas 100 noticias en forma de lista, ordenadas por fecha, con las más recientes en la parte superior.
• Cada noticia debe contener:
  • Título
  • Puntuación
  • Nombre del autor
  • Fecha de publicación
• Al hacer clic en una noticia, se debe redirigir a la página de detalles de la noticia.
• La lista de noticias debe actualizarse automáticamente cada minuto sin intervención del usuario.
• La página debe tener un botón para actualizar manualmente la lista de noticias.

Página de detalles de la noticia

• Debe contener:
  • Enlace a la noticia
  • Título de la noticia
  • Fecha
  • Autor
  • Contador de comentarios
  • Lista de comentarios en forma de árbol
    • Los comentarios raíz se cargan inmediatamente al entrar en la página, los comentarios anidados se cargan al hacer clic en el comentario raíz.
• La página debe tener un botón para actualizar manualmente la lista de comentarios.
• La página debe tener un botón para regresar a la lista de noticias.

Requisitos técnicos

• La aplicación debe desarrollarse utilizando React y Redux.
• Se debe usar la API oficial de Hacker News. Las llamadas a la API de Hacker News y el manejo de los datos se deben realizar directamente desde el front-end (excepto si realizas la tarea opcional sobre Node.js).
• El enrutamiento debe hacerse con React Router v5.
• El framework de UI puede ser cualquiera de tu elección (por ejemplo, Ant Design o Semantic UI). También se puede hacer con CSS puro, lo importante es que sea atractivo.
• Gestor de paquetes: yarn.
• La aplicación debe ejecutarse en la dirección localhost:3000 con el comando yarn start.
• Al navegar entre enlaces, la página no debe recargarse.
• El código fuente de la solución debe subirse a tu cuenta de Github con un archivo README.md con instrucciones para la ejecución.

Tareas opcionales

• Uso de TypeScript.
• Backend para hosting de estáticos y API para encapsular solicitudes externas en Node.js.
• Cobertura del código con pruebas unitarias.

Desglose de la tarea técnica

Un ejemplo de solución de la tarea técnica se puede encontrar en la carpeta SolutionExample. La solución se presenta basada en una de las tareas técnicas resueltas.

La solución consta de dos partes. La primera implementa la parte del cliente junto con las tareas opcionales. La segunda consta de la parte del servidor. Cada parte contiene su propio README.md con instrucciones para la ejecución.