Firebase

[React] 최신 Firebase Real-Time DB 사용하기

Firestore와 Real-Time DB의 차이점은 아래 글에 간략하게 정리되어있다. [React] 최신 Firebase Firestore 사용하기 Firebase의 기본 설정이 필요하다면 아래 글을 참고하길 바란다. [React] 최신 Firebase에서 로그인 구현하기 React의 Firebase 라이브러리가 업데이트 되면서 함수를 호출하는 방식이 바뀌었다. 거의 필수 muhly.tistory.com Real-Time DB는 doc, collection 두 가지가 존재하는 Firestore와는 다르게 ref라는 하나의 함수만 사용한다. 경로 선언 import { push, ref, limitToLast, onValue, orderByChild, query, remove, } from "@fireba..

[React] 최신 Firebase Firestore 사용하기

Firebase의 기본 설정이 필요하다면 아래 글을 참고하길 바란다. [React] 최신 Firebase에서 로그인 구현하기 React의 Firebase 라이브러리가 업데이트 되면서 함수를 호출하는 방식이 바뀌었다. 거의 필수적으로 사용하는 Auth, Firestore, RealTimeDatabase의 최신 구문을 알아보자. 간단히 바뀐점에 대해 설명하자면 muhly.tistory.com 앞서 Firestore와 Real time database의 차이점을 간단하게 짚고 넘어가자. 먼저, 요금제에 차이가 있다. Firestore는 입출력 횟수당 요금이 부과되지만 Real time database는 입출력 대역폭으로 요금이 부과된다. 또한 후자는 연결할 수 있는 유저의 제한이 있다. 아마도 동시접속자 인듯..

[React] 최신 Firebase에서 로그인 구현하기

React의 Firebase 라이브러리가 업데이트 되면서 함수를 호출하는 방식이 바뀌었다. 거의 필수적으로 사용하는 Auth, Firestore, RealTimeDatabase의 최신 구문을 알아보자. 간단히 바뀐점에 대해 설명하자면 Class내에 선언되어있던 함수들을 모두 전역으로 전언해서 사용할 수 있게 바뀌었다. 예를들어 Email login 함수가 FirebaseAuth 내부에 선언되어 있어 이를 FirebaseAuth.emailLogin()과 같은 형태로 사용했어야 했다면, 최신 버전에서는 emailLogin(FirebaseAuth, email, password)의 형태로 사용하게끔 변경되었다. 설치 yarn add firebase Firebase_config.js import { initial..

[Flutter web] Firebase 구글 로그인

[Flutter] 플러터 Web 개발하는 법 21/11/27 수정된 글입니다. 플러터는 모바일 애플리케이션과 웹을 동시에 제작할 수 있게 고안된 프레임워크이다. 그리고 최근 2.0에서 리눅스, 맥, 윈도우와 같은 응용프로그램들도 개발 할 수 있 muhly.tistory.com [플러터 web] 플러터 웹과 Firebase 연동하기 [Flutter] 플러터 Web 개발하는 법 플러터는 앱&웹을 동시에 제작할 수 있다. 앱을 크롬과 같은 웹 브라우저에서 실행 시키는 건데, 전통적인 웹과는 인터페이스가 다르다. 디스코드를 생각하면 쉽 muhly.tistory.com 기본적인 플러터 웹의 Firebase 설정은 위의 포스팅들을 참고하길 바란다. 이번엔 Firebase와 플러터 웹을 이용해 구글 로그인을 구현 해..

[Flutter 이슈해결] FirebaseException([core/no-app]

이슈 / 에러 FirebaseException ([core/no-app] No Firebase App '[DEFAULT]' has been created - call Firebase.initializeApp()) 해결 방법 플러터에서 파이어베이스 연동시 반드시 파이어베이스 초기화 함수를 호출해야한다. 공식 문서의 초기화 함수를 그대로 사용해도 에러가 발생해서 찾아보니, 초기화가 되기전 데이터를 불러와서 발생하는 문제였다. 따라서 파이어베이스 초기화 함수를 future로 변경하고 whenComplete로 다음을 진행하도록 하였다. 최상위 클래스인 MyApp을 stateful로 변경하고 아래의 코드를 추가한다. 이미 초기화 함수가 있는 경우는 초기화 함수를 future로 변경 후 whenComplete로 진..