Front 개발을 하다보면 click,keyboard 등등의 event를 숙명적으로 사용하게 된다. 근데 이것들을 사용하다보면 이벤트가 두번 씩 실행되거나, 버블링 같은 다양한 문제를 직면하게 된다. 그리고 이벤트를 발생시키는 방법이 addEventListner, o
1. 서론 지도기반 웹 사이트를 사용하다보면 문서도 잘 구성되어 있고 사용성도 높은 Google Map API 사용한다. 그리고 지도를 사용하면 필연적으로 만나게 되는 기능이 Marker를 지도 위에 뿌리는 기능이다. 간단한 몇개의 Marker를 뿌리는 것은 서비스에
Reactive Spring 내년에 진행될 프로젝트의 일부 내용이 육상,해상,항공 데이터를 실시간으로 받아서 수집하고 해당 데이터를 표출하는 내용이 있다고 한다. 데이터를 수집할 때 만약 기존의 Spring의 방식인 블로킹 방식으로 진행할 경우 접속자 수 증가에 따
1. 리팩토링 할 때 주의 할 사항 프로젝트가 막바지를 향해갈 때 쯤 나는 리펙토링을 통해서 코드를 간결하게 만들었다.(내 생각) 그리고 어느날 부장님께서 잠시 부르시더니 세가지 케이스를 보여주시며 어떤게 제일 빠를 거 같은지 여쭤 보셧다 당연히 1, 2, 3 순
이전에는 서울지리데이터.geojson 을 google map 위에 overlay Layer 로 올리고 따릉이 대여소 위치를 표현하였다. 그리고 오늘은 따릉이를 어디서 빌려서, 어디에 반납하는지 그 흐름을 표 나타내 보려고 한다. 오늘의 작업을 위해서는 두가지 단계가
1. 서론 이번에 프로젝트를 진행하면서 부장님과 둘이서 진행했는데, 아직 연차가 낮은 나의 개발하는 모습이 안쓰러웠는지 조용히 회의실로 부르셨다. 그러곤 회의실에서 지금 진행 중인 프로젝트에 대해서 얼마나 내가 파악을 하고 있는지 하나씩 하나씩 물어보시기 시작했고 나
1. 서론 화창하던 어느날. 여느때와 다름없이 개발을 하던 중 API호출 중 조회 해 올 때 갑자기 결과 값이 두개 이상이다. 라는 error messsage를 마주하였다. 왜 그런지 원인을 파악하고 쿼리를 수정을 하여 현재는 정상적으로 동작하고 그 원인과 해결한
google map 을 띄우기 위해서는 API-key를 발급받아야 한다. api key 발급 받는거는 google map platform을 살펴보면 받을 수 있다. CSS / div 생성 <div>요소 안에 google map을 띄우는 방식이기 때문에 width
0. 사전 지식 0.1 geojson geojson은 지리 데이터를 json 형태로 encoding한 것이다. 여기엔 feature라는 json 객체들을 담고 있고, feature 객체는 지형의 경계를 coordinates 속성에 저장하고 지형에 대한 메타 데이터를
데이터 주도문서의 약자(Data-Driven Documnt)웹에서 다양한 형식의 데이터를 이용하여 시각화를 할 수 있도록 도와준다. CSS3, HTML5, SVG등 웹 표준 기능을 최대로 활용하여 독점적인 기술은 피하고 커다란 융통성을 제공 => d3.js의 근본적
1. 서론 프로젝트 진행 시 한번에 약 40개 정도의 API를 호출을 해야하는 상황이 있었다. 생각만해도 많은 문제가 발생할 거 같았는데, 협업의 요구사항이라서 어쩔 수 없이 진행을 하였다. 역시나 많은 문제가 있었지만, 그 중 운영기 반영 시 여러개의 API 호출 시
서론 개발을 하다보면 특정 node를 선택해서 동적으로 작업을 하는 경우가 있다. 이때 사용하게 되는게 quertSelector, getElementById를 사용하게 된다. 근데 항상 사용할 때마다 이 둘은 무슨 차이가 있는지 궁금해서 궁금증을 해결해 보았다. g
서론 2년 전 개발 공부를 할 때 Git의 중요성에 대해서 많이 듣곤했다. 하지만 개발을 막 시작한 입장에서 어떻게 공부를 해야할지 막막했었다. 그래서 같이 공부하는 동료들과 여러가지 상황을 가정하고 그 상황에서는 어떤 이슈가 발생하는지 하나 씩 테스트 해보고 상황 별
프로젝트를 진행하다보니 특정 화면의(컴포넌트) 전체 (스크롤 아래까지)를 스냅샷 뜨고 싶다는 고객의 요구 사항이 있었다. 지도 지반의 서비스를 구축하고 있어서 고객은 지도까지 완벽하게 나오길 바랬다. 그래서 canvas를 생성하여 png, pdf, print 까지 할
프로젝트를 진행하면서 한번에 최대 40개 가량 API를 호출하여 테이블과 차트를 그리는 상황이 있었다. 어떻게든 index를 먹여서 개발을 완료하고 운영 서버에 배포를 했는데 이게 왠걸?로컬과는 다르게 테이블과 차트의 순서가 엉망이 되어 있었다. 이 문제는 어떻게든 해
글 작성 배경 작년부터 대기업 프로젝트를 Vue를 이용하여 구축하고 있다. 구글 맵 기반으로 구축된 이번 프로젝트를 통해 다양한 문제가 있었고, 그 중에 나를 너무 힘들게 했던 문제들을 하나하나 정리해보고 기록해보려고 한다. 권한 관리 비교분석 비동기 처리 프로젝