우주먼지 개발 log

[세션] 중복코드를 관리하는 법 feat. 소셜로그인 본문

TIL(Today I Learned)/스파르타 내배캠

[세션] 중복코드를 관리하는 법 feat. 소셜로그인

개발자먼지 2024. 2. 20. 07:13
반응형

이런 코드를 줄여보자.

  const signInWithGoogle = () => {
    const googleProvider = new GoogleAuthProvider();

    return signInWithPopup(authService, googleProvider);
  };

  const signInWithGithub = () => {
    const githubProvider = new GithubAuthProvider();

    return signInWithPopup(authService, githubProvider);
  };

  const socialGoogleLoginhandler = async (event) => {
    event.preventDefault();
    await signInWithGoogle()
      .then((res) => {
        const credential = GoogleAuthProvider.credentialFromResult(res);
        const token = credential.accessToken;
        const userName = res.user.displayName;

        // local storage에 token, username 저장해주기
        console.log(token);
        console.log(userName);

        navigate("/");
      })
      .catch((error) => {
        console.error(error);
      });
  };

  const socialGithubLoginhandler = async (event) => {
    event.preventDefault();
    await signInWithGithub()
      .then((res) => {
        const credential = GithubAuthProvider.credentialFromResult(res);
        const token = credential.accessToken; // 로그인된 값
        const userName = res.user.displayName; // 유저이름

        // local storage에 token, username 저장해주기
        console.log(token);
        console.log(userName);

        navigate("/");
      })
      .catch((error) => {
        console.error(error);
      });
  };

 

- TOBE 코드 참고

https://github.com/JaeSang1998/sparta-lecture 

 

GitHub - JaeSang1998/sparta-lecture

Contribute to JaeSang1998/sparta-lecture development by creating an account on GitHub.

github.com

 

 

내배캠 과정 추가 세션 중 가장유용했던

재상튜터님의
쟝님 코드 줄이기 ^.^

 

빠른시일내에 복습할 것 !!

반응형