TIL_2020년 10월 09일 (금)

목차

• 1.오늘 한 일
• 2.오늘 배운 것과 깨달은 것
• 3.오늘 진행한 작업물 (사진)

1.오늘 한 일

1. NomadCoder Vanilla JS
   • 5일차, 3.0강 ~ 3.2강
   • 오늘 숙제한 코드 (date를 사용하여 d-day counter)

   
    const XMASDAY = new Date("2020-12-24:00:00:00+0900");
       
    function getTargetDay() {
      const xmas = document.getElementById("xmasDay");
      const year = XMASDAY.getFullYear();
      const month = XMASDAY.getMonth() + 1;
      const date = XMASDAY.getDate() + 1;
      const hours = XMASDAY.getHours();
      const minutes = XMASDAY.getMinutes();
      const seconds = XMASDAY.getSeconds();
       
      // 자리수 맞추는 것 재밌다 ! 엑셀을 할 때도 자리수 맞추는 것 매우 중요하게 여겼기 때문에 ~
      xmas.innerText = `${year}년 ${month}월 ${date}일 ${
        hours < 10 ? `0${hours}` : hours
      }시 ${minutes < 10 ? `0${minutes}` : minutes}분 ${
        seconds < 10 ? `0${seconds}` : seconds
      }초`;
    }
       
    function getCurrentTime() {
      const nowTime = new Date();
      const currentTime = document.getElementById("currentTime");
      const year = nowTime.getFullYear();
      const month = nowTime.getMonth() + 1;
      const date = nowTime.getDate();
      const hours = nowTime.getHours();
      const minutes = nowTime.getMinutes();
      const seconds = nowTime.getSeconds();
      currentTime.innerText = `${year}년 ${month}월 ${date}일 ${
        hours < 10 ? `0${hours}` : hours
      }시 ${minutes < 10 ? `0${minutes}` : minutes}분 ${
        seconds < 10 ? `0${seconds}` : seconds
      }초`;
    }
       
    function getGapTime(){
      let Targetday = new Date("2020-12-24:00:00:00+0900").getTime();
        let now = new Date().getTime();
        let gap = Targetday - now;   
        console.log(gap)
        let date = Math.floor(gap / (1000 * 60 * 60 * 24));
        let hours = Math.floor((gap % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        let minutes = Math.floor((gap % (1000 * 60 * 60)) / (1000 * 60));
        let seconds = Math.floor((gap % (1000 * 60)) / 1000);  
       
        document.getElementById("gapTime").innerHTML = `${date} day ${
          hours < 10 ? `0${hours}` : hours
        } hour ${minutes < 10 ? `0${minutes}` : minutes} min ${
          seconds < 10 ? `0${seconds}` : seconds
        } sec`;   
      }    
       
    // 시차때문에 이걸 쓰라고 했는데 사용하지않았다. 어떻게 썼어야 했는가...?
    const NINE_HOURS_MILLISECONDS = 32400000;   
       
    function init() {
      getTargetDay();
      getCurrentTime();
      setInterval(getCurrentTime, 1000);
      setInterval(getGapTime, 1000);
    }
       
    init();
   
   

2. 위코드 사전스터디
   • HTTPS 관련 부분 퀴즈
   • 각자 공부한 내용 서로 공유

2.오늘 배운 것과 깨달은 것

• 모기때문에 2시간밖에 못잔 하루. 너무 너무 피곤했다. 그래도 조금 자고 일어나서 오늘 해야할 부분만 완료 ㅜㅜ 더 많이 해야하는데 그렇지 못해서 아쉽다. 다들 엄청 잘 하고있는 것같던데… ㅜㅜ 그래도 늘 똑같이 다짐하는 것이지만 게을러지지말고 매일매일 하자!

3.지금까지 작업물 (사진)