Firebase (10) 썸네일형 리스트형 [Flutter] Clone - 당근마켓35(ItemModel upload) 이번에는 "거래 등록" 화면에 작성한 글/이미지를 Firebase 에 업로드하는것을 구현해보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 구현 화면은 아래와 같다 ./src/repo/item_service.dart - 새로운 글을 저장하는 로직 구현 import 'package:cloud_firestore/cloud_firestore.dart'; import '../constants/data_keys.dart'; import '../models/item_model.dart'; import '../utils/logger.dart'; Future createNewItem(ItemModel2 itemModel, String itemKey, String userKey) asy.. [Flutter] Clone - 당근마켓34(InputScreen - image uploading) 이번에는 image picker 에서 선택한 이미지를 Firebase Storage 에 저장하고 저장위치를 알아내는 부분을 구현해보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 필요한 패키지는 아래와 같습니다. firebase_storage: ^10.3.5 패키지를 추가하고 Storage 의 Rules 부분을 수정해야 한다. 수정하지 않으면 데이터를 업로드 할 수 없다. rules_version = '2'; service firebase.storage { match /b/{bucket}/o { match /{allPaths=**} { allow read, write: if request.auth != null; } } } ./src/models/item_model.da.. [Flutter] Clone - 당근마켓22(userModel 구현) 이번에는 사용자 정보(userModel)를 실제 쓰고, 읽기를 구현해보겠습니다. 개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1 ./src/repo/user_service.dart import 'package:cloud_firestore/cloud_firestore.dart'; import '../constants/data_keys.dart'; import '../models/user_model.dart'; class UserService { // 싱글톤 디자인 패턴 *************************************** // 인스턴스가 한번만 생성되고, 2번째 생성시에는 처음 생성한 인스턴스를 리턴, static final UserService _userServi.. [Flutter] Clone - 당근마켓17(firebase 환경설정 테스트) 이번 시간에는 firebase 환경 설정에 대한 테스트를 진행하겠습니다. 추가된 패키지는 아래와 같습니다. firebase_core: ^1.20.0 main.dart import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; import 'package:firebase_core/firebase_core.dart'; import 'src/apple_app.dart'; import 'src/screens/splash/splash_screen.dart'; import 'src/utils/logger.dart'; void main() async { WidgetsFlutterBinding.ensureInitialized(); a.. [Flutter] Clone - 당근마켓16(Firebase 환경설정) 이번 시간에는 firebase 환경 설정에 대해서 알아보겠습니다. flutter CLI 방식이 아닌 android 방식으로 진행했습니다. 1. 시작하기 - 회원가입은 미리하시기 바랍니다. 2. 원하는 이름을 입력하세요. 저는 3.0 버전이라서 3 를 붙였습니다. 설정할 필요없이 계속 진행. Default 로 프로젝트 생성 기존 안드로이드 설정 방식으로 진행하였습니다. 여기에 입력할 2개의 값은 아래의 절차 대로 진행하면 된다. 패키지 이름은 여기에서 확인 가능 SHA-1 키 값은 https://developers.google.com/android/guides/client-auth 사이트의 초반부 참고 ~\android>keytool -list -v -alias androiddebugkey -keystor.. [Flutter] Web 기본설정 Firebase 에서 웹 등록 버튼을 클릭 후 아래의 SDK 부분을 web/index.html 에 추가함 실제로 개인 설정 파일 내용 - 상세 설정 참고 사이트 ==> https://firebase.flutter.dev/docs/overview - 이메일 로그인/구글로그인/페이스북 로그인/애플로그인(개발자 계정필요해서 못함) // 버전은 현재 기준 최신버전임, 아래 내용은 개인의 환경에 따라 다름 // 안드로이드 앱에서 보이던 사진들(URL로 로딩하는 사진)이 안보이는 오류 발생시 대처방법 // 아래 부분은 기본 설정부분(flutter 프로젝트 생성시 자동 생성) [Flutter] Firebase SHA-1 keytool 업글) 하단에 작성한 내용은 안드로이드 스튜디오 3.6.3 버전에서 테스트한 결과입니다. Arctic Fox 에서는 메뉴 구성이 변경되어 정상동작하지 않습니다. 그래서 최신 환경(2022.01.07)에서 구현한 방법은 아래와 같습니다. 프로젝트폴더의 adnroid 폴더로 이동한 후 아래 명령어 실행 (또는 안드 스튜디오에서 터미널을 열고 cd android && ./gradlew signingReport 이렇게 명령어를 실행해도 됨) ./gradlew signingReport 명령어를 실행하면 됨. 명령어를 실행할때 주의 사항 >>> Enter 키로 실행시키면 오류가 발생하는 경우가 있다. 이럴때는 윈도우 : Ctrl + Enter 맥 : Command + Enter 결과는 아래 사진과 같음. -----.. [Flutter] StreamBuilder with FirebaseFirestore StreamBuilder 로 Firebase의 collection 데이터를 연결하는 샘플코드 /* 플러그인 정보 */ firebase_core: ^0.7.0 firebase_storage: ^7.0.0 cloud_firestore: ^0.16.0 Widget _buildBody() { return WillPopScope( child: StreamBuilder( stream: FirebaseFirestore.instance .collection('post') .doc(docID) .collection('post_sub') .orderBy('datetime') .snapshots(), builder: (BuildContext context, AsyncSnapshot snapshot) { if (!snapsh.. 이전 1 2 다음