Simple weather app with Next.js 13

This is a simple weather app built with Next.js 13 using JavaScript (not TypeScript).

For a blog post

This is a demo (proof of concept) app for a blog post about Next.js environment variables.

Run it locally

To run it locally you can clone the app and run npm run dev.

Environment variables

It will need a key from API Ninjas for the weather to work. You can get a free key from them.

You can also add a GA4 tracking ID to track the app. Both of these keys should be added to the .env.local file you can copy the .env.example file to .env.local and add the keys thereby replacing the values shown below:

API_NINJAS_API_KEY="API_NINJAS_API_KEY-value"
NEXT_PUBLIC_GA_MEASUREMENT_ID="G-**--------"

Deploy it to Vercel

You can deploy it to Vercel by clicking the button below:

Demo

You can see the demo of the app at https://nextjs-weather-geo.vercel.app/ and pass the city as the parameter like:

https://nextjs-weather-geo.vercel.app/?city=sydney

By default, it will load the weather for London.