반응형
firebase 설정
1. firebase.google.com/ 에 접속합니다.
2. 콘솔로 이동합니다.
3. 프로젝트를 만듭니다.
4. 애널리틱스는 사용할지를 선택합니다.
저는 사용 안할거라 설정을 안했습니다.
5. 완성 되면 콘솔로 이동 되고 Firestore Database를 선택해주세요
6. 데이터베이스를 테스트 모드로 만들어줍니다.
일정 기간 동안 사용할 수 있습니다.
규칙을 바꾸면 원하는 방식으로도 만들 수 있습니다.
7. 저장소 위치를 지정합니다.
우리나라로도 할 수 있고 원하는 위치에 설정하시면 되고 저는 기본 설정으로 하겠습니다.
처음 지정하면 변경 할 수 없으니 유의해야 합니다.
8. 컬렉션을 원하는 형태로 등록합니다.
컬렉션 - 문서 - 필드의 계층을 가지는 구조입니다.
컬렉션안에 문서가 있고 문서에서 필드를 찾는 형태입니다.
문서의 아이디는 자동ID를 사용하거나 임의로 지정해도 됩니다.
flutter 연동
firebase 설정이 완료되었고 flutter를 연동해보겠습니다.
1. 프로젝트 설정으로 이동합니다.
2. 내 앱에서 연동하고자 하는 플랫폼을 선택합니다.
3. 앱 등록을 합니다.
Android 패키지 이름은 flutter에서 android-app-build.gradle에 있습니다. 사진 참고
4. 구성 파일을 다운로드하고 flutter에서 android-app에 저장합니다.
5. Firebase SDK를 flutter의 android 구성 파일에 설정을 추가합니다.
프로젝트 수준 : flutter - andoird - build.gradle 입니다.
앱 수준 : flutter - android - app - build.gradle 입니다.
6. Firebase 연동은 완료되었고 flutter의 android를 빌드해주어야 합니다.
Open for Editing in Android Studio를 선택해서 안드로이드 스튜디오를 새로 열어주면 자동으로 build됩니다.
flutter 테스트 소스
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
void main() async{
// void main() {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
FirebaseFirestore firebaseFirestore = FirebaseFirestore.instance;
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
FlatButton(
color: Colors.blue,
child: Text("create button", style: TextStyle(color : Colors.white)),
onPressed: (){
String book = "플러터 배우기";
firebaseFirestore.collection('books').doc('flutter').set({ 'page': 433, 'purchase?': false, 'title':'플러터 배우기'});
},
),
FlatButton(
color: Colors.blue,
child: Text("read button", style: TextStyle(color : Colors.white)),
onPressed: (){
String title = "";
firebaseFirestore.collection("books").doc("flutter").get().then((DocumentSnapshot ds){
Map<String, dynamic> data = ds.data();
title = data['title'];
print(title);
});
},
),
FlatButton(
color: Colors.blue,
child: Text("update button", style: TextStyle(color : Colors.white)),
onPressed: (){
firebaseFirestore.collection("books").doc("flutter").update({"page":543});
},
),
FlatButton(
color: Colors.blue,
child: Text("delete button", style: TextStyle(color : Colors.white)),
onPressed: (){
//특정 document 삭제
firebaseFirestore.collection("books").doc("flutter").delete();
//특정 document 의 field 하나를 삭제
firebaseFirestore.collection('books').doc('flutter').update({'page': FieldValue.delete()});
},
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
반응형
'개발(합니다) > Flutter&android&ios' 카테고리의 다른 글
[Flutter] 로컬 서버와 flutter 앱 접속 하는 방법 (0) | 2021.10.04 |
---|---|
[Flutter] OutlinedButton 모서리 둥굴게 만드는 방법 (0) | 2021.08.09 |
[flutter-16] 날씨 앱 만들기 (0) | 2021.03.09 |
[flutter-15] Future-async 심화 (0) | 2021.03.08 |
[flutter-14] 반복문 - For loop (2) | 2021.03.07 |