Using ReactFire & Redux To Build A CRUD App with Firebase Emulator

Aaron K Saunders - Mar 7 '21 - - Dev Community

Overview

This video series covers Create React App, ReactFire, Redux Toolkit and Firebase Emulator to build a simple CRUD application.

When I am developing solutions I like to find tools that make it easier for me to focus on adding value through the application and spend less time on the technical implementation. I believe this combination can be beneficial to you also, so please take a look.

Setup, Login, Logout, And Testing With Firebase Emulator


In part one, We set up the firebase project and connected it all to the firebase emulator for authentication and account creation all using reactfire. We will build the login screen and the home screen in this example. The starting point will be using a blank app generated with create-react-app

Query, Add & Delete Docs Testing With Firebase Emulator


In part two we are querying documents from firestore and setting up the created crud actions using the reactfire firebase hooks

State Management With Redux-Toolkit


Part Three we integrate redux-toolkit as a method for state management in the application

Links

ReactFire - GitHub Project
ReactFire Overview - Documentation
Firebase Emulator - Overview

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .