Album image list using React Native

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.

## Details

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.

Taidot: React Native, Flex, CSS, RESTful API, ECMAScript

Näytä lisää: for hire programmer using react native, tinder using react native, quiz app using react native, react native create bridge, build an app in less than 1 hour using react native download, cross platform app development using react native, using react native with rails, chat application using react native, react-native-create-library example, react-native-create-library, react-native-create-bridge example, react-native-create-bridge, whatsapp clone using react native, react native create blob, react native create project, ios app using react native, list app react native, how to develop android app using react native, create android app using react native, how to create hybrid mobile app using react native

Tietoa työnantajasta:
( 3 arvostelua ) Bekasi, Indonesia

Projektin tunnus: #29056568

Myönnetty käyttäjälle:


Hi! I've read your job description carefully and understand what you want. I am a professional mobile app developer skilled in native and react native. As a professional developer who can realize your idea, I can keep Lisää

$20 USD 3 päivässä
(4 Arvostelua)