This is a verified interview question from Future-first. Candidates reporting seeing this problem in recent Online Assessments (OAs) and onsite rounds. Mastering "React Weather Dashboard" covers key patterns like System Design.
"## Web Dev Problem We provided some simple React template code. Your goal is to build a weather dashboard application that lets users search for current weather conditions in different cities. When the app loads, it should display a search bar where users can type in a city's name. Once the city name is entered (case-sensitive) and the user hits the "Search" button, the app should fetch and display the current temperature, humidity, and wind speed for the chosen city all in the element with the ID weatherData. For simplicity, you don't have to make actual API calls; instead, use the predefined data to mimic the weather data for a few cities. Additionally, all previously searched cities should be listed below the search bar as buttons. When a user clicks on a previously searched city, its weather data should be displayed again. Ensure the application handles scenarios where the city is not in your mock data by displaying a message: "City not found." You are free to add classes and styles, but make sure you leave the component ID's and classes provided as they are. Submit your code once it is complete and our system will validate your output."
Join thousands of developers practicing for Future-first.