https://github.com/kelvinleandro/weather-app

Weather app made with Expo and WeatherAPI
https://github.com/kelvinleandro/weather-app

expo expo-cli javascript react react-native react-navigation reactjs typescript weather-api weather-app weatherapi

Last synced: about 8 hours ago
JSON representation

Weather app made with Expo and WeatherAPI

• Host: GitHub
• URL: https://github.com/kelvinleandro/weather-app
• Owner: kelvinleandro
• License: mit
• Created: 2024-06-29T12:12:13.000Z (4 months ago)
• Default Branch: main
• Last Pushed: 2024-07-09T19:37:14.000Z (4 months ago)
• Last Synced: 2024-11-05T12:17:59.873Z (about 8 hours ago)
• Topics: expo, expo-cli, javascript, react, react-native, react-navigation, reactjs, typescript, weather-api, weather-app, weatherapi
• Language: TypeScript
• Homepage:
• Size: 2.98 MB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Weather App (Quintura)

"Quintura" is built using React Native, Expo, and TypeScript. It utilizes the WeatherAPI to fetch weather data and Expo Location for accessing the user's current location. The app supports saving favorite locations, searching for cities by name or coordinates, and dynamically updates the home screen's background and animations based on the weather and time of day.

## Preview (Google Pixel 7)

![preview](./assets/preview.png)

## Features

- **Current Weather**: Users can view the current weather for their location using Expo Location.

- **Favorite Locations**: Users can save favorite locations. Favorites are stored in AsyncStorage and synchronized with context updates.

- **City Search**: Users can search for cities by name or coordinates (latitude and longitude).

- **Dynamic Background**: The home screen background updates based on whether it's day or night in the selected city.

- **Animated Weather Conditions**: The app uses Lottie animations to represent the current weather condition dynamically.

- **Settings Screen**: Users can choose their preferred units, such as Celsius and Fahrenheit for temperature.

## Project Structure

- **src/api/:** Contains modules related to API calls (WeatherAPI).

- **src/assets/:** Contains Lottie animation files for different weather conditions.

- **src/components/:** Reusable components used throughout the app.

- **src/context/:** Contains context for managing global state.

- **src/hooks/:** Custom hooks for handling specific logic and state management (access Location Context values).

- **src/routes/:** Navigation setup for the app.

- **src/screens/:** Contains screen components for different parts of the app.

- **src/types/:** TypeScript type definitions, e.g., for WeatherAPI response types.

- **src/utils/:** Utility functions used across the app.

## Setup and Installation

1. Clone the repository:

```bash

git clone https://github.com/kelvinleandro/weather-app

cd weather-app

```

2. Install dependencies:

```bash

npm install

```

3. Run the app:

```bash

npx expo start

```

## Dependencies

- **React native**

- **Expo**

- **TypeScript**

- **WeatherAPI**

- **Expo Location**

- **AsyncStorage**

- **Lottie**

## License

This project is licensed under the MIT License. See the LICENSE file for details.