본문 바로가기
📖 나의 개발일지 (WIL&TIL)

[TIL] 오늘의 개발일지

by 따따시 2023. 3. 6.

 

 

오늘 오전엔

팀원들과 다같이 코드리뷰도 하고, 그동안 정리하지 못했던 불필요한 주석처리 , 페이지 컨밴션을 정리하는 작업을 하였다

주말동안 내가 짜놓은 부분을 ts 리팩토링 했었는데 덕분에 오늘은 비교적 여유있게 자잘자잘한 작업들을 했었다

 

오늘 저녁에 튜터님이 오셔서 우리 프로젝트 코드를 쫙 한번씩 봐주셨는데

회원가입 하는 시간이 좀 느린것 같다는 유저 피드백을 받은 부분이 있었는데 회원가입을 할때 우리가 로직을 3개를 실행을 시켜줘서

(회원가입만 시키는게 아니라 유저 컬랙션을 생성해서 거기 유저 정보도 넣어주고 유저 프로필 업데이트도 해주는 로직)

그런 것 같다는 생각이 들었다

 

파베를 쓰다보니 근본적인 속도를 빠르게 해줄 수 있는 방법이 당장은 없으니

유저가 기다리는동안에 "회원가입중"이라는 상태를 보여줄 수 있도록 로딩중 상태를 띄워주려고 했는데

튜터님께서 우리가 toast를 사용하고 있었던걸 보시고 toast에도 promise를 사용할 수 있는데 한번 써보라고 말씀을 해주셨다

toast.promise 안에다가 new Promise를 통해 해당 로직들이 다 실행이 될때까지 pending상태에는 회원가입중이라는 상태를 띄워줄 수 있도록 코드를 수정하는걸 배웠다. 

toast.promise(
      new Promise(async (resolve, reject) => {
        try {
          const data = await createUserWithEmailAndPassword(
            authService,
            getValues("email"),
            getValues("pw")
          );

          await setDoc(doc(dbService, "user", data.user.uid), {
            userId: data.user.uid,
            userNickname: getValues("nickname"),
            userEmail: getValues("email"),
            userPw: getValues("pw"),
            userImg: "null",
          });

          await updateProfile(data.user, {
            displayName: getValues("nickname"),
            photoURL: "null",
          });

          setTimeout(() => {
            signOut(authService).then(() => {
              sessionStorage.clear();
              location.href = "/login";
            });
          }, 1500);

          resolve("resolve 되었습니다.");
        } catch (error: any) {
          console.log(error.message);
          if (error.message.includes("already-in-use")) {
            reject("이미 가입한 회원입니다");
            return;
          }
        }
      }),
      {
        pending: "회원가입중입니다!!!!!!!!!",
        success: "회원가입성공! 로그인해주세요",
        error: `"이미 가입한 회원입니다"`,
      },
      {
        hideProgressBar: true,
        style: {
          minWidth: "250px",
        },
      }
    );

 

항상 공식문서에서 new Promise를 예제로만 많이 보고 , promise객체를 이해할때 많이봤었지 이렇게 직접 프로젝트에 활용을 해본게 처음인 것 같은데 뭔가 짜릿햇다고 해야하나....

뭔가 한층 더 레벨업 한 기분이라 오늘은 나름 뿌듯했던 개발일지 끄읕-

댓글