지난 번 할 일 목록(To do List) 만들기에는 LocalStorage을 활용하는 방법에 대해서 글을 작성했는데요. 오늘은 간단한 사칙 연산이 포함된 계산기를 만들어볼까 합니다. 단순하고 간단해 보이지만 실제로 구현하면 신경 써야 될 부분이 더러 있습니다. 숫자 버튼을 누르면 화면에 숫자가 나오고, 연산자를 누르면 계산이 된다. 단순해 보이는 이 흐름 뒤에는 생각보다 꼼꼼한 설계가 필요했습니다. 자바스크립트 계산기의 코드를 … 더 읽기
우리가 웹 서핑을 하다 보면 아이디를 저장하거나, 장바구니에 담은 물건이 다음날에도 그대로 남아있는 것을 볼 수 있습니다. 반면, 우리가 지난번 만든 스톱워치는 페이지를 새로고침하는 순간 모든 기록이 0으로 돌아갔죠. 오늘 만들 자바스크립트 할 일 목록(To-do List)은 바로 이 차이를 해결하는 프로젝트입니다. 앞서 우리가 만든 ‘OX 퀴즈‘와 ‘스톱워치’가 브라우저의 현재 상태(State)를 보여주는 데 집중했다면, 이번 프로젝트는 … 더 읽기
안녕하세요, 느종입니다. 자바스크립트로 프로젝트를 하다 보면 누구나 한 번쯤은 시간 측정 기능을 구현하게 됩니다. 하지만 막상 자바스크립트 스톱워치를 만들어보면 예상치 못한 문제에 부딪히곤 합니다. 분명 setInterval을 10ms(0.01초)로 설정했는데, 시간이 지날수록 실제 시계와 미세하게 오차가 발생하는 현상이죠. 저 또한 처음에는 단순 카운팅 방식으로 접근했다가 시간이 뒤처지는 것을 경험했습니다. 이번 포스팅에서는 이러한 자바스크립트 스톱워치 오차 해결을 위해 … 더 읽기
자바스크립트의 기초인 DOM 조작과 Timer API를 활용해 자바스크립트 OX 퀴즈를 직접 만들어 보세요. 5초 타이머 애니메이션 구현부터 정답 판별 로직까지, 실전 코딩 실력을 키울 수 있는 상세한 가이드를 제공합니다.