Auth Firebase Next React Jotai

Overview

This repo provides a starter template for initializing a Next.js application with a fully functional authentication system using Firebase v9. The template is built using TypeScript, React, and Jotai, and offers features such as sign-up/sign-in with email/password, sign-in with Google, password reset, and user management in Firestore. While the repo is ready to be cloned or forked for immediate use, the author also mentions that they are working on a comprehensive guide to set up and manage authentication in a Next.js + React application with Firebase and Jotai.

Features

• Sign-up/Sign-in with email/password: Users can create an account or sign in using their email and password.
• Sign-in with Google: Users have the option to sign in using their Google credentials.
• Sign-in with magic link: Users can sign in using a magic link sent to their email.
• Reset password: Users can reset their password if they forget it.
• Sign out: Users can sign out of their account.
• Add/remove user in Firestore: When a user creates or deletes their account, the corresponding user entry is added or removed from Firestore using Firebase Cloud Functions.
• Auth modal state management with Jotai: Authentication modal states are managed using Jotai, a state management library.

Installation

To install the Next.js app with Firebase Auth, follow these steps:

1. Clone this repository.
2. Install the required dependencies.
3. Create a new project in Firebase and set it up for Firebase Auth, Functions, and Firestore.
4. Set the required environment variables by copying the .env.example file to .env.local and setting the values accordingly.
5. Install the Firebase CLI.
6. Deploy the Firebase Cloud Functions.
7. Run the development server.
8. Open http://localhost:3000 in your browser to see the result.
9. Explore the preview of the home page and modal in the sign-in view.

Summary

This repo provides a starter template for setting up a Next.js application with Firebase authentication. It offers various features, such as email/password sign-up/sign-in, Google sign-in, magic link sign-in, password reset, and user management in Firestore. The template also utilizes Jotai for state management. By following the provided installation guide, users can quickly set up and customize the authentication system for their Next.js projects.