momentum 무작위로 명언,배경화면 출력하기
뭔가를 무작위로 출력하기 위해 무작위로 돌아갈 array가 필요하고. array에 random을 이용해서 무작위 숫자를 줄수있다. 일단 무작위로 돌릴 후보들을 quotes array로 만들어서 저장했다. 그리고 html문서에 있는 div id quote를 찾아서 첫번째 span과 두번째 span을 각각 quote와 author로 지정했다. 명언이 10개라면 0~9까지 숫자를 무작위로 선택하면 된다. Math.random*quotes.length를 통해 0~9.999....까지 얻을 수 있다. 하지만 우리는 9.999같은 소수점자리가 필요없다. 아니 필요없는게 아니라 있어선 안된다. 반올림하거나 올림하거나 내림하거나. 세가지 방법으로 소수점을 없엘수 있다. 하지만 올림이나 반올림같은경우, 만약 9.55같은..
momentum 시계만들기
new Date()를 사용하면 지금 이순간의 날짜,시간을 알수있다. 우리는 날짜, 요일,시간 중 hours, minutes, seconds가 필요하다. 그냥 함수를 한번 실행하면 실행하는 그 순간의 시간을 출력할 뿐이다. 이럴때는 setInterval()을 이용해서 원하는 함수를 원하는 시간간격으로 계속 실행할 수 있다. getClock이라는 함수를 시작하자마자 1번 실행하고 그 뒤로 1초간격으로 계속 실행한다. 이를 통해 우리는 실시간으로 1초마다 현재시간을 출력하는 시계를 가질 수 있다. padStart는 string에만 적용되는 함수인데, padStart(2,"0") 의 뜻은 string이 두자리수보다 모자라면 앞쪽으로 padding을 주고 string "0"을 채워넣는다는 뜻이다. 이렇게하면 13..
일단 type="text"인 input이 필요하고 로그인 버튼이 필요하다. 이름을 넣고 버튼을 누르거나 엔터를 쳤을때 submit이 되어야 하니까 form태그 안에 넣어주자. form 태그를 사용하면 input에서 유효성검사를 사용할 수 있다.(required나 maxlength) 그리고 로그인 했을때 welcome ${username}이 필요하니까 그 공간이 들어갈 h1태그를 만들자. login 처음에 유저가 접속하면 로컬스토리지도 비어있고 form 과 h1이 둘다 hidden 클래스로 가려져있다. css -> .hidden{display:none;} 아무것도 없는상태에서 자바스크립트가 실행된다. const loginform = document.querySelector("#login-form"); co..
css modifier, visibility
1. modifier modifier는 수식어 라는 뜻이다. 구글에 검색해보니 CSS 개발 방법론 중에 하나로 BEM방법론이 뜬다. BEM이란 Block, Element, Modifier의 약자로서 클래스의 이름을 짓는데 구조적인 방법을 제시한다. 구글에서 검색해보니 노마트코더의 클론코딩 강의 내내 BEM방법론으로 CSS를 사용해왔더라. https://webclub.tistory.com/263 BEM(Block Element Modifier) 방법론 BEM 방법론 대개 우리는 우리가 작성하는 코드가 읽기 쉬웠으면 합니다. 그렇게 되면 더 빨리 그리고 더 효율적으로 일을 하는데 도움이 되고, 다른 개발자가 합류한다 하더라도 명확성과 일관성 webclub.tistory.com 자세한 내용은 위 블로그를 참고..