본문 바로가기

JavaScript/React2

[React] D3 D3는 Data Driven Documents의 약자로써 D가 3개라는 뜻이라고 한다. 데이터 시각화 Javascript 라이브러리로, 데이터를 바탕으로 HTML의 DOM을 직접 조작하는 것이 특징이다.  나는 여기서 D3는 DOM을 직접 조작하고,React는 Virtual DOM으로 문서를 조작하기 때문에 서로 충돌되는 부분이 있을 것이라고 생각이 들었다.  그래서 찾아보니 오히려 시너지가 나는 부분이 있다고 한다. React가 D3에게 DOM을 제공하고 D3는 이것을 받아서 데이터를 화면에 그려내면 React Hooks의 상태관리 기능과 D3의 데이터 시각화 기능을 한꺼번에 활용할 수 있기 때문이다. 그러니까 한 마디로 하자면, 리액트의 장점인 반응형으로 데이터 시각화를 이루어낼 수 있다는 것이다. .. 2024. 7. 26.
[React] React 맥(Mac os) VSCODE 리액트 프로젝트 생성하는 방법(개발환경 세팅) 1. Node.js 설치https://nodejs.org/ko/ Node.jsNode.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.nodejs.org위 노드.js 공식 홈페이지로 들어가 LTS 버전으로 설치한다. 최신 버전을 설치해도 되긴 하지만 간혹 오류가 있을 수 있기 때문에, 권장하는 설치 버전은 안정적인 LTS 버전이다.- 스트레스 없는 리액트 환경 개발을 위해선 LTS 13.xx 이상, 17.xx 이하 버전을 쓰는 것이 정신 건강에 좋다고 한다.- 노드.js 설치할 때 설치 경로는 변경하지 말고 기본 세팅대로 그대로 설치해주면 된다. 2. 리액트(React) 프로젝트 생성노드.js 설치가 끝났다면 이제 VScode에서 신.. 2023. 6. 29.