FireBase version 9 configuration

[justbazz4]

Below is my setup in firebase.js for a register and signIn page, my app is rendering a WEBPACK error :

import { initializeApp } from 'firebase/app'
import firebase from './firebase';
import "firebase/firestore";

const firebaseConfig = {
apiKey: "REDACTED",
authDomain: "REDACTED.firebaseapp.com",
projectId: "REDACTED",
storageBucket: "REDACTED.appspot.com",
messagingSenderId: "REDACTED",
appId: "REDACTED"
};

const firebaseApp = firebase.initializeApp(firebaseConfig);
const db = firebaseApp.firestore();
const auth = firebase.auth();

export { auth, initializeApp };
export default db;

[justbazz4]

Below is my Signup page . What am i doing wrong on this code . This is my first time using firebase .

import React, { useRef } from 'react';
import { auth } from "../firebase";
import './SignUpScreen.css';

function SignUpScreen() {
const emailRef = useRef(null);
const passwordRef = useRef(null);

const register =(e) => {
    e.preventDefault();

    auth.createUserWithEmailAndPassword(
        emailRef.current.value,
        passwordRef.current.value
    ).then((authUser)=>{
          console.log(authUser)
    }).catch((error)=>{
       alert(error.message);
    });
};

const signIn = (e) => {
    e.preventDefault();
}

return (

Sign In

Sign In

        <h4>
            <span className='signupScreen__gray'>New to Netflix? </span>
             <span className='signupScreen__link' onClick={register}>Sign Up now.</span>
         </h4>
    </form>

) }

export default SignUpScreen

[justbazz4]

This is my code below

`import React, { useRef } from 'react';
import { auth } from "../firebase";
import './SignUpScreen.css';

function SignUpScreen() {
const emailRef = useRef(null);
const passwordRef = useRef(null);

const register =(e) => {
    e.preventDefault();

    auth.createUserWithEmailAndPassword(
        emailRef.current.value,
        passwordRef.current.value
    ).then((authUser)=>{
          console.log(authUser)
    }).catch((error)=>{
       alert(error.message);
    });
};

const signIn = (e) => {
    e.preventDefault();
}

return (

Sign In

Sign In

        <h4>
            <span className='signupScreen__gray'>New to Netflix? </span>
             <span className='signupScreen__link' onClick={register}>Sign Up now.</span>
         </h4>
    </form>

) }

export default SignUpScreen`

[lahirumaramba]

Hi, this is the repo for Firebase Admin Node.js SDK. It looks like you are using the Firebase JS client SDK
Please ask JS SDK related questions firebase/firebase-js-sdk or use Stack Overflow for usage questions.

Also, please don't share any sensitive project credentials (APIKey, App ID etc.) on public posts. I have redacted that information from your original post.