setInterval 2

JavaScript: 나만의 대시보드 만들기 (1) - UI 구성과 실시간 시계 ⏱️

안녕하세요, 독자 여러분! 개발자의 삶입니다. 😊37일차 포스팅에서는 자바스크립트의 카멜레온 같은 키워드, this에 대해 알아보았습니다. 이제 자바스크립트의 필수 문법과 헷갈리기 쉬운 개념들은 모두 마스터하셨습니다.앞으로 남은 3일 동안은 지금까지 배운 모든 지식을 총동원하여 종합 실습 프로젝트를 진행합니다. 우리가 만들 결과물은 브라우저의 새 탭을 열 때마다 나를 반겨주는 나만의 대시보드(크롬의 '모멘텀' 확장 프로그램 스타일)입니다. 오늘은 그 첫 번째 시간으로, 전체적인 화면 뼈대를 잡고 실시간 시계와 인사말 기능을 구현해 보겠습니다.1. 도입우리가 만들 대시보드는 단순히 예쁜 화면이 아닙니다. 24일차에 배운 LocalStorage로 내 이름을 기억하게 하고, 28일차와 29일차에 배운 set..

IT/Javascript 2026.05.02

JavaScript: 1초마다 움직이는 디지털 시계 만들기 (setInterval, Date) 기초 ⏰

안녕하세요, 독자 여러분! 개발자의 삶입니다. 😊27일차 포스팅에서는 이벤트 위임을 통해 효율적인 투두 리스트를 만드는 법을 배웠습니다. 투두 리스트는 사용자가 클릭해야만 화면이 바뀌는 수동적인 프로그램이었습니다.하지만 웹 사이트는 사용자가 가만히 있어도 스스로 움직여야 할 때가 있습니다. 대표적인 예가 바로 시계입니다. 오늘은 자바스크립트의 시간 관련 기능을 사용하여, 1초마다 스스로 째깍째깍 움직이는 실시간 디지털 시계를 만들어 보겠습니다.1. 도입우리가 평소에 보는 시계는 멈춰있지 않습니다. 매 초마다 초침이 움직이고 숫자가 바뀝니다. 프로그래밍에서 이렇게 주기적으로 특정 코드를 반복 실행시켜 주는 도구가 필요합니다. 오늘은 자바스크립트의 심장 박동과도 같은 setInterval 함수와, 현재 시..

IT/Javascript 2026.02.09