Responsive weather app using Next.js, TypeScript and Tailwind CSS

What are you most proud of, and what would you do differently next time?

I’m most proud that I was able to complete the challenge with a fully functional weather app that closely matches the provided design. It was a good exercise in working with APIs, managing state, and ensuring the layout is responsive across devices. Next time, I would focus on cleaning up the code earlier, setting up better error handling for API calls, and structuring the components more efficiently to make the project easier to scale.

What challenges did you encounter, and how did you overcome them?

One of the main challenges was dealing with the API data structure and making sure the right weather metrics (hourly, daily, and current) were displayed correctly. I solved this by carefully reviewing the Open-Meteo API documentation, experimenting with responses, and adding conditional checks to handle missing or undefined values. Another challenge was making the hourly and daily forecast sections interactive. I approached this by breaking them into reusable components and using state to track which forecast should be shown in detail.

What specific areas of your project would you like help with?

I’d like feedback on:

Best practices for structuring API calls in a Next.js + TypeScript project (should I use Axios or keep fetch?).

Suggestions for improving the way I manage units (Celsius/Fahrenheit, km/h/mph) to keep the code more maintainable.

Advice on optimizing performance for larger datasets (e.g., hourly forecasts over multiple days).