[flutter] 플러터를 활용한 날씨 정보 앱 개발
이번에는 플러터(Flutter)를 사용하여 간단한 날씨 정보를 제공하는 앱을 개발해 보겠습니다. 이 앱은 사용자의 현재 위치를 기반으로 날씨 정보를 보여주고 사용자가 원하는 지역의 날씨 정보도 검색할 수 있습니다.
준비물
- Flutter SDK 설치
- 에디터: Visual Studio Code 또는 Android Studio
날씨 API
이 앱에서는 날씨 정보를 제공하기 위해 오픈 웨더 API(OpenWeather API)를 활용합니다. API 키를 발급받아야 하며, 키를 이용하여 현재 날씨 정보와 위치 검색을 할 수 있습니다.
앱 개발
우선 Flutter 프로젝트를 생성하고, 필요한 패키지를 설치합니다.
flutter create weather_app
cd weather_app
flutter pub add http
flutter pub add location
위치 권한 추가
사용자의 현재 위치 정보를 가져오기 위해 location 패키지를 사용할 것입니다. 따라서 안드로이드와 iOS의 위치 권한을 추가해야 합니다.
Android
AndroidManifest.xml 파일에 다음 권한을 추가합니다.
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
iOS
Info.plist 파일에 위치 접근을 위한 설명을 추가합니다.
<key>NSLocationWhenInUseUsageDescription</key>
<string>Our app needs access to your location for better user experience</string>
위치 권한을 추가한 뒤에는 해당 플러그인을 초기화해야 합니다.
import 'package:location/location.dart';
void main() {
runApp(MyApp());
Location().requestPermission();
}
날씨 정보 가져오기
사용자의 현재 위치를 기반으로 날씨 정보를 가져오려면 좌표(위도, 경도)가 필요합니다. location 패키지를 사용하여 현재 위치를 가져온 후, 오픈 웨더 API를 활용하여 날씨 정보를 가져올 수 있습니다.
import 'package:http/http.dart' as http;
Future<Map<String, dynamic>> fetchWeather(double lat, double lon) async {
final apiKey = 'YOUR_API_KEY';
final url = 'https://api.openweathermap.org/data/2.5/weather?lat=$lat&lon=$lon&appid=$apiKey';
final response = await http.get(Uri.parse(url));
if (response.statusCode == 200) {
return json.decode(response.body);
} else {
throw Exception('Failed to load weather data');
}
}
위의 코드에서 YOUR_API_KEY는 오픈 웨더 API에서 발급받은 키를 넣어주어야 합니다.
이제 플러터를 활용하여 이러한 기능들을 조합하여 날씨 정보 앱을 완성해 나갈 수 있습니다. 이를 통해 사용자들은 쉽게 현재 날씨를 확인하고 원하는 지역의 날씨 정보를 검색할 수 있을 것입니다.