20210608 개발 환경 세팅(Extension)

금일 진행 사항

- VS Code Extension 및 Eslint 설정 

- 토큰 만료 시간 표시 구현 

 

VS Code Extension 

프론트엔드 팀원님이 수고해주셨다. 유용한 익스텐션이 많아서 이렇게 기록으로 남긴다. 잘 사용할 수 있으면 그만큼 개발 효율이 높아질 것이라 생각된다. 



토큰 만료 시간 구현

단순한 기능일 수도 있지만, 코드 효율 측면으로 보니 생각이 많아진다. 문제 없이 작동은 하는데, 뭔가 맘에 들지 않는다. 조잡하다. 

const [expiredTime, setExpiredTime] = useState('');
  const tokenExpireTime = Number(localStorage.getItem('expiryTime'));
  const calTimeDifference = () => {
    const currentTime = new Date().getTime();
    const tokenTime = tokenExpireTime;
    const secondsGap = Math.floor(tokenTime - currentTime) / 1000;
    const hours = Math.floor(secondsGap / 3600);
    const minutes = Math.floor((secondsGap % 3600) / 60);
    const seconds = Math.floor(secondsGap % 60);
    let hoursResult = `${hours}`;
    let minutesResult = `${minutes}`;
    let secondsResult = `${seconds}`;

    if (hours < 10) {
      hoursResult = `0${hours}`;
    }

    if (minutes < 10) {
      minutesResult = `0${minutes}`;
    }

    if (seconds < 10) {
      secondsResult = `0${seconds}`;
    }

    const result = hoursResult + ':' + minutesResult + ':' + secondsResult;
    setExpiredTime(result);
  };

  setInterval(calTimeDifference, 1000);

 

오늘의 생각

갈길이 멀다. 팀에 도움이 될 수 있도록 하자.