1-Imagine you are looking for a particular price range $2000-$3000 and blue colour.
2-The result would be an array of different car makes that you are going to sort based on age and show the 6 newest cars.
3-Pick the first car of the list and based on the make of the car, BMW, Fiat, Porsche, …, recommend 4 cars of the that make. So if the first car in the list is Honda, show 4 Honda cars.
1-For the price range, use a dropdown with four select option: $1000-$2000 $2000-$3000 $3000-$4000 $20000-22000
2-For the color selector,use a dropdown with the following options: Blue Pink Green Khaki Indigo Puce Crimson
3-The checkbox Availability should be default to false
4-When hit "Result" button, the application will fetch the cars that matches the selected criteria and show in the next page
5- on top of the result page,I may show only 6 of the cars that meet the criteria ordered by age of the car,show the newest 6 cars
6- At the bottom of the page, show 4 recommanded cars based on the type of the first car.
7-Both pages should be handled on 1 page and DON'T need to use react-router
8- On each box,the following details should be shown: -Car name(BMW,Fiat,...) -Car model(330d,300E,...) -Car color(Blue,Red,...)
9-If there is no result based on criteria,show an empty space saying that there is no result but still show the recommended 4 options based on the model of the car
#Data Source For the data source,I use the following library: https://github.com/NerdyLuffy/myFakeApi When you run it locally,the api can be accessed on http://localhost:9000
This project was bootstrapped with Create React App.
In the project directory, you can run:
Runs the app in the development mode.
Open 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.