📃데이터 분석 🧐차트 시각화 💚Recharts.js https://recharts.org/en-US/ 이전 포스팅에서 Recharts 라이브러리를 소개해드렸는데요. Recharts를 이용해서 웹사이트에 리액트로 데이터 분석한 데이터 결과를 그래프를 통해서 시각화 작업을 할 수 있습니다. 현재 진행 중인 데이터셋을 분석하고 난 후 실제로 작업한 그래프를 보면서 Recharts 커스터마이징을 어떻게 해야 할지 아이디어 얻어가셨으면 합니다. 🔷 데이터 분석 시각화 작업물 _ 원형 차트, 방사형 차트 Recharts에 있는 Pie chart를 통해서 데이터 시각화를 할 경우 해당 값들의 비율을 시각적으로 한눈에 확인할 수 있습니다. 그리고 hover를 통해서 마우스를 해당 영역에 올릴 시 해당 데이터명이 차트 ..

🌟 Recharts 📊리액트 차트 🌌 라이브러리 https://github.com/recharts/recharts 🔷 Recharts란? 리액트로 차트를 작성할 때 사용할 수 있는 라이브러리 중 하나가 recharts이다. recharts는 예시 그래프가 풍부해서 원하는 그래프를 데모를 보면서 정할 수 있다. 또한 예시 코드 또한 사이트에 제공이 되어서 가볍게 커스터마이징을 해서 원하는 그래프로 편하게 사용할 수 있다. 차트마다 자세히 보면 애니메이션 효과도 적용이 되어 있어서 시각적으로 흥미를 유발할 수 있는 좋은 차트 라이브러리이다. 🔶 Recharts 설치 방법 및 에러 발생시 해결법 //* 방법1 npm 이용 설치 //! dependency 에러 뜰수 있음 $ npm install recharts..

⏹️ MUI 💙Material UI 라이브러리 https://opentutorials.org/course/1 https://mui.com/ MUI: The React component library you always wanted MUI provides a simple, customizable, and accessible library of React components. Follow your own design system, or start with Material Design. You will develop React applications faster. mui.com 🔷 mui 설치 npm install @mui/material @emotion/react @emotion/styled 터미널에 명령어..

📃 React 💻 생활코딩 ✍ 강의 메모 https://opentutorials.org/course/1 🔷 1. 수업소개 react의 핵심적인 역할은 사용자 정의 태그를 만드는것 부품을 만들고 공유하고 남들의 부품을 사용할 수 있음 🤔 react를 만드는 방법? class vs function 두가지 방법이 있고 function으로 만드는 방법 ㄱㄱ 🔷 2. 실습환경구축 (설치) react 공식문서를 참고하면 react에 대해서 자세히 알아볼수있음 참고링크 : https://ko.reactjs.org/docs/create-a-new-react-app.html#create-react-app 새로운 React 앱 만들기 – React A JavaScript library for building user in..