React Native with Firebase

2018/11/10

2019/05/05 (增加連結)

2020/09/04 (更新內容)

簡介

react native有兩個常用的firebase library，一個是firebase js library，另一個是react native firebase。目前都有一些小問題: firebase js library可以在expo.io上執行 (Using Firebase on expo & Firebase and React Native)，react native firebase則無法在expo上執行(詳參: Full native firebase integration )。

請詳參吳濟聰老師行動裝置程式設計課程的範例程式。

firebase js library with expo

firestore

• Get started with Cloud Firestore

• How I got Expo and react-native-firebase working in one project?

• How To Create A Mobile App In Expo And Firebase (For iOS And Android)

• React Native Firebase Tutorial: Build CRUD Firestore App (2018.10 / updated in 2019.08)

  • expo with firebase.js

• Firebase SDK with Firestore for React Native apps in 2018 (2018.09)

  • Firebase Javascript SDK

  • React Native Firebase

  • Trying Firestore

firebase authentication

• Get Started with Firebase Authentication on Websites

• React Native Firebase – Login and User Registration Tutorial

  • Prerequisite

  • Install React Native Project

  • Firebase Account Setup

  • Set up Firebase in React Native

  • Initiate Navigation in React Native

  • Register with Email and Password

  • Login User with email and password

  • Logout from Firebase via React Native

• How to build an Email Authentication app with Firebase, Firestore and React Native

firebase cloud message (FCM)

• Firebase Cloud Messaging

  • About FCM messages

  • Set up a JavaScript Firebase Cloud Messaging client app

  • Receive messages in a JavaScript client

• Expo

  • Push Notifications Overview

  • Receiving Notifications

  • Using FCM for Push Notifications

  • React Native Push Notifications using Expo

    • Push notifications tool

firebase cloud storage

• Firebase Cloud Storage

  • Get Started on Web

  • Create a Storage Reference on Web

  • Upload Files on Web

  • Delete Files on Web

  • List Files on Web

• React Native Image Upload and Cropping with Firebase

• Upload Images to Firebase in Expo

• Uploading to Firebase Storage with React Native (expo)

  • Step 1: Getting a File URI

  • Step 2: Creating a blob

  • Step 3: Uploading BLOB to Firebase

firebase realtime database

• 用 React Native + Firebase 開發跨平台行動應用程式

  • 使用 React Native 結合 Redux/ImmutableJS 和 Firebase 開發一個記錄和刪除名言佳句（Mottos）的 Mobile App

• The beginners guide to React Native and Firebase

• How To Build A Chat App With React Native (Expo + Firebase + React Native + Gifted Chat)

react native firebase

• Announcing: React Native Firebase version 6.0.0

• React Native Firebase in 2019

firestore

• Cloud Firestore Library and framework integrations

  • AngularFire

  • FirebaseUI

  • React Native Firebase

• Getting started with Cloud Firestore on React Native

• Firebase SDK with Firestore for React Native apps in 2018 (2018.09)

  • Firebase Javascript SDK

  • React Native Firebase

  • Trying Firestore

• React Native Firebase

  • ** Expo does not support integration with native modules via it's "Managed workflow". Integration is only possible when used with the "Bare workflow".

firebase authentication

• How to Add Authentication to React Native in Three Steps Using Firebase

  • Installing react-native-firebase

  • Adding firebase credentials

  • Adding SignIn, Login

• React Native and Firebase: Authentication

  • Setting Up Our App

    • react-native-firebase

  • Enable Email and Password Authentication in Firebase

  • Creating the Screens

  • Determining if a User Is Authenticated

  • Signing a User Up

  • Displaying the Current User on the Main Screen

  • Logging an Already Existing User In

• Getting started with Firebase Authentication on React Native

Firebase Cloud Storage

• React Native Image Upload To Firebase Cloud Storage — iOS

• Upload Files Using React Native and Firebase (Part 1)

• Upload Files Using React Native and Firebase (Part 2)

• Upload Files Using React Native and Firebase (Part 3)

Firebase Crashlytics

• Firebase Crashlytics for React Native

Redux

• Redux 入門

• Redux & React (《從0到100打造一個React Native boilerplate》系列 )

• Tutorial 1: React Native Redux Boilerplate

• Tutorial 2: React Native Redux with CRUD operations

• Getting Started with React Native & Redux

• How to build a React Native App using Firebase. (Part 1) (使用redux)

• How to build a React Native App using Firebase. (Part 2) (使用redux)

• How to build a React Native App using Firebase. (Part 3) (使用redux)

• How to build a React Native App using Firebase. (Part 4)(Facebook Login) (使用redux)

• How to build a React Native App using Firebase. (Part 5) (CRUD)