challenge completed / Frontend - Sergio Sanhueza

[jito-jito]

Steps for complete the challenge:

1. Create a wireframe
2. Create hook 'useInitialState' and util 'getData'
3. Create components
4. Add styles

Main blocks:

'useInitialState' hook and 'getData' fetch function:

• I used 'useInitialState'hook to create a state with API data and give it to the main component(app.jsx)

• I used 'getData' function with fetch for get api data and give results a 'useInitialState' hook.

'app.jsx' component:

• I used 'app' component for recived the api data and make different components of the application.

Render data in components:

• I used 'array.map' to create the elements within the component according to the number of elements received in the api data.

Doing this causes the tests can not verify that there are 'element.Item' within each component, so i modified the tests to prove that there is the 'component-itemContainer' that loads these elements according to the API data.

Styles, 'app.styl':

• I used 'app.style' file for create variables, mixins and receive 'stylus' files of each component.