목록분류 전체보기 (147)
게으른개발너D
IT계열 책 중에서 그나마 읽을만함ㅎㅎㅎㅎ 겨우 반틈 읽음ㅠㅠ 솔직히 요런 책들은 약간 전공서적 읽는 느낌이다 예제가 있는 경우도 있고 전공서는 시험기간에만 보고ㅋㅋㅋ 시험기간은 잠이 오고.. ㅠㅠ 아무래도 IT 용어가 쓰이다 보니 읽다보면 잠이 솔솔 완독까지 홧팅!!
지금까지 만들었던 Momentum App을 CSS로 꾸몄다. 중앙엔 시간과 이름을, 왼쪽 위엔 날씨정보를, 오른쪽 위엔 to do list를 작성할 수 있게 만들었고. 아래쪽엔 명언이 나오게 했고 마우스 hover 하면 아래에 author가 나오게 만들었다. 페이지 새로고침을 하면 배경화면과 아래의 명언이 새로운 것으로 교체된다. 이름 입력 후 로그인을 하고 to do list를 작성하면 다음과 같이 나타난다. 삭제버튼은 css로 checkbox처럼 만들었고, 그걸 클릭하면 체크 처리된 후 사라진다. JS 코드도 몇몇개는 바꾸었는데 날씨 API 사용하는 부분에서 특정 날씨가 나오면 그 날씨를 글자로 보여주는게 아니라 className으로 박아서 css로 해당 날씨에 대한 그림을 보여주도록 변경했다..
Geolocation 이제 내 Momentum App에 현재 날씨를 추가해주고싶다. 날씨를 추가하기 위해선 현재 사용자의 위치 정보가 필요하다. 그건 navigator.geolocation로 알 수 있다. navigator.geolocation.getCurrentPosition(함수1, 함수2); getCurrentPosition function을 호출하면 되는데, 첫번째 파라미터엔 함수 호출이 성공했을 때, 두번째 파람엔 함수 호출에 실패했을 때 보여줄 이벤트를 집어넣으면 된다. function onGeoSuccess(position) { console.log(position); } function onGeoError() { alert("Can't find you. No weather for you."..
Adding to dos const toDoForm = document.querySelector("#todo-form"); const toDoInput = toDoForm.querySelector("input"); const toDoList = document.querySelector("#todo-list"); /** * 작성한 내용을 li 태그에 담아서 화면에 출력한다. * @param {*} newTodo */ function paintToDo(newTodo) { const li = document.createElement("li"); const span = document.createElement("span"); li.appendChild(span); span.innerText = newTodo; ..
Quotes 명언을 랜덤으로 보여주기위해 일단 명언 11가지를 Array와 Object로 구현했다. const quotes = [ { quote: "Be yourself; everyone else is already taken.", author: "Oscar Wilde" }, { quote: "A room without books is like a body without a soul.", author: "Marcus Tullius Cicero" }, { quote: "Without music, life would be a mistake.", author: "Friedrich Nietzsche" }, { quote: "You know you're in love when you can't fall aslee..
Intervals and Timeouts 1. interval 시간에따라 무언가 표현하려할 때 interval과 timeout을 사용할 수 있다. interval은 특정한 시간마다 특정한 이벤트를 실행시킬 수 있는 것이다. 예를 들어 2초마다 주식 시장을 확인하던가 1초마다 코인 업다운을 확인하던가 하는 것들이다. function sayHello() { console.log("hello"); } setInterval(sayHello, 5000); setInterval(실행시킬 이벤트, 반복할 시간) 위의 코드는 5초마다 콘솔창에 hello를 찍어낸다. 2. timeout timeout은 지정한 시간이 지난 후 어떠한 이벤트를 실행시킬 수 있는 것이다. function sayHello() { con..
Form Submission form 안에 input text가 하나 존재하고 input submit 또는 button이 있다면 button을 클릭했을 때 submit이 되어버린다. 그리고 화면은 리로딩이 되어 버리고 input에 적었던 글자는 사라진다. 이걸 막기 위해 preventDefault를 한다. 아래에서 계속... Event 1. PreventDefault loginForm.addEventListener("submit", onLoginSubmit); eventListener가 submit 이벤트를 리슨하면 onLoginSubmit 함수를 호출한다. 함수를 호출할 때 JavaScript는 기본적으로 어떠한 정보를 우리에게 넘겨주는데 우리가 파라미터를 적으면 그 첫번째 파라미터에 그 정보를 담..
Git CLI 버전 삭제 - git reset 버전을 삭제하는 방법을 알아보자. 현재 상황은 이렇다. 여기서 Message 3를 지우고 Message 2로 돌아가고 싶다면 reset을 하면 된다. Message 2의 버전을 리셋한다는 것은 해당 버전을 삭제하겠다는 뜻이 아니라 해당 버전이 되겠다라는 의미이다. 헷갈리면 안됨! 일단 아이디를 복사한다. git reset --hard 아이디 입력 git log 를 입력하여 확인해 본다. Message 2 버전에 HEAD가 master를 가리킨다. Git CLI 버전 되돌리기 - git revert 이번엔 버전을 삭제하지 않으면서 되돌리는 방법을 알아보자. 현재 상태는 이렇다. 이번엔 reset과 다르게 Message 2 상태로 되돌아가고 싶다면, Messag..