** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! 지도에 marker를 사용할 때 필수 기능 중 하나가 바로 "클러스터링"입니다. 클러스터링이란 아래와 같이 zoom의 정도에 따라 마커의 수를 조정하는 것입니다. Mapbox 지도 라이브러리에서는 SuperCluster를 사용하여 클러스터링을 구현할 수 있습니다. 클러스터링 적용 중에 getClusters() 메소드의 return 값이 계속해서 [], empty array 가 출력되어서 애를 먹었었는데 그 해결과정을 공유하려 합니다. Q1. cluster 객체가 아직 초기화되지 않아서 [] 가 return 되는 것일까? const index = new Supercluster({ radius: 4..

** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! 안녕하세요! 코딩하다보면 그럴 때 있지 않나요 ~ 한 줄로 코드를 끝내는 능력자이고 싶다! ㅋㅋㅋ(하지만 현실은... 벌써 몇 백줄 넘어가는 중... 🥲) 하지만 조금씩 스킬을 늘려나가다 보면 그런 날도 오겠죠?! 서론은 여기까지하고 이번에는 한 줄로 Array 초기화 하는 방법을 알아보려 합니다. 보통 배열 초기화는 아래와 같은 코드로 수행합니다. var data = []; var length = 5; // user defined length for(var i = 0; i < length; i++) { data.push(createSomeObject()); } 이런 코드를 한 줄로 끝낼 수는 ..

** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! intelliJ 너무 편하지 않나요?! (ultimate 더 좋은건 안 비밀 😆) 알면 알수록 너무 감사한 툴이에요 ㅎㅎ 구글링 하다보면 이렇게도 사용할 수 있구나 하는데요, 그 중에서도 단축키 설정하는 방법을 알아보려고 합니다 🤗 Mac > intelliJ 1. 상단의 메뉴 탭 > IntelliJ IDEA > Preferences 클릭 2. Keymap 클릭 3. 검색창에 close 검색(전체 창 닫기 검색하기 위해) (현재 저는 단축키를 등록한 상태라 ctrl + cmd + W 가 출력되지만, 등록하지 않았다면 비어있을거에요!) Close All Tabs 을 오른쪽 클릭해서 Add Keybo..

** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! 효율적인 이벤트 핸들링을 하려면 어떻게 해야할까요? 각 Dom element 마다 이벤트를 거는 것이 아니라 상위의 dom element 에 이벤트를 걸고, 이벤트가 발생한 target 을 찾아 이벤트를 핸들링하는 것입니다. 이러한 방법을 이벤트 위임(Event Delegation)이라고 합니다. 코드로 살펴봅시다! STEP 01 _ Event Delegation 예제코드 "테이블 내의 td 클릭 시 하이라이트 효과"를 주어야 하는 경우로 가정해봅니다. 1) event.target 사용 $('.table').on('click', (e) => { let target = event.target; /..

** 초보 개발자로 글에 수정해야 할 부분이 있을 수 있습니다. 정정해야 할 부분은 댓글로 소통 부탁드립니다! 정말 코딩의 세계는 무궁무진한 것 같습니다. provider는 당연히 module에서만 import 하는 것이라고 생각했는데 component 별로 import가 가능하더군요! (lazy loading의 진수를 보여주는! 👍🏻) 구글링 하다가 좋은 영문글을 발견하여 번역해보려 합니다! STEP 01 _ 준비하기 먼저, 각 provider를 비교하기 위한 예제 코드(5개 파일)를 이해 해봅시다. SimpleService ChildComponent ParentComponent AppComponent AppModule 1. SimpleService class SimpleService { value: ..