Bienvenido(a) a tu primera asignación. A continuación te explicamos los detalles 🔥🎉
El objetivo es que puedas desarrollar una pequeña aplicación usando ReactJS ⚛️ y hacer uso de una API REST por ejemplo de noticias.
- Implementar un cabecera de página donde mostrará un logo o título.
- En la misma cabecera al lado derecho mostrar los botones para que el usuario pueda registrarse o iniciar sesión. (opcional - mostrar los componentes vistos en el primer taller).
- Cada noticia debe mostrar su foto, título, descripción y enlace a su fuente.
- En la parte superior colocar una noticia como la más destacada (la más grande) y a su costado derecho 3 noticias relacionadas.
- En la parte inferior mostrar las demás noticias listadas de forma ordenada por fecha.
La aplicación deberá ser desarrollada con ReactJS ⚛️, si tienes mas Power 💪😼 puedes hacer uso de Redux para mantener el estado de la aplicación y de React-Router para que cada vista sea una página distinta.
- Antes de comenzar a escribir el código, deberás crear tu lista de tareas que vas a realizar durante el desarrollo.
- Haz uso de commit's para detallar cada tarea y/o subtarea.
- Sube tu aplicación a Github.
La data la obtendremos de un servicios gratuito de noticias el cual nos proporcionará la información que necesitemos a través de sus APIS:
Si presentas problemas con la API aqui puedes obtener otra alternativa — enlace en línea
Link de servicios NEWS API: https://newsapi.org/
NOTA: necesitarás registrate en el sitio web del servicio para obtener tu API KEY. También se hizo un demo listando las noticias dentro de este proyecto inicial.
- El concepto de diseño lo encontrarás en el siguiente LINKS: Versión Desktop, Versión Mobile
- La aplicación debe estar orientada hacia el lector/usuario
- Elige los colores y tipografía que desees y realiza las mejoras que creas conveniente.
- El detalle de cada noticia lo puedes mostrar dentro de tu App o simplemente haciendo en enlace (leer más) a la fuente.
- Usa el create-react-app
- Usa sintaxis de ES6+
- No abuses de las librerías externas
- En el README.md describe y explica las características de tu aplicación.
- Puedes agregar el sistema de Autenticación con ARC Identity (vista en la Presentación anterior)
- Puedes usar otra API (películas, vuelos, artículos, etc).
- Realiza test de tus componentes.
- Despliega tu aplicación usando Netlify, Heroku, Zeit o el que desees.
Nos vemos en la presentación 🚀🔥🚀🤞
Comandos justos y necesarios
npm install
Generando Start
npm run start
Generando Build
npm run build