CodStak Weekly Challenge #1: Weather Dashboard
React interview Question. Create a simple Weather Dashboard using React and TypeScript.
Hey coders👨🏽💻👩🏽💻,
I am starting CodStak, the challenge of the week!! I will be sending you a weekly email with 1 challenge each week. The challenge will test your frontend skills, and give you a simulation of real-world interviews where you will be asked questions like this.
I know you have been doing a lot of leetcode, but always remember, after your leetcode, you will be asked questions regarding the front-end. Doing these challenges will give you an edge. I am designing these questions so they cover multiple topics in one challenge.
This week's challenge is creating a simple weather component. I think any junior developer should be able to solve this without much trouble. So, give it a try. Next time, the challenge might not be as simple as this is. 😉
You may try the challenge here:
Description:
Create a simple Weather Dashboard using React and TypeScript that displays weather information based on user input. The component should allow users to enter a city name, and upon clicking the search button, it will display weather details such as temperature, condition, and an icon representing the weather.
(Please use only London as a city that sends the information, the rest cities should show an error message. In the challenge itself, I have added the dummy JSON that mocks an external API)
Key Features to keep in mind:
Input field for the city name.
Display of weather details (temperature, condition, and icon).
Error message for invalid city names.
This challenge is perfect for practicing state management, event handling, conditional rendering, and creating user-friendly interfaces.
And if your city doesn’t exist, you may show an error message like this:
That's all folks! Will see you next week with a new challenge. If you have any questions, feel free to reach out to me at X.
Have fun coding!!
If you feel like any of your friends would benefit from this newsletter, please share it with them as well.
Behind the scene:
I'm excited to launch a weekly newsletter where I’ll be sharing front-end challenges to help you ace your interviews or level up your coding skills.
I have moved the newsletter from ghost to substack. That’s why it feels different to you!! 😉
You'll receive updates straight to your inbox, and you can also log in to the website to access the full archives and explore other posts as they go live.