본문 바로가기

개발일지

(104)
Object.prototype 상속과 공유 20180130 날짜 : 2018. 01. 30.(화) Object.prototype 상속과 공유 들어가기에 앞서 이 포스트는 하단에 있는 링크의 글들을 읽고 정리한 글 입니다. 제 실력이 부족하여 도움이 못 될 경우에는 아래의 링크를 참고해 주시기 바랍니다. 본문 새로나오는 용어 object cloning : 함수 생성시 발생하는 동작, prototype Object를 생성 prototype Object : object cloning의 결과로 나온 객체 __proto__ : 상위의 부모 객체를 가리키는 property prototype : prototype Object를 가리키는 property constructor : prototype Object가 가지는 property 개념 객체 생성 방법으로 리..
HTML, CSS 기존코드 개선하기 2 - IR 적용 20180125 날짜 : 2018. 01. 22.(월) HTML, CSS 기존코드 개선하기 2 부제 : IR 적용하기 적용전 코드구조 적용후 코드구조 테스트 이미지 방법1. 글자위에 이미지 덧 씌우기 첫번째 span에 absolute를 적용하여 글자를 숨겨버림 div { position: relative; } span:nth-of-type(1) { position: absolute; width: 100px; height: 100px; background: url('./이미지.jpg') no-repeat; } span:nth-of-type(2) { -- 이미지가 작은 경우 글자를 중앙 정렬을 하여 숨김 --> line-height: 100px; text-align: center; } 방법2. oveflow..
HTML, CSS 기존코드 개선하기 01 20180122 날짜 : 2018. 01. 22.(월) HTML, CSS 기존코드 개선하기 1 부제 : HTML논리구조, pseudo-element 개선하기 HTML 논리적 구조 잡기 기존의 코드 (디자인 중심적으로 생각을 하여 가로/세로를 나눔) 웹 관련 용어 웹 표준 이란? W3 단체에서 규정한 웹기술 사양에 대한 규칙을 말하며 표준 규격은 어리마넝라ㅣ먼ㅇ라ㅣㅓㅁㄴ아ㅣ러마니어림ㄴㅇ라ㅣㅓㅁ나ㅣ어ㅏㅣㅁ넝라ㅣㅓㅁㄴ아ㅣ러ㅣㅏㅇ너라ㅣㅓㅁ나일 새로 만든 코드 웹 관련 용어 웹표준이란? W3C 단체에서 규정한 웹 기술 사양에 대한 규칙을 말하며 표준 규격은... pseudo-element 활용하기 글의 이미지 삽입하기기존코드 이미지 글자 새로만든 코드 글자 div::before { content: ""; back..
HTML, CSS 학습방법 20180121 날짜 : 2018. 01. 21.(일) HTML, CSS 학습 방법 부제 : HTML+CSS 학습을 위한 습작을 하고서 느낀점 습작 결과물 결론 사용해보지 않은 TAG를 연습하고. 다른 페이지 찾아보고 따라 만드는 훈련이 필요. 본문 시간이 부족하다고 생각할 수록 익숙한 방법을 사용한다. 최초 설계시 한꺼번에 모든것을 다 그리지 못 하겠다. 한번에 연속으로 작업을 할 수 있는것이 3시간 이다. 이번 작업을 수행하는데 9시간이 소요 되었다. 앞으로 javascript를 학습하는 것도 중요하지만 지금 기회가 있을때 더 의식적으로 연습하는 것을 훈련할 필요가 있다고 생각. 반응형과 적응형 웹페이지까지 만드는 것을 연습하기. 한개의 웹페이지 만드는 연습과 별개로 작은 부분을 여러번 연습하는 것이..
내가 생각하는 모던자바스크립트란? (ModernJavascript) 20181011 날짜 : 2018. 01. 11.(목) 내가 생각하는 모던자바스크립트란? (ModernJavascript) 본문 생각하게 된 계기 자바스크립트가 예전과 다른 라이브러리를 사용하는 것을 알겠다. 그런데 그것 때문에 모던 자바스크립트라고 불리는 걸까? 혹시 HTML코드에 이벤트 호출이 아닌 Event 할당 방식 때문인가? 알게 된 것. 블로그에서 말하고 있던 것들. 시대별 자바스크립에서 요구하는 기술의 변화 == 현대적 javascript 번들링(bundler), 트랜스파일링(transpiling), 스크립트(script) Event Trigger를 만드는 이유. (추측) 더욱 수려한(복잡한) 이벤트를 만들기 위함. 예를 들어 이벤트가 없던 곳에 연쇄적으로 이벤트를 할당하는 것.... (이건..
git unstage(언스테이징) 하기 20180110 날짜 : 2018. 01. 10.(수) git unstage(언스테이징) 하기 본문 생각하게 된 계기 git commit시에 기능단위로 commit을 하기 위함. stage 된 것을 되돌리는 방법이 필요 하다. 알게 된 것. ##방법1. unstage(언스테이징) 하기 git reset HEAD ##방법2. stage(스테이징) 무시하고 commit 하기 git commit --only ##더 많은방법은 git-tip kor에서 참고하시기 바랍니다. 참고사이트
DOM조작 jQuery? javascript! 20180109 날짜 : 2018. 01. 09.(화) DOM조작 jQuery? javascript! 생각하게 된 계기 javascript 바닐라 코드로 DOM조작을 해보고 싶다. jQuery에서 많이 사용하는 것을 기준으로 조사해 보자. 본문 항상 IE 시리즈가 문제 이다.... 결국은 jQuery를 사용해야 하는가? select, DOM검색 jQuery : $('DOM') javascript : docment.querySelector('DOM') event, 이벤트할당 jQuery : $('DOM').bind('이벤트명', function(){ 이벤트 동작 }) javascript : docment.querySelector('DOM').addEventListener(event, function, us..
자바스크립트 GC(Garbage Collectors)를 언제 생각해야 할까? 20180108 날짜 : 2018. 01. 08.(월) 자바스크립트 GC(Garbage Collectors)를 언제 생각해야 할까? 생각하게 된 계기 코드를 작성하다가 문득 면접에서 GC를 질문했던 것이 기억을 스쳐 지나갔다. 그 당시에 몰랐던 부분과, javascript를 하면서 이 지식을 언제 사용할 수 있는지 알고 싶었다. 본문 넌 아직 준비가 되지 않았다. java를 통해서 GC 개념 익히기. GC의 특징 - 객체에 할당된 메모리를 명시적으로 해체할 수 없다. - GC가 어떠한 순서로 정리하는 지 알수 없다. - GC가 언제 수해되는지 알 수 없다. - JVM에게 GC실행을 요청만 할 수 있다. 그리고 GC를 수행하기 위한 (메모리를 회수) 여러 동작들이 있는데 ... 생략한다. 그 이유는 아래에..