와 시계!

🕒 와 시계 만들기! 🕒

할 거 없어서, 주변에 보이는 사물을 만들어보고 있는데요.
비교적 만들기 쉬울 거 같은 시계 만들기에 도전해봤어요 ^___^ b

사용한 것들

• Nuxt3
• TailwindCSS
• Vueuse
• Vercel

기능

• 보고 싶은 시계를 선택 할 수 있어요 🕒, 📟
• 현재 시간을 알 수 있어요 매우 유용한 기능

이슈

• 배포해보니 시계를 처음 렌더링할 때, 시간을 GMT 기준으로 가져옴
• Nuxt는 빌드 기본값이 SSG다 보니까 처음에는 시간을 서버 기준(GMT)으로 가져오는 거였음
• nuxt.config에서 ssr 옵션을 false로 변경해서 SPA로 적용하니 해결

Link

두 시계 모두 깔끔하게 디자인 나와서 만족
페이지 색깔이 주황색인 이유는 딱히 없음
아날로그 시계에서 숫자랑 눈금 배치하는 건 사인, 코사인 사용
디지털 시계에서는 7-세그먼트 패턴을 사용했다 (고딩 때 배운거 여기서 써먹죠 ^___^ b)

• Clock
• Github