이번 포스트에서는 플러터(Flutter) 프레임워크와 Firebase Database를 사용하여 간단한 날씨 애플리케이션을 만들어 보겠습니다.
Firebase Database 설정
먼저 Firebase Console에 로그인하여 프로젝트를 생성하고, Firebase Database를 설정해야 합니다. Firebase Console에서 “Database” 섹션으로 이동하여 Realtime Database를 선택하고, “시작하기”를 클릭하여 데이터베이스를 만들어 줍니다.
그런 다음 “규칙” 탭으로 이동하여 규칙을 아래와 같이 수정해 줍니다.
{
"rules": {
".read": true,
".write": true
}
}
플러터 프로젝트 생성
이제 Flutter를 사용하여 프로젝트를 생성합니다. 터미널에서 아래 명령어를 실행하여 새로운 Flutter 프로젝트를 생성합니다.
flutter create weather_app
프로젝트가 생성된 후, pubspec.yaml 파일을 열고 firebase_database 패키지를 추가합니다.
dependencies:
flutter:
sdk: flutter
firebase_database: ^X.X.X
X.X.X 부분에는 Firebase Database 패키지의 버전을 입력해야 합니다. 최신 버전을 사용하는 것이 좋습니다. 패키지를 추가한 후, 터미널에서 flutter packages get 명령어를 실행하여 패키지를 설치합니다.
Firebase Database 연결
이제 Firebase Database에 연결하는 코드를 작성해 보겠습니다. main.dart 파일을 열고 다음 코드를 추가합니다.
import 'package:flutter/material.dart';
import 'package:firebase_database/firebase_database.dart';
void main() {
FirebaseDatabase.instance.setPersistenceEnabled(true);
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Weather App',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
DatabaseReference _ref;
String _weatherInfo = "";
@override
void initState() {
super.initState();
_ref = FirebaseDatabase.instance.reference().child("weather");
_ref.onValue.listen((event) {
setState(() {
_weatherInfo = event.snapshot.value;
});
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Weather App"),
),
body: Center(
child: Text(
_weatherInfo,
style: TextStyle(fontSize: 24),
),
),
);
}
}
위 코드에서는 FirebaseDatabase.instance.setPersistenceEnabled(true);를 호출하여 오프라인 상태에서도 데이터를 캐시할 수 있도록 설정합니다.
MyHomePage 위젯은 데이터베이스의 weather 경로에 있는 내용을 실시간으로 감시하고, 변경이 있을 때마다 화면을 업데이트합니다.
데이터베이스에 데이터 추가하기
Firebase Database에 데이터를 추가하려면 Firebase Console에 다음과 같은 규칙을 추가해야 합니다.
{
"rules": {
".read": true,
".write": "(auth != null) && (auth.uid == 'your_uid')"
}
}
그리고 데이터를 추가하기 위해 아래와 같은 코드를 사용합니다.
FirebaseDatabase.instance.reference().child("weather").set({
"city": "Seoul",
"temperature": "20°C",
});
위 코드는 weather 경로에 city와 temperature 필드를 추가합니다.
요약
이제 플러터로 Firebase Database를 사용하여 날씨 애플리케이션을 만들 수 있습니다. Firebase Console에서 데이터베이스를 설정하고, Flutter 프로젝트에서 Firebase Database 패키지를 추가하고 연결하는 코드를 작성했습니다. 데이터를 추가하고 변경 이벤트를 감지하여 화면을 업데이트할 수 있도록 구현했습니다.
더 많은 기능을 추가하고 날씨 애플리케이션을 확장할 수 있습니다.