Create react native app
- don't use the expo framework, please use react native CLI
- Must using es6
- use Axios to fetch API
- don't use any CSS frameworks like bootstrap or material, etc. Use flex and plain CSS instead
- Try to keep dependencies to a minimum.
- The provided wireframes on attachments are just a guide. Render the data as you see fit.
- doesn't need login/authentication
- You will use an online JSON API to request a list of albums and their associated entities. Each album has an owner, and an album contains a number of photos.
- Familiarize yourself with the JSON Placeholder API ([login to view URL]) before beginning this project. You will be using the album ([login to view URL]), photo ([login to view URL]), and user ([login to view URL]) resources.
- Please include a README file with instructions on how to run both your application and any tests you have written.
Aim to build the following two pages:
### The application's homepage
* Refer to the wireframe Main Page-album list.png.
* This will display a list of photo albums, retrieved from the `albums` API.
* For each album, display its title, owner information, and a thumbnail image. If the album has no images, then display a suitable placeholder (tip: [[login to view URL]]([login to view URL]) can be used to generate a fake image).
* Allow the user to navigate to an album.
* implement the filter widget to allow the user to display only those albums owned by the user selected in the filter dropdown.
### An album gallery view
* Refer to the wireframe detail page - album [login to view URL]
* This screen should contain two sections:
* The top half will display the currently selected image (this should default to the first photo in the album). On either side of the image, there should be slideshow controls that allow the user to preview the previous and next images in the album.
* The bottom section will display thumbnails of all images in a grid format.
* The image currently being shown in the top section should be highlighted in the bottom section. Use whatever styling you want to do this highlighting. For example, in the wireframe, there is a blue border around the thumbnail being previewed.
* Although it is a trivial use case, feel free to use Redux to manage the state between the components on this page.