clock project

javascript30

위코드 시작 전 일주일동안 이런저런 자바스크립트 프로젝트를 진행해보려고 한다.

javascript30 사이트는 30일동안 30가지의 프로젝트를 할 수 있도록 아이디어를 제공한다.

로그인을 하면, 강의 페이지로 이동한다.

이 깃허브를 방문하면, 강의의 베이스가 되는 코드를 볼 수 있다.

무엇을 했나?

오늘은 시계를 구현하는 프로젝트를 해봤다.

나는 js를 계속 해보기 위해 프로젝트를 하는 것이기 때문에
베이스가 되는 css코드는 webbos의 코드를 참고했다.

익힌 js 메소드

1. document.querySelector(selectors);
   : querySelector를 통해 제공한 선택자와 일치하는 HTML 문서 내 첫 번째 element를 반환한다.

2. Date.prototype.getMinutes()
   : Date 인스턴스의 분(minute)을 현지 시간 기준으로 반환한다.
   같은 맥락으로 getSeconds와 getHours도 사용할 수 있다.
   

3. setInterval(function, 1000);
   : 일정시간마다 함수를 실행한다.
   내가 만든 시계는 1초마다 재실행되어야하기 때문에 1000이라는 딜레이를 주었다. (1000은 1초이다.)
   
   

오늘 만든 시계 구현 코드는 내 깃허브에 올려두었다.