About

A react weather app with a clean, minimal and responsive design that focuses on the essentials.

  Built with

• TypeScript
• Next.js
• Zustand
• SWR
• Base Web UI
• Styletron
• Fluent UI System Icons
• Meteocons
• OpenWeatherMap Weather Data
• Google Maps Places & Geocoding

  Development

Run project

Install and run locally

yarn
yarn start

Build for production

yarn build

Create ENV variables for API keys

Create an .env file in the root of the project and add the following lines:

GOOGLE_MAPS_API_KEY="YOUR_GOOGLE_MAPS_API_KEY"
OPENWEATHERMAP_API_KEY="YOUR_OPENWEATHERMAP_API_KEY"

  API keys

1. Create an OpenWeatherMap account and generate a key
2. Create a Google Maps Project, then create an API key. In the Credentials area you can restrict it to:
   • Geocoding API
   • Places API

Designed and built by Tom Watts