Weather.io

Weather.io is a simple, user-friendly application that fetches and displays real-time weather data for any city using the OpenWeatherMap API and Open Meteo API. It's not collecting any data and is free from ads. You can use it for free and without any registration.

How to start

After you installed pnpm (you can look here at the installation guide), you can run the following command: pnpm install
This will install all the dependencies for the project.

Next you will have to fill the .env file with your own API keys, following the .env.example file as a guide.

After that you have to go into the city-data dir (cd packages/city-data), execute this command and follow all Convex setup instructions: pnpm dlx convex dev

From there on you have to run pnpm update:city-data-dev (for inserting the city data into the db in the dev branch).

After that you can run the following command, to look at the current state (with your own changes) of the project by executing this command at the root directory: pnpm dev

What's next? Which technologies are used?

We try to keep this project as simple as possible, so you can start with just the scaffolding we set up for you, and add additional things later when they become necessary.

If you are not familiar with the different technologies used in this project, please refer to the respective docs. If you still are in the wind, please join our Discord and ask for help.

• Next.js
• Tailwind CSS
• tRPC
• TypeScript
• Turborepo
• Playwright
• Convex

APIs

• OpenWeatherMap API
• Open Meteo API
• QWeather API
• API Ninjas API (For the Reverse Geocoding)

Project Structure

.github
  └─ workflows
        ├─ Playwright tests
        ├─ Lighthouse score in Pull Requests
        ├─ Update Convex Deployment 
        └─ CI with pnpm cache setup
apps
  └─ next.js
      ├─ Next.js 14
      ├─ React 18
      ├─ Tailwind CSS
      └─ E2E Typesafe API Server & Client
packages
  ├─ api
  |   └─ tRPC v11 router definition
  ├─ city-data
  |    ├─ Convex Files for the database and convex functions
  |    └─ Scripts for pulling the city-data
  ├─ e2e-web-tests
  |    └─ Playwright tests for the Next.js app
  ├─ types 
  |    └─ Types that are used across the whole project
  └─ ui
      └─ Start of a UI package for the webapp using shadcn-ui and custom components
tooling
  ├─ eslint
  |   └─ shared, fine-grained, eslint presets
  ├─ prettier
  |   └─ shared prettier configuration
  ├─ tailwind
  |   └─ shared tailwind configuration
  └─ typescript
      └─ shared tsconfig you can extend from

Learn More

To learn more about the T3 Stack, take a look at the following resources:

• Documentation
• Learn the T3 Stack — Check out these awesome tutorials

You can check out the create-t3-app GitHub repository — your feedback and contributions are welcome!

How do I deploy this?

Follow the T3 deployment guides for Vercel, Netlify and Docker for more information.

Create T3 App & Create T3 Turbo

This is a T3 Stack project bootstrapped with create-t3-app.

The Turborepo structure is from Create T3 Turbo.