기록을 남기자...

1. index.html

2. app.js

* const button ~ -> class name이 "btn" 인 모든 요소들을 button에 저장

* const value ~ -> id 값이 'value' 인 요소를 value에 저장

* button.addEventListener -> 버튼들에 이벤트를 생성

* const styles = e.currentTarget.classList --> e 는 현재 이벤트가 발생하는 요소, currentTarget 이벤트가 발생한 타겟(button), classList -> 타겟(button) 들의 class list (decrease, increase, reset)

* 첫번째 if문 -> 누르는 버튼에 따른 count 를 +, - , reset 처리

* 두번째 if문 -> count 값이 0이상이면 녹색, 0이하면 빨간색, 0이면 검은색으로 지정

* value.innterHTML  ~ --> count 값을 출력

>> 아래처럼 나오려면 styles.css 파일이 필요

navigator.geolocation.getCurrentPosition(Success Callback, Error Callback);

해당 기능은 parameter 두 개를 요구한다. 첫번째는 현재 사용자의 위치를 찾았을 경우 호출할 function / 두번째는 사용자의 위치를 찾지 못했을 경우의 Error 처리를 위한 Function 호출에 대한 parameter가 필요하다.

간략하게 해당 기능이 작동하는지 정도만 테스트 해보는 코드이다. 

1. function onGeoOK() 는 사용자의 위치를 찾았을 경우, 위도와 경도를 콘솔에 로그로 출력해주는 함수이다.

* index.html

1. import "js/backgroud.js"

* background.js

1. const image -> image 파일들을 배열로 저장

2. chosenImage -> image 배열에 있는 파일을 랜덤하게 하나 추출

3. bgimage -> js ---> html 에 "img" 요소를 생성

4. bgimage.src --> img 태그의 src 값을 chosenImage 로 지정 (랜덤 지정)

5. document.body.appendChild(bgimage) --> html 의 body내에 bgimage(img) 요소를 추가

* Index.html

1. index.html 에 "js/quotes.js" import

2. <div id="quote"></div> 추가    -> 안에 <span> 태그 2개 추가

* quotes.js

1. const quote[]  명언 배열로 저장

2. const const / author --> index.html의 요소 중 id 가 'quote' 인 부분을 가져오기 

               ( span:first-child  span:last-child ) --> span 태그 중 첫번째 요소 / 마지막 요소

3. const todayQuote --> 배열 길이만큼 랜덤하게 data 추출

4. quote / author.innerText -> span 태그내에 랜덤하게 추출한 명언 Data 출력