amruthpillai/Treebo-Frontend-Assignment

A frontend development assignment provided by Treebo Hotels.

5

stars

14

commits

JavaScript

primary language

Jun 11, 2024

updated

README

Treebo Hotels Frontend Assignment

A React/Redux frontend application that uses Material UI to display a group of hotels, their locations, prices and amenities upon futher navigation.

Try the app live: https://amruthpillai.github.io/Treebo-Frontend-Assignment/

Demo

Demo

Requirements

  1. Create a generic hotel list page using the following api: http://www.mocky.io/v2/5a7f23442e00005000b56873
  2. Show only the cheapest price for each hotel on the list page using this api: http://www.mocky.io/v2/5a7f24f02e00005200b56875 (null prices mean sold out)
  3. On clicking a hotel, display a hotel detail page with details from this api: http://www.mocky.io/v2/5a7f265b2e00005d00b56877 along with the respective room prices using the above price api.

Points of Interest

  1. Repo setup and folder structure
  2. Identification of components that should carry state vs components that are only concerned with display (smart vs dumb components)
  3. Proper use of methods to fetch data, push into state, etc
  4. State management is left completely upto you (however, would prefer to see redux)
  5. Styling best practises and principles. (You may copy the design from the Treebo Website or use any of your own. Only create the listing and detail pages).

Contributors

amruthpillai

14 commits

amruthpillai/Treebo-Frontend-Assignment

A frontend development assignment provided by Treebo Hotels.

5

stars

14

commits

JavaScript

primary language

Jun 11, 2024

updated

README

Treebo Hotels Frontend Assignment

A React/Redux frontend application that uses Material UI to display a group of hotels, their locations, prices and amenities upon futher navigation.

Try the app live: https://amruthpillai.github.io/Treebo-Frontend-Assignment/

Demo

Demo

Requirements

  1. Create a generic hotel list page using the following api: http://www.mocky.io/v2/5a7f23442e00005000b56873
  2. Show only the cheapest price for each hotel on the list page using this api: http://www.mocky.io/v2/5a7f24f02e00005200b56875 (null prices mean sold out)
  3. On clicking a hotel, display a hotel detail page with details from this api: http://www.mocky.io/v2/5a7f265b2e00005d00b56877 along with the respective room prices using the above price api.

Points of Interest

  1. Repo setup and folder structure
  2. Identification of components that should carry state vs components that are only concerned with display (smart vs dumb components)
  3. Proper use of methods to fetch data, push into state, etc
  4. State management is left completely upto you (however, would prefer to see redux)
  5. Styling best practises and principles. (You may copy the design from the Treebo Website or use any of your own. Only create the listing and detail pages).

Contributors

amruthpillai

14 commits

Languages

JavaScript

63.9%

CSS

26.6%

HTML

9.5%