Scribd
Upload
11 views3 pages

React Assignment 2

The document outlines a frontend take-home assignment for creating a hotel listing website using Reactjs, focusing on desktop screens only. Key features include city tabs, property card listings, navigation to property pages, and the use of mock data. The assignment emphasizes best practices, global state management, and code organization, with an option to include unit tests.

Uploaded by

ravi mishra
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
11 views3 pages

React Assignment 2

The document outlines a frontend take-home assignment for creating a hotel listing website using Reactjs, focusing on desktop screens only. Key features include city tabs, property card listings, navigation to property pages, and the use of mock data. The assignment emphasizes best practices, global state management, and code organization, with an option to include unit tests.

Uploaded by

ravi mishra
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

Seller App

Frontend Take-Home Assignment

Task
Create a hotel listing website in Reactjs for desktop-only screens,
you don’t have to make it responsive.

- City tabs on the tab (show only 4 as seen in the image), the
first tab should be active by default, on click of any other tab,
it should be active and its respective property should be
rendered.
- Property cards listing, 3 on each row.
- Each property card should be designed as it is seen in the
image (not pixel-perfect but should look similar)
- On the click of Show More load 3 new properties under the
active tab.
- When a card is clicked, navigate to the property page,
/property/:id, and show the same thing on the new page, can
reuse the same card over there.
- You can ignore the View All button
Guidelines
- You can use any framework of choice but Reactjs is preferred
- You can use CSS frameworks like Bootstrap and Tailwind
- The code should be functional and each listed action should
happen in order to pass
- It is good to use a global state management library like Redux
- Follow best practices.
- Commit the code to a repository and include a readme. Share
the link to the repo once done.
- Use mock data from a JSON file, API integration is not
required.
- Make sure the routing is there.

Evaluation
- We will evaluate how you structure and store the data in
JSON
- How do you create the components and re-use and compose
them
- How data is shared between the components.

Add on
- If unit test cases can be added.

You might also like