Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/koko37/offer1

React, Material-UI
https://github.com/koko37/offer1

material-ui react react-router redux responsive

Last synced: 4 days ago
JSON representation

React, Material-UI

Awesome Lists containing this project

README 

        


  screenshot





  screenshot




# Offer1 Interview Exercise



This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app) to give you a quick starting place for the exercise.



## Exercise Description



Image that you have been hired to create a new Real Estate application to help consumers purchase a home. Your new company is up against the a tight timeline and needs to deliver a minimum viable product (mvp) ASAP! In order to compete in the market place your MVP should provide the following core functionality:



- View/browse all available homes 

- Filter homes by City, Price, Number of Bedrooms

- Show detailed view for a selected home



However, if you really want to win over customers the following nice to haves would be greatly received by your customers:



- Sign-in Page

- Ability to share a home on social media

- Send a message to the seller's agent



## Solution Details



Create a detailed web app that solves for the following:



- modularity/re-use of components

- appropriate handling of flow/navigation

- appropirate handling of data/state

- Look and feel of the application (after all this is a GUI)

- quality (unit or functional tests are extra credit)



A sample [data set](./src/homes.json) representing properties has been included to help get you started on what an API call would likely return for the list of active properties. Due to limited timeframe for the assignment it is fine to mock out API calls, however, your application should still dispatch events as though it was making API calls to a service and handle/store data as though it was received from an API call.



As each solution is reviewed there will be an emphasis on the use of ReactJS best practices, design patterns, use of standard packages, use of ES6.



## Submitting the Exercise



1. Ensure that the scripts below (npm start/test/build) are all working for your solution. They should all run successfully.



2. Please make sure the repo is public. If you prefer to keep your repo private, then ensure you have granted read access to [tonyhernandez](https://github.com/tonyhernandez) and [mapayares](https://github.com/mapayares).



3. Completed the Google Form [here](https://forms.gle/We7VGi73apbECGKL6) once you are done with the code. Once submitted do not make any further changes to the code!



## Available Scripts



In the project directory, you can run:



### `npm start`



Runs the app in the development mode.\

Open [http://localhost:3000](http://localhost:3000) to view it in the browser.



The page will reload if you make edits.\

You will also see any lint errors in the console.



### `npm run build`



Builds the app for production to the `build` folder.\

It correctly bundles React in production mode and optimizes the build for the best performance.



The build is minified and the filenames include the hashes.\

Your app is ready to be deployed!



See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.



### `npm test`



Launches the test runner in the interactive watch mode.\

See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.