Prueba Alexander Agudelo V

[alex-av]

Hola, la realización de este desafío se describe en el orden de los pasos descritos en la actividad:

1. Crear los componentes del proyecto

Para esto creé los ficheros correspondientes a cada componente y se alojaron en la carpeta de componentes, en el caso de los estilos, se alojan todos los ficheros .styl correspondientes a cada componente dentro de la carpeta style .

2. Añadir Estilo.

En mi caso decidí dejar para el final todo el manejo del css donde consideré necesario partir desde un ya depurado proceso de creación de componentes con funcionalidad sobre ruedas. Contar en el proyecto con Stylus ayudó mucho a escrbir rápidamente el código css

3. Crear función getData.

Particularmente en este caso , la función getData se realizó en gran medida con vainilla jasvascript usando una función asíncrona para poder implementar async/await para el fetch de los datos.

4. Integrar API

Se realizan las funciones necesarias para hacer la consulta al servidor que aloja la información. Para la consulta se usa el método fetch y se usan hooks como useState para la gestión de l estado de la data y useEffect para actualizar la información en el momento que se encuentre disponible. Con información iterable se usa el método map para recorrer los elementos del array y desglosar la data en elementos específicos de las etiquetas, por legibilidad decidí desestructurar la mayoría de parámetros lo que generó una serie de advertencias y alertas en el hook de husky.

5. Personalizar API

La actualización del fichero JSON que juega un papel de "base de datos " se realizó antes de integrar el API debido a que esta acción revela qué tipo de funciones necesito para mostrar la información en el cmponente.