How can I implement user profiles in React with Firebase authentication?

How can I implement user profiles in React with Firebase authentication?

You can use Firebase Authentication to manage user sign-in and then store user profile data in Firestore. Would you like a code example?

Yes, please provide a code example for creating a user profile.

First, set up Firebase in your React app. Then, after a user signs in, you can create a profile like this:

const createUserProfile = async (user) => {
  const userRef = firestore.doc(`users/${user.uid}`);
  const snapshot = await userRef.get();

  if (!snapshot.exists) {
    const { displayName, email } = user;
    try {
      await userRef.set({
        displayName,
        email,
        createdAt: new Date(),
      });
    } catch (error) {
      console.error('Error creating user profile', error);
    }
  }
};

This function checks if a user profile exists and creates one if it doesn't.

What if I want to update the user profile later?

You can create an update function like this:

const updateUserProfile = async (userId, newData) => {
  const userRef = firestore.doc(`users/${userId}`);
  await userRef.update(newData);
};

You can call this function with the user's ID and the new data you want to update.