Start webpack dev server: npm run start
Run Build: npm run build
Compile SCSS: gulp sass
I have created a project in React JS, set up with BABEL, Webpack and Gulp js. You can see ive set up the folder structure etc so it can be scaled appropriately. I have created a JSON file with the requested structure.
Within the project you can see the standard react components and the API request. I have created relevant CSS partials and can be compiled with GULP. I have taken an hour on this so didn’t get chance to add much JS functionality to the lists. I couldn’t remember the format to display the files array within the map in the API in react so spent a while playing with that. I have put this in a console log though so you can see I was close.
In terms of filtering I have just added a filter by file name function which I feel was the most difficult so I approached that first. The filter by data and name etc would be fairly simple to do with something similar or you could install a small npm filter plugin. When I committed it was working fully, so any problems let me know. All you need to do is clone from Github and make sure you have react, webpack, BABEL and gulp set up correctly and run the dev server and should be fine.