ko-fi

Releases and tags coincide with specific blog posts in the series See Blog Series

• Part One - releases/tag/v1.0
• Part Two - releases/tag/v1.2
• Part Three - releases/tag/v1.3
• Part Four - releases/tag/v1.4

Sample project motivated by video by David East on Reactfire

• You should know that Reactfire is not considered "Production"
• This project has been tested for use on mobile devices using Capacitor on IOS and Android
• In this project I use Reactfire, Ionic Framework ReactJS Components and React-Hook-Form.
• We use the <AuthCheck/> component for cleaner routing when not logged in, See App.tsx
• Currently there is only Login and Listing The Data Collection
• Will be adding delete items

I am starting to integrated typescript into my examples since I am seeing questions about types popping up in the forums. The IModalData is the structure of the data that is written to firebase

type IModalData = {
 podcastName: string;
 podcastHost: string;
 podcastURL: string;
};
export type IModalResponse = {
 hasData: boolean;
 data?: IModalData;
};

you must create a file called src/env.js and add the following code

export const FIREBASE_CONFIG = {
// YOUR FIREBASE CONFIGURATION
};
// NAME OF COLLECTION IN FIREBASE TO LIST
export const FIREBASE_COLLECTION_NAME = "podcast-favs"
// THIS IS REQUIRED FOR ANDROID
// SEE - https://github.com/FirebaseExtended/reactfire/issues/228
global.globalThis = window;

• Add Items Using Ionic Modal - Added on 7/31/200
• Create Account - Added on 7/31/200
• Delete Items using IonSlidingItem - Added on 8/16/200
• Update Items - Added on 8/16/200
• Reset Forms - Added on 8/16/200
• Default Data in ReactHook Form - Added on 8/16/200

• https://www.youtube.com/channel/UCMCcqbJpyL3LAv3PJeYz2bg