Weather App - React Native

TR

Uygulama Açıklaması

Günlük ve haftalık hava durumunu görüntüleyebileceğiniz React Native ile hazırlanmış hava durumu uygulaması.

Uygulama Tanıtım Videosu

Basliksiz.Proje.mp4

Uygulama Özellikleri

• Kullanıcı uygulamaya girdiği zaman bulunduğu konumdaki hava durumunu görüntüleyebilmesinde kullanılacak konum izni diyaloğu karşısına çıkar
• Arama özelliğini kullanarak istenilen konumdaki haftalık ve günlük hava durumu verilerini liste şeklinde görüntüleyebilir
• Kullanıcının karşısına çıkan veriler saatlik olarak güncellenir.
• Her bir hava durumu için kullanılacak animasyonlar uygulama içerisinde mevcuttur, günlük hava durumu üst kısımda haftalık hava durumu ise alt kısımda yer alır.
• Seçilen ülke/şehir ismi, rüzgar hızı ve sıcaklığın istenilen birimde değeri gibi bilgiler uygulamanın orta kısmında görüntülenebilir.
• Ayarlar kısmında uygulamanın temasını ve kullanılan birimleri değiştirmek için kullanılan alanlar bulunmaktadır.

Kullanılan Paketler

• react-native-async-storage
• axios
• lottie-react-native
• moment
• react-native-navigation
• react-native-dotenv
• react-native-geocoding
• react-native-geolocation-service
• react-native-google-places-autocomplete
• react-native-modal
• react-native-vector-icons

Yükleme Adımları

Bu uygulama sadece android tarafında test edilmiştir, iOS tarafında testi yapılmamıştır.

1. Uygulamanın dosyalarını git clone komutu ile yerel bilgisayarınıza kopyalayın.
2. Uygulamayı herhangi bir editör ile dosya konumu ile birlikte açın.
3. Bilgisayarınızda node js kurulu değilse kurulumunu gerçekleştirin!
4. Uygulamada kullanılan paketleri proje içerisine dahil etmek için terminale npm install komutunu yazın ve paketlerin yüklenmesini bekleyin.
5. npx react-native run-android komutunu kullanarak telefonunuzda veya emulatörünüzde uygulamayı başlatın.

---

EN

Application Description

A weather app built with React Native that allows you to view daily and weekly weather conditions.

Application Features

• When the user enters the application, a location permission dialog box will appear to display the weather conditions in their current location.
• By using the search feature, the user can view weekly and daily weather data for the desired location in list format.
• The data presented to the user is updated on an hourly basis.
• The application contains animations to represent each weather condition, with daily weather conditions displayed at the top and weekly weather conditions at the bottom of the screen.
• The selected country/city name, wind speed, and temperature value in the desired unit can be displayed in the middle of the application.
• There are fields in the settings tab to change the theme of the application and the units used.

Used Packages

• react-native-async-storage
• axios
• lottie-react-native
• moment
• react-native-navigation
• react-native-dotenv
• react-native-geocoding
• react-native-geolocation-service
• react-native-google-places-autocomplete
• react-native-modal
• react-native-vector-icons

Installation Steps

This application has only been tested on the android platform and not on iOS.

1. Copy the application files to your local computer using the git clone command.
2. Open the application with any editor along with the file location.
3. If node js is not installed on your computer, install it!
4. To include the packages used in the application in the project, type the npm install command in the terminal and wait for the packages to be installed.
5. Start the application on your phone or emulator using the npx react-native run-android command.