https://github.com/ryanlarge13/native-weather
Expo Router and Open Meteo join forces
https://github.com/ryanlarge13/native-weather
Last synced: 8 months ago
JSON representation
Expo Router and Open Meteo join forces
- Host: GitHub
- URL: https://github.com/ryanlarge13/native-weather
- Owner: RyanLarge13
- Created: 2025-07-17T03:03:02.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-07-18T03:08:42.000Z (12 months ago)
- Last Synced: 2025-08-31T12:41:44.201Z (10 months ago)
- Language: TypeScript
- Size: 25.1 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🌤️ Expo Weather App
[](https://expo.dev/)
[](https://reactnative.dev/)
[](LICENSE)
[](https://www.typescriptlang.org/)
[](https://www.sqlite.org/)
[](#)
---
## 📚 Table of Contents
- [📱 Features](#-features)
- [🚀 Tech Stack](#-tech-stack)
- [🧠 Architecture Overview](#-architecture-overview)
- [📂 Project Structure Highlights](#-project-structure-highlights)
- [🛠️ Setup & Usage](#️-setup--usage)
- [🧪 Notes](#-notes)
- [📸 Screenshots](#-screenshots)
- [📝 Future Improvements](#-future-improvements)
- [📄 License](#-license)
---
## 📱 Features
- 📍 Auto-detects device location using permissions
- 🏙️ Supports static city selection from `cities.json`
- 🌦️ Shows:
- Current weather conditions
- 24-hour hourly forecast
- 7-day forecast
- 🎨 Theme support (orange, blue, green)
- 💾 SQLite-based settings storage (theme, temperature unit, accuracy)
- 🎞 Animated transitions using Moti
---
## 🚀 Tech Stack
- [Expo](https://expo.dev/)
- [React Native](https://reactnative.dev/)
- [Moti](https://moti.fyi/)
- [expo-location](https://docs.expo.dev/versions/latest/sdk/location/)
- [expo-sqlite](https://docs.expo.dev/versions/latest/sdk/sqlite/)
- TypeScript
---
## 🧠 Architecture Overview
The app revolves around the `Index` screen which:
- Initializes app state
- Loads saved settings from SQLite
- Requests and handles location permissions
- Loads weather data from local dummy data or (optionally) an API
- Renders:
- Current weather (``)
- Weather details (``)
- Hourly forecast (``)
- Weekly forecast (``)
---
## 📂 Project Structure Highlights
```
.
├── assets/
│ ├── images/icons/ # Weather icons
│ └── cities.json # City coordinates map
├── components/
│ ├── Today.tsx
│ ├── TodaysInfo.tsx
│ ├── Hourly.tsx
│ └── Day.tsx
├── hooks/
│ └── useTabAnimation.ts
├── utils/
│ ├── api.ts
│ ├── dayStringMap.ts
│ ├── weatherCodes.ts
│ └── dummyData.ts
└── index.tsx # Main screen logic
```
---
## 🛠️ Setup & Usage
### Prerequisites
- Node.js
- Expo CLI
### Getting Started
```bash
git clone https://github.com/yourusername/weather-app.git
cd weather-app
npm install
npx expo start
```
- Ensure your emulator or mobile device has **location services enabled**
- The local SQLite database (`myApp.db`) should contain a `Settings` table
---
## 🧪 Notes
- Weather data is loaded from `utils/dummyData.ts`
> You can replace `M_FetchWeather()` logic to call a real API (like OpenWeatherMap)
- If location access is denied, the app falls back to manually selected cities
---
## 📸 Screenshots
> _(Add screenshots here if available)_
> For example:
>
> - 
> - 
---
## 📝 Future Improvements
- 🌐 Replace dummy data with real-time API integration
- 🧭 Fallback handling if location services fail
- 🛠 Add user-facing Settings screen
- 🌍 Multi-language (i18n) support
---
## 📄 License
This project is licensed under the [MIT License](LICENSE).