본문 바로가기
  • 프론트엔드 개발자 세오세오 | Frontend dev Seo
Learn to Code

[TIL] 갑자기 달력이 만들고 싶어졌다 (바닐라JS)

by CEOSEO 2021. 10. 3.
728x90
반응형

 

오늘도 Pinterest에서 예쁜 UI가 없나 찾아보다가 캘린더를 봤다. 그리고 갑자기 달력이 만들고 싶어졌다! 그래서 바닐라 자바스크립트로 달력을 만들었다.

 

 

🌱 Github

 

오늘의 트리거. 핀터레스트에서 이 달력을 보고 달력이 만들고 싶어졌다!

 

 

 

 

 

Vanilla Javascript Calendar

 

 

위 핀터레스트 이미지와 비슷하게 아래와 같이 만들었다:

 

회색과 핑크의 조합은 진리이기 때문에 오늘의 날짜는 핑크색으로 표시되도록 했다.

 

 

 

날짜 위에 마우스를 올리면 핑크색으로 표시가 된다.

 

prev와 next를 클릭하면 이전 달 또는 다음 달의 캘린더를 볼 수 있다.

 

 

 

 

추가하고 싶은 사항들

- 달별 컬러 적용

- 투두리스트와 합치기

 

 

 

728x90
반응형

댓글