본문 바로가기

Ect.31

클라이언트 데이터 상태 관리를 위한 Recoil Recoil 은 React 상태 관리 라이브러리 리액트에서 상태를 관리하기 위해 일반적으로 상태를 컴포넌트 내부에서 관리하거나 Redux 같은 라이브러리를 사용해준다. 다만 리덕스는 보일러플레이트 코드가 많고 컴포넌트와 액션 사이의 연결을 설정하는 작업이 번거로워 이러한 불편함을 해결해주기 위해 리코일을 사용하는 추세라고 한다. 리코일은 상태값을 저장하고 업데이트하는데 사용되는 Atom 과 이를 기반으로 다른 값을 계산하는데 사용하는 Selector로 구성된다. Recoil의 특징 중앙 집중화된 상태 관리 상태가 어디에서 변경되었는지 추적하고 컴포넌트간 일관성 있는 데이터 흐름을 유지 가능 비동기 상태 관리 useRecoilCallback 훅으로 비동기적인 상태 업데이트가 가능하다 상태 업데이트 최적화 .. 2023. 7. 22.
Cornerstone3D 란 HTML5 캔버스 요소를 지원하는 최신 웹 브라우저에서 의료 이미지를 시각화하기 위한 경량 자바스크립트 라이브러리 JPEG Lossless와 같은 다양한 압축 형식을 포함한 모든 전송구문 렌더링 볼륨 슬라이스를 스트리밍하고 로드되는 동안 실시간으로 확인 전체 볼륨을 다시 로드할 필요없이 축상, 시상면 및 관상면과 같은 다른 방향에서 동일한 볼륨 - 최소 메모리 공간 볼륨에서 비스듬한 슬라이스 보기 동일한 볼륨의 서로 다른 블렌드 렌더링 PET/CT 융합과 같은 여러 이미지 융합 및 오버레이 컬러 이미지를 렌더링하고 볼륨으로 렌더링 GPU 렌더링을 사용할 수 없는 경우 CPU 렌더링으로 폴백 뷰포트에 대한 메타데이터 중 픽 WebGL 을 사용한 GPU 가속 렌더링 웹 표준을 사용하여 의료 이미지의 3D 렌.. 2023. 7. 20.
에러 Fix the upstream dependency conflict, or retrynpm, this command with --force or --legacy-peer-deps 요즘 프로젝트 세팅하며, 프로젝트에 사용될 라이브러리를 설치하고 지웠다를 반복하고 있다. 그중에서도 뭐만하면 자꾸 참조가 꼬이는데... 도대체 왜 뜨는걸까? npm 7 버전부터 생긴 이슈라는데, https://github.blog/2021-02-02-npm-7-is-now-generally-available/ 그 이전 버전에서는 종속성끼리 서로 버전이 호환되지 않는다는 경고만 표시하고 오류 없이 설치했다고 한다. npm 7 이후로 자동으로 해결할 수 없는 종속성 충돌이 있는 경우 설치를 차단해준다고 한다. 물론 해결 방법은 쉽다. 위에 보이는 내용처럼 npm install 과 --force 또는 --legacy-peer-deps 를 같이 써주면 된다. 둘의 차이점은? --force 는 충돌의 우회하는 명.. 2023. 7. 19.
Toast UI (feact. React) 사용기 3 - Grid 테이블을 만들자 언제나처럼 설치부터 npm install --save @toast-ui/react-grid import 'tui-grid/dist/tui-grid.css'; import Grid from '@toast-ui/react-grid'; 예제를 보며 적용해보기 https://github.com/nhn/tui.grid/tree/master/packages/toast-ui.react-grid const data = [ { id: 1, name: "Editor" }, { id: 2, name: "Grid" }, { id: 3, name: "Chart" }, ]; const columns = [ { name: "id", header: "ID" }, { name: "name", header: "Name".. 2023. 7. 13.

티스토리툴바