https://github.com/michaelfarquhar/react-firebase-auth
Basic login, logout and register functionality using React & Firebase Authentication
https://github.com/michaelfarquhar/react-firebase-auth
authentication firebase learning-by-doing mui react redux typescript
Last synced: 3 months ago
JSON representation
Basic login, logout and register functionality using React & Firebase Authentication
- Host: GitHub
- URL: https://github.com/michaelfarquhar/react-firebase-auth
- Owner: MichaelFarquhar
- Created: 2022-05-17T23:58:43.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2022-12-10T21:04:27.000Z (over 3 years ago)
- Last Synced: 2025-08-13T23:34:07.489Z (11 months ago)
- Topics: authentication, firebase, learning-by-doing, mui, react, redux, typescript
- Language: TypeScript
- Homepage: https://react-firebase-authenticator.netlify.app/
- Size: 646 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# React + Firebase Authentication
A basic user authentication app built with TypeScript React using Firebase. This system can be used in other projects that also utilize Material UI and Redux. This app includes the bare minimum features of user authentication, such as registering a new user, logging in and logging out.
This app was built to gain experience in packages I have little experience in, particularly TypeScript, Firebase and Redux Toolkit.
This app is built with the following packages:
- **React Typescript**, bootstrapped with Create React App
- **Firebase Authentication & Firestore**
- (Firebase Authentication only stores an email and password so I used Firestore to handle the storage of Username and Name fields as well.)
- **Material UI** as my component library.
- **Redux Toolkit** to store user data in state after they log in
- **React Router** to handle page routing
- **Formik and Yup** to handle forms and validation.
---
### Live Demo On Netlify
- [View Demo](https://react-firebase-authenticator.netlify.app/)
### Demo Test Account
- Email: test@test.ca
- **Password**: password
### Routes
| / | Login page or redirect to [ /profile ] if already logged in. |
| --------- | ------------------------------------------------------------ |
| /register | Register page. |
| /profile | Profile page |