Please help me to do this

Hello everyone, I have this problem, when I fill out the form and click on the login button, it does not go to the homepage, it just says http://localhost:3000/homepage./

**App.js**
import React, { useState } from "react";
import Homepage from './Homepage';
import Authentication from "./authentication/Authentication";

function App() {
  const [user, setUser] = useState(null);

  return (
    <div className="app">
      {user ? <Homepage /> : <Authentication />}
    </div>
  );
}

export default App;

**Login.js**
import React, { useState } from "react";
import "./Authentication.css";
import { useNavigate } from "react-router-dom";
import firebase from "../firebase";
function Login() {
    const navigate = useNavigate();

    const [email, setEmail] = useState('');
    const [password, setPassword] = useState('');

    const submit = async (e) => {
        e.preventDefault();
        try {
            const user = await firebase.auth().signInWithEmailAndPassword(email, password);
            if (user) {
                alert("Login Successfully");
                navigate("/homepage");
            }
        } catch (error) {
            alert(error);
        }
    }
    return (
        <div>
            <form action="">
                <h2>Login</h2>
                <input
                    autoFocus
                    type="email"
                    name="email"
                    id="emailID"
                    placeholder="E-mail"
                    required
                    value={email}
                    onChange={(e) => setEmail(e.target.value)}
                />
                <input
                    type="password"
                    name="password"
                    id="passwordID"
                    placeholder="Password"
                    required
                    value={password}
                    onChange={(e) => setPassword(e.target.value)}
                />
                <input onClick={submit} type="submit" value="Login" />
            </form>
        </div>
    );
}

export default Login;

**Signup.js**
import React, { useState } from "react";
import "./Authentication.css";
import firebase from "../firebase";

function Signup() {
    const [name, setName] = useState("");
    const [email, setEmail] = useState("");
    const [password, setPassword] = useState("");
    const submit = async (e) => {
        e.preventDefault();
        try {
            const user = await firebase.auth().createUserWithEmailAndPassword(email, password);
            if (user) {
                alert("Account created successfully");
            }
        } catch (error) {
            alert(error)
        }
    };
    return (
        <div>
            <form action="">
                <h2>Signup</h2>
                <input
                    autoFocus
                    type="text"
                    value={name}
                    name="name"
                    id="nameID"
                    placeholder="Name"
                    required
                    onChange={(e) => setName(e.target.value)}
                />
                <input
                    type="email"
                    value={email}
                    name="email"
                    id="emailID"
                    placeholder="E-mail"
                    required
                    onChange={(e) => setEmail(e.target.value)}
                />
                <input
                    type="password"
                    value={password}
                    name="password"
                    id="passwordID"
                    placeholder="Password"
                    required
                    onChange={(e) => setPassword(e.target.value)}
                />
                <input onClick={submit} type="submit" value="Signup" />
            </form>
        </div>
    );
}

export default Signup;

**Firebase.js**
// import { initializeApp } from "firebase/app";
import firebase from "firebase/compat/app";
import "firebase/compat/auth";
import "firebase/compat/database";

const firebaseConfig = {
    apiKey: "AIzaSyBaqOv1N1HGRI1s9pxejGKRyWVVLd8QKZ8",
    authDomain: "instagram-clone-71559.firebaseapp.com",
    projectId: "instagram-clone-71559",
    storageBucket: "instagram-clone-71559.appspot.com",
    messagingSenderId: "790490588883",
    appId: "1:790490588883:web:064e21f838f5bb14e21626"
};


const app = firebase.initializeApp(firebaseConfig);
export default app

This page should have been accessed

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.