들어가며

11월 16일 화요일이다. 이 때 손목 통증이 너무 심해져서 상당히 힘들었다. 타이핑하거나 마우스를 쓸 일은 많은데 손목이 아프니 아무것도 못한다. 팀원분과 같이 으쌰으쌰 하면서 간신히 버티던 시기다. 손목을 회복시키는 가장 좋은 방법은 쓰지 않는건데 마감이 며칠 남지 않아서 도저히 그럴 수 없었다.

로그인 상태 유지

오늘의 핵심 주제는 로그인 상태 유지다. 특히 새로고침 해도 로그인 상태가 유지되는게 핵심이다.
지금 생각해보면 단순하게 session storage 조금 참고할 걸 그랬다. 새로고침을 하면 초기화 되는게 hook인데 어떻게든 유지하려고 하니까 매번 서버에 인증 확인을 날려야되더라. 지금 보니까 비효율적이다.
session storage에 로그인 상태를 true로 저장하고 만약 token failed가 발생했을 때 session storage를 false로 갱신하면 되지 않았을까?
비동기와 상태 개념이 명확해져서 다행이었다. 안그랬으면 useEffect에서 비동기 처리한다고 결국 삽질했다.

  const handleFilter = async (text) => {
    let totalList, favoritesList;
    navigate('/');
    if (text) {
      totalList = await axios.get(`${process.env.REACT_APP_SERVER_ADDR}?title=${text}`);
    } else {
      totalList = await axios.get(`${process.env.REACT_APP_SERVER_ADDR}`);
    }
    await getAuth(loginHandler, logoutHandler);
    await axios
      .get(`${process.env.REACT_APP_SERVER_ADDR}/favorites`)
      .then((data) => {
        favoritesList = data;
        setFavorites(favoritesList.data.items);
      })
      .catch((err) => {});
    setList(totalList.data.items);
  };