Googling/javascript

Googling/javascript

[JavaScript] 오픈소스 활용 json 엑셀파일로 내보내기 (feat. SheetJs)

협업툴 서비스를 개발하면서, 업무 목록을 엑셀로 내려받을 수 없냐는 문의도 많았고, 어드민에서 각종 통계 데이터들을 수시로 엑셀로 내려받고 싶다는 니즈가 있었다. 서버 단에서 엑셀을 내려주는 모듈 같은게 있긴 했는데 쓰기가 매우 어렵고 뷰 화면을 따로 그려서 다운 받는 방식이라 간단하다고 느껴지지 않았다. 분명, json 데이터를 간단하게 excel로 다운받을 수 있는 오픈소스가 있을거라고 생각했다. 찾아보니 SheetJS라는 오픈소스는 엑셀과 관련한 엄청나게 많은 기능을 가진 javascript 오픈소스가 있었다. 하지만, json을 엑셀로 손쉽게 내려받을 수 있는 방법을 찾지 못했다. (2019년 상반기쯤 찾아봤을때 기준) 그래서 안에 있는 기능들을 활용하여 우리 팀이 쓰기 좋게 함수를 하나 만들어야..

Googling/javascript

[Javascript] Body에서 Drag & Drop 활용하기

자바스크립트로 선언하여 document 에서 dragenter, drop 등의 이벤트를 제어하려고해도 제대로 작동않는 경우가 있다. 직접 경험한 예로 전체 영역에 파일 드래그 앤 드랍을 통한 업로드를 구현하려 할때 로직을 제대로 타지 않고 새창에서 파일을 로딩해버리는 경우가 생겼었다. 이 때, 간단하게 바디태그에 retern false 처리를 해주면 제대로 작동한다. Drag & Drop Area

Googling/javascript

[Javascript] 배열 (array) 자르기 - slice()

const sliceArray = [1,2,3].slice(1,3) 두 개의 인자를 모두 선택적으로 활용하는데 첫번째 인자 undefined 시에 0으로 작동하고 두번째 인자 undefined 시에 배열의 길이로 작동한다! 정확하게는 첫번째 인자에 해당하는 인덱스부터 두번째 인자에 해당하는 인덱스 이전까지이다. (이 부분이 가끔 생소하게 다가온다 ㅎ) 여기서 slice()를 인자없이 쓸 수도 있는데 이 경우 결과값이 동일하여 무쓸모라 생각할 수 있는데 slice() 활용시 새로운 객체가 리턴되는 것이 핵심이기 때문에 복사 용도로 활용할 수 있다! const animals = ['ant', 'bison', 'camel', 'duck', 'elephant']; console.log(animals.slice(..

날개단
'Googling/javascript' 카테고리의 글 목록