얼마전에 기획자분으로부터 input을 입력할때마다 1000단위로 콤마(,)가 찍히도록 해달라는 요청을 받았습니다. 구글링을 해서 찾아보니 keyup이벤트에 listener를 걸어서 value를 제어하라는 내용이 있더군요.

d3 라이브러리의 Hierarchy 메서드는 계층구조를 만들어 주는 역할을 합니다.

계층 구조를 만들기 위해서는 루트 노드가 필요합니다. 만일 이미 데이터가 JSON 처럼 계층 구조으로 만들어져 있다면, 바로 d3.hierarchy를 사용할 수 있습니다. 만일 CSV(comma-separated values)와 같은 표 형식의 데이터로 만들어져 있다면 d3.stratify를 사용하여 계층 구조로 재정렬 할 수 있습니다.
Continue reading

quick 정렬을 구현해 봅시다.

Symbol 프로퍼티는 자바스크립트 엔진이 디폴트로 처리하는 알고리즘 유형들입니다. 개발자는 이 알고리즘에 개입해서 엔진의 동작을 수정할 수 있습니다.

일반적으로 memory leak은 말그대로 메모리 누수입니다. 참조되는 곳이 없는 객체는 해당 객체에 접근할 수 있는 방법이 없고, 사용될 일이 없기 때문에 메모리에서 삭제 됩니다.
JavaScript의 GC(Garbage Collection)가 주기적으로 돌면서 이 역할을 수행합니다. 헌데 사용하지 않는 객체임에도 불구하고 특정 변수가 이를 참조(reference)하고 있어서 메모리에서 삭제되지 않는 현상을 memory leak이라고 합니다.
Continue reading

angular로 프로젝트를 개발하던 중 큰 난관에 봉착했습니다. 그것은 프론트개발자라면 누구나 사라졌으면 하는 그것… 크로스 브라우징 이슈입니다. 분명 크롬에서는 잘 돌아가던 것들이 ie에만 가면 깨지고 에러나고…

Angular 응용 프로그램은 주로 Component와 HTML Template로 구성됩니다. 브라우저가 응용 프로그램을 렌더링하기 전에 Angular 컴파일러가 구성 요소와 템플릿을 실행 가능 JavaScript로 변환해야 합니다.

응용 프로그램이 로드 될 때, JIT (Just-In-Time) 컴파일러를 사용하여 런타임에 브라우저에서 응용 프로그램을 컴파일 할 수 있습니다. 이것은 표준 개발 방식입니다. 이것은 좋은 방식이지만 결점이 있습니다.
Continue reading

google map api에서는 사용자가 오버레이 영역을 지정할 수 있는 클래스(OverlayView)를 제공합니다. 이 기능에 관심을 가지고 찾아보게 된 계기는 지도에 뿌려지는 마커를 커스터마이징 하기 위해 이래저래 시도하던 중, google map api에서 제공하는 기본 마커에는 커스터마이징의 범위가 제한적인 것을 알게 되었기 때문입니다.
Continue reading

Web Application에 빠질 수 없는 요소가 form입니다. Angular Form요소들을 쉽게 제어할 수 있는 여러 기능들을 제공합니다. 이번에는 Angular가 제공하는 Form 기능의 중 가장 기본적인 내용들을 공유해 보려고 합니다.
Continue reading

Angular로 애플리케이션을 제작하다보면 동적으로 컴포넌트를 추가해야할 때가 있습니다. 레이어 팝업을 띄운다던지, 페이지 내에서 사용자의 인터랙션에 따라 컨텐츠를 추가할 때, 우리는 특정 element를 생성해서 DOM에 추가하여야 합니다.
Continue reading