Scribd
Upload
0 views

Software_Engineer_Assignment

The document outlines a multi-step process for creating a user profile display using an API. It includes fetching user data, displaying it in a tile grid with sorting options, and creating a detailed profile page for each user. Key requirements include responsiveness, the use of Bootstrap, and optional Redux for state management, with final deliverables hosted online and shared via GitHub.

Uploaded by

scienceprashant27
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0 views

Software_Engineer_Assignment

The document outlines a multi-step process for creating a user profile display using an API. It includes fetching user data, displaying it in a tile grid with sorting options, and creating a detailed profile page for each user. Key requirements include responsiveness, the use of Bootstrap, and optional Redux for state management, with final deliverables hosted online and shared via GitHub.

Uploaded by

scienceprashant27
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

User Profiles

Step 1:
● Get user data from this API: https://reqres.in/api/users?delay=3
● Show a progress spinner while waiting for the data.
● Refer wireframe below:

Step 2:
● Display users in the form of a tile grid.
● Each tile should contain the image of the user, his first name and last name.
● The URLs for user images are available in the data itself.
● These tiles should be clickable.
● There should be a sort by dropdown above the grid on the right.
● Refer wireframe below:
Step 3:
● On clicking on a tile, the profile page of the user should be shown. The API for
this is https://reqres.in/api/users/<id>
● This page should contain a large image of the user and the rest of the details.
● Refer wireframe below

Step 4:
● There should be sort options in the main users page. The available options are
None, First Name and Last Name
● On selecting one of these, the tiles should sort and rearrange.
● Refer wireframe below:
Important points:

● You can do this assignment using any javascript library/framework.


● The pages should be responsive across any resolution.
● Bootstrap should be used
● Usage of Redux is a plus
● All transitions (users to profile page, sorting, etc..) should be animated.
● The final product should be hosted somewhere and the URL should be sent to us.
● Code should be committed to a GitHub repo and the URL should be sent to us.

You might also like