Citizennet React Challenge

Your task is to display logos in a certain order, based on an input JSON array.

1. Fork this React repo.

2. Modify https://github.com/citizennet/react-challenge/blob/master/src/App.js to do the following:

   • Load this JSON file https://ac.aws.citizennet.com/assets/qspreviews/qs_interview_data.json
   • Sort the names by audience_size, in descending order. You will display the corresponding picture as follows:
     • Use this layout as a guideline: https://github.com/citizennet/react-challenge/blob/master/assets/demo.png
     • The largest audience_size item should be at the top left, the second largest should be to the right of that, and so on.
     • You should have at least 4 columns if there are 4 or more names in the json array.
     • Note you will also need the rounded box outline surrounding each picture.
     • You can leave the pictures as color, no need to recolor them as black and white.
     • Add a hover state with a dark, semi-transparent overlay and display the id inside source_items of the hovered name.
   • Your code should work for arbitrary organization of the json array input. We will test with a different JSON file!

   The challenge is designed to be completed as a screening test. Please fork this repository and work from there. Push your project to GitHub and sent us a link.