2024.2.15 기록 (프로젝트 마무리 회고)

명절을 낀 기간동안 뉴스피드 프로젝트가 마무리 되었다.

 

이번 프로젝트에서 제일 큰 문제였던 건 파이어베이스였다.

기본적으로 데이터가 도착하는 시간보다 랜더링이 빨랐기 때문에 비동기 통신을 진행해야했고,

 

그 과정에서 useEffect를 이용해서 데이터를 받아오는 기능이 존재했고,

그 내부에서 데이터를 받아오는 과정이 겹쳐서 짧게는 1초 길게는 5초까지 딜레이가 걸렸다.

  useEffect(() => {
    const checkAuthState = async () => {
      const user = auth.currentUser
      setIsLoggedIn(!!user);
      if (user) {
        const userRef = doc(db, 'users', user.uid);
        const userSnap = await getDoc(userRef);

        console.log(userSnap)
        if (userSnap.exists()) {
          const userData = userSnap.data();
          setUserInfo({
            nickName: userData.userNickName || '익명',
            profileImg: userData.profileImageUrl || 'null'
          });
        } else {
          setUserInfo({ nickName: '', profileImg: '' });
        }
      } else {
        setUserInfo({ nickName: '', profileImg: '' });
      }

    };
    checkAuthState()
  }, [])

 

이 과정은,  전역상태관리를 하는 경우가 아닌 prop drilling으로 프로젝트를 진행할 때 어쩔 수 없이 사용하는 부분이었기때문에 기존의 useEffect내부에 문서를 불러오는 기능들을 많이 덜어내어 로그인 인증상태만을 확인하는 부분으로 변경해야만 했다.

 

교차검증을 통해서 받아오는 로직이 제법 길었기때문에 분할해야 했지만, 남아있는 시간이 적었기 때문에 필수 구현과제들만 해당하고 넘어가게 되었다.

 

시간을 내서, redux와 context API를 통해 관리를 해보고싶다. 모자란 부분도 채워보고싶다.