NPM 라이브러리 배포(TypeScript, CommonJS, ESM)
·
Frontend/React
서론프로젝트를 진행하면서 다양한 기능을 가진 여러 함수들을 제작하게 되었고 그중 다른 프로젝트에서도 사용 가능한 유틸 함수를 NPM에 배포해보려고 한다.배포하려고 하는 유틸 함수는 주어진 기본 색조 값을 기반으로 유사한 색상 범위에서 무작위 색상을 생성하는 함수입니다. Gradient 효과를 위해 여러 색상을 만드는 데 사용할 수 있으며 색상은 HSL(색조, 채도, 명도) 값을 기반으로 합니다.여러 자료를 찾아보며 CommonJS, ESMAScript에서 모두 적용 가능하도록 배포를 진행했다.배포폴더 구조└─ 📦 src ├── 📂 dist ├── 📂 src │ ├── index.ts ├── build.js ├── package.json ├── tsconfig.jsonesbuild를 이..
자바스크립트 기반 차트 라이브러리 비교 (ApexCharts vs ECharts vs D3.js)
·
Frontend/React
서론프로젝트를 진행하면서 여러 차트 라이브러리를 사용해 보았습니다. 프로젝트마다 명확한 기준 없이 라이브러리를 사용하다 보니 각 차트 라이브러리의 특징을 정리해 볼 필요성을 느꼈습니다. 특히 ApexCharts를 사용한 프로젝트에서 많은 양의 데이터를 렌더링 할 때 성능이 매우 느린 문제가 있었습니다. 이후 ECharts로 변경 후 렌더링 성능이 개선되었지만 왜 이런 차이가 발생했는지 궁금해졌습니다.브라우저에 그림을 그리는 방법차트를 그리는 방식은 크게 SVG 또는 Canvas 두 가지 방법이 있습니다.차트 라이브러리 또한 이 두가지 방식 중 하나를 택하게 됩니다.SVG와 Canvas 비교자세한 내용은 SVG Vs. Canvas: A Comparison를 참고해 주세요.SVG (Scalable Vecto..
[Flutter] Stack 위젯의 onTap 인식 오류
·
Mobile/Flutter
구현Stack 위젯의 자식으로 Container와 Positioned이 위치하는 일반적인 카드 형태의 UI를 구현했다.문제점삭제 버튼을 클릭했을 때 이벤트가 정상적으로 실행될 때도 있지만 그렇지 않을 때도 있다.처음에는 삭제 버튼을 구현하기 위해 사용한 Badges 패키지에서 발생한 오류로 생각하여 해당 패키지를 사용하지 않고 구현해보기도 하고 Badge 패키지를 Gesturedetector 위젯으로 감싸기도 했지만 여전히 제대로 작동하지 않았다. 구글링 끝에 에러 원인을 찾았다. Flutter Issue Fixed: onTap Gesture isn’t recognised in Stack if the child widget is outside of its…Have you ever faced issues ..
Moon Hayden
'분류 전체보기' 카테고리의 글 목록