Breaking News: Grepper is joining You.com. Read the official announcement!

firebase signup with react

Shirshak Kandel answered on March 8, 2023 Popularity 9/10 Helpfulness 3/10

answer firebase signup with react

related login and signup with firebase and reactjs

firebase signup with react

Comment

import { db } from "../firebase.config";
import { createUserWithEmailAndPassword, getAuth, updateProfile } from "firebase/auth";
import { setDoc, doc, serverTimestamp } from "firebase/firestore";

const onSubmit = async (e) => {
      e.preventDefault();
      try {
         const auth = getAuth();
         // console.log(auth);

         const userCredential = await createUserWithEmailAndPassword(auth, email, password);
         //  console.log({ userCredential });
         const user = userCredential.user;

         updateProfile(auth.currentUser, {
            displayName: name,
         });

         const formDataCopy = { ...formData };
         delete formDataCopy.password;
         formDataCopy.timestamp = serverTimestamp();
         // console.log(formDataCopy)
         await setDoc(doc(db, "users", user.uid), formDataCopy);

        navigate("/");
        
      } catch (error) {
         // console.log(`error message`, error);
         toast.error("Somethings went wrong with registration");
      }
   };

Popularity 9/10 Helpfulness 3/10 Language javascript

Source: Grepper

Tags: firebase javascript

Link to this answer
Share Copy Link

Contributed on Mar 13 2023

Shirshak Kandel

0 Answers Avg Quality 2/10

Closely Related Answers

login and signup with firebase and reactjs

Comment

import React, {useState} from 'react';
import { NavLink, useNavigate } from 'react-router-dom';
import {  createUserWithEmailAndPassword  } from 'firebase/auth';
import { auth } from '../firebase';
 
const Signup = () => {
    const navigate = useNavigate();
 
    const [email, setEmail] = useState('')
    const [password, setPassword] = useState('');
 
    const onSubmit = async (e) => {
      e.preventDefault()
     
      await createUserWithEmailAndPassword(auth, email, password)
        .then((userCredential) => {
            // Signed in
            const user = userCredential.user;
            console.log(user);
            navigate("/login")
            // ...
        })
        .catch((error) => {
            const errorCode = error.code;
            const errorMessage = error.message;
            console.log(errorCode, errorMessage);
            // ..
        });
 
   
    }
 
  return (
    <main >        
        <section>
            <div>
                <div>                  
                    <h1> FocusApp </h1>                                                                            
                    <form>                                                                                            
                        <div>
                            <label htmlFor="email-address">
                                Email address
                            </label>
                            <input
                                type="email"
                                label="Email address"
                                value={email}
                                onChange={(e) => setEmail(e.target.value)}  
                                required                                    
                                placeholder="Email address"                                
                            />
                        </div>

                        <div>
                            <label htmlFor="password">
                                Password
                            </label>
                            <input
                                type="password"
                                label="Create password"
                                value={password}
                                onChange={(e) => setPassword(e.target.value)} 
                                required                                 
                                placeholder="Password"              
                            />
                        </div>                                             
                        
                        <button
                            type="submit" 
                            onClick={onSubmit}                        
                        >  
                            Sign up                                
                        </button>
                                                                     
                    </form>
                   
                    <p>
                        Already have an account?{' '}
                        <NavLink to="/login" >
                            Sign in
                        </NavLink>
                    </p>                   
                </div>
            </div>
        </section>
    </main>
  )
}
 
export default Signup

Popularity 9/10 Helpfulness 3/10 Language javascript

Source: www.freecodecamp.org

Tags: firebase firebas

Link to this answer
Share Copy Link

Contributed on Mar 08 2023

Clumsy Chicken

0 Answers Avg Quality 2/10

firebase signup with react

Contents

More Related Answers

firebase signup with react

Closely Related Answers

login and signup with firebase and reactjs

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.