좀 더 타이트하게 공부하기 위해서 노마드코더에서 10주 스터디를 신청했다. 이것은 스터디의 1주차 회고이자 지난 3개월의 대한 회고이다. 새롭게 해가 밝고 난 프론트엔드로 직무를 정해서 3개월이 지나 4월이 되었다. 추웠던 날씨도 따뜻해지니 이제는 몸으로 시간이 흘렀음을 느낀다. 3개월의 회고를 하기 앞서 먼저 스터디에 대한 회고를 진행해보자면... 이 스터디를 신청하게된 이유는 여러가지가 있는데 먼저 조력자들을 찾고 싶었다다. 3개월 정도 독학을 하면서 나태해지는 것도 있지만 너무 쉽게 지쳤다. 오랜만에 공부를 하는 것도 있고 새로운 분야를 접하다보니 막히는 부분도 많고 그 부분을 해결해줄 사람이 없으니 참 어려웠다. 게다가 시행착오도 많았고 그 외에도 취업 정보나 정부 지원등에 신경 쓰다보니 정말 힘..

예전에 만들었는데 역시나.... 왜이리 쉽게 잊혀지는 걸까? 내 약점은 조금만 브라우저 동작에 대한 내용이 나오면 잊는다는 것이다. 브라우저에는 stroage가 있는데 입력값을 보관해준다. 해당 관련해서 코드를 짰는데 너무나 복잡하다. 일단 자주 잊는 부분을 기록해두고자한다. const nameForm = document.querySelector("#nameForm") const nameInput = document.querySelector("#nameinput") const mainBox = document.querySelector("#mainBox") const clock = document.querySelector("#clock") const today = new Date(); const hour ..

코드 챌린지를 하다가 이벤트리스너를 복습하고 있었는데 역시 하다보면 구멍이 슝슝 뚫려있는 곳이 많았다. 그 중 하나가 우클릭을 어떻게 구현하는 것인가였다. 구글링하면 금방 나올줄 알았는데 안나오고 다들 클릭 이벤트 종류에 대해서만 다뤄서 이 글을 남긴다. 역시 검색은 영어로 찾아야한다; const superEventHandler = { mouseOver: function () { hello.innerText = "The mouse is here!"; hello.style.color = colors[0]; }, mouseOut: function () { hello.innerText = "The mouse is gone!"; hello.style.color = colors[1]; }, reSized: fun..

3월은 알고리즘, 자료구조를 공부하고 문제풀이를 시작을 계획했다. 물론 타이슨의 명언처럼 나도 코딩 공부를 시작하며 그럴싸한 계획을 가지고 있었지만 역시 쳐맞아보니 계획은 변경되고 뜻처럼 안되는 부분도 많았다. 여튼 이제 시작하는데 역시나 쉽지 않았다. 입문 수준의 문제를 푸는데도 참 어려웠다. 4월에 프로그래머스 부트캠프가 있는데 프로그래머스 1~2단계 수준의 코테가 있다고 한다. 짧은 기간에 준비해서 해야하는데 첫 문제부터 그리고 입문 문제부터 멍하니 문제만 바라보게 되니 막막했다. 그래도 이전처럼 차근차근 해내가야겠다. 카드 뭉치 문제를 풀었는데 그래도 짧지만 코드를 써서 다행이라고 생각했는데 왜 틀렸는지 감을 전혀 못잡았다. 컴공과 후배가 1시간이상 생각했는데 답 안나오면 다른 사람 답보고 이해하..

맨처음에는 get, post이 도대체 정확히 뭔가를 찾다가 웹의 동작까지 넘어왔고 여러 블로그를 보다가 명쾌하지 않아 MDN 문서를 보게되었고 MDN 문서의 How the web works를 보다 한국어 번역의 몇몇 부분이 뭔가 싶어서 직접 번역해보며 의미를 깨우치기로하였다. How the web works provides a simplified view of what happens when you view a webpage in a web browser on your computer or phone. 당신의 컴퓨터와 핸드폰의 웹브라우저 속의 웹페이지를 볼 때 어떤 일이 일어나는지 간단하게 알아보겠습니다. This theory is not essential to writing web code in the..

1. HTML - bulma에 대해 새롭게 배웠다. > 부트스트랩봐 표현법이 더 직관적이어서 좋았다. Ping Pong Score Keeper 0 to 0 Use the buttons below to keep score Playing to 3 4 5 6 7 8 9 10 11 +1 Player One +2 Player Two Reset 2. JS - innerHTML, innerText, textContent의 차이를 몰랐다. > innerText의 경우 불필요한 공백은 제거하고 브라우저 상에 출력되는 값을 그대로 가져온다. 만약 html 상 입력은 되었는데 브라우저의 display:none;으로 보여지지 않는다면 결과도 보여지지 않는다. > textContent를 알기 전에 노드라는 개념을 알고 있어야하..