기록하는 개발자

- 위 스크린샷의 왼쪽 화면에서 체크리스트의 항목을 삭제하면 오른쪽 화면의 localStorage에서도 삭제된다. - 새로고침 실행 시 내가 삭제를 원했던 항목을 아래 스크린샷처럼 오른쪽 화면 및 localStorage 에서 모두 보이지 않도록 조치를 취한다. Log in 00:00:00 const toDoForm = document.getElementById("todo-form"); const toDoList = document.getElementById("todo-list"); const toDoInput = toDoForm.querySelector("input"); let toDos=[]; const TODOS_KEY = "todos"; fu..

Checklist Load 구현 - list를 입력 받아 localStorage에 저장한다. - 새로고침 후에도 localStorage로부터 이전에 저장한 value를 load해서 list를 유지할 수 있다. - 이전 정보 load 후 추가로 list를 입력 받을 때 덮어쓰기 되지 않고 기존 list에 추가되도록 한다. Log in 00:00:00 const toDoForm = document.getElementById("todo-form"); const toDoList = document.getElementById("todo-list"); const toDoInput = toDoForm.querySelector("input"); let toDos=[]; const ..

아래와 같이 refresh 할 때마다 배경 사진이 바뀌는 기능을 추가해보자. Log in 00:00:00 const images=["img1.jpg","img2.jpg","img3.jpg"]; const chosenImage = images[Math.floor(Math.random()*images.length)]; const bgImage = document.createElement("img"); bgImage.src = `img/${chosenImage}`; document.body.appendChild(bgImage); 1. random image 저장 - 필요한 이미지를 프로젝트 폴더 내 img 폴더를 생성해 한 데 모아둔다. - string type..

10개의 명언 중 랜덤하게 하나를 골라 명언과 출처를 출력하는 js를 적용해보자. Log in 00:00:00 const quotes = [ { quote : "Laughter is timeless, Imagination has no age. And dreams are forever.", author : "Walt Disney", }, { quote : "The past can hurt, but the way I see it, you can either run from it or learn from it.", author : "Lion King", }, { quote : "You must not let anyone define your limits because ..

만들고자 하는 시계의 모양이다. 여기서 필요한 것은 기본적으로 제공되는 Date 객체의 hours, minuteds, seconds 함수는 시, 분, 초가 10보다 작은 경우 01, 02가 아닌 1, 2 와 같이 한 자리로 표시된다는 것이다. 따라서 아래 스크린샷처럼 00:00:00 형식으로 표시되도록 조치를 취해주어야하는 것이 포인트이다. Log in 00:00:00 const clock = document.querySelector("h2#clock"); function getClock(){ //매초 시분초를 갱신 const date= new Date(); const hours = String(date.getHours()).padStart(2,"0"); const..