회원가입,로그인 구현2

Login.tsx 로그인 구현

로그인 구현 파베 공홈

import React, { useState } from "react";
//파베에서 제공 되는 로그인 함수
import { signInWithEmailAndPassword } from "firebase/auth";
import { firesotre, appAuth, apiKey } from "./firebase";
//페이지 전환 위해 사용
import { Link, useNavigate } from "react-router-dom";

//로그인 할시 입력 되는 값 타입
interface LoginValue {
  email: string;
  password: string;
}
const Login = (props: LoginValue) => {
  //로그인 이메일
  const [email, setEamil] = useState("");
  //로그인 비밀번호
  const [password, setPassword] = useState("");
  //로그인 후 화면 이동
  const navigate = useNavigate();


  const auth = appAuth;
  //로그인
  const handleLogin = async (e: React.FormEvent<HTMLFormElement>) => {
    e.preventDefault();

    //파베에서 사용 되는 함수
    await signInWithEmailAndPassword(auth, email, password)
      .then((userCredential) => {
        // Signed in
        const user = userCredential.user;
        console.log(user);
       
        //로그인 후 이동 되는 화면
        navigate("/");
      })
      .catch((error) => {
        const errorCode = error.code;
        const errorMessage = error.message;
        console.log(errorCode);
        console.log(errorMessage);
      });
  };
  return(...아래로);
}

return

return (
    <>
      <form onSubmit={handleLogin}>
        <input
          type="text"
          value={email}
          required
          onChange={(e) => {
            setEamil(e.target.value);
          }}
        />
        <input
          type="password"
          value={password}
          onChange={(e) => {
            setPassword(e.target.value);
          }}
        />

        <button type="submit">로그인</button>
      </form>
    </>
  );

회원가입이랑 코드와 비슷 하다