본문 바로가기

전체 글164

10.Rechart Recharts는 React.js를 기반으로 한 데이터 시각화 라이브러리입니다. Recharts는 다양한 차트 유형, 축 스케일링, 사용자 정의 라벨, 축 조절 및 기타 시각화 관련 기능을 제공합니다. 1. Recharts 설치하기 npm install recharts --save 2. Recharts 코드 적용하기 1) import import { ResponsiveContainer, ComposedChart, Line, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, } from 'recharts'; 2) component 추가 2023. 4. 17.
14 모르면 호구 되는 경제 상식[100 ~ 150] 알아도 부자되기 힘들 거 같은데? 결론. 경제 상황의 흐름을 잘 파악하라는 소리지만, 파악하는 팁 정보를 주는 사람은 많은데 실패한 사람도 많은 거 보면.. 뭐 차근차근 열심히 공부해보자!! 모르는 것보다 아는 것이 힘이다. 2023. 2. 23.
03 BookBucket - 내가 읽지 않을 책을 삭제하자!📚[2.21] 3. 읽지 않을 책 삭제하기 1) 삭제 버튼 눌렸을 때 (1) 플러스 버튼 색 변경되고, 체크 버튼 생성 ⓵ minusBtn state 생성 let [minusBtn, setMinusBtn] = useState(false); ⓶ minusBtn 클릭시 상태값 true로 변경 const deleteBefore = () => { setMinusBtn(!minusBtn); }; ⓷ minusBtn이 true일 때 circlePlus class에 on을 부착하고, faSquareCheck -> faSquareMinus 아이콘 변경 // 왼쪽 +버튼 ​ // 오른쪽 -버튼 (2) 포스트 잇에 드롭쉐도우 효과 생김 ⓵ minusBtn 상태값 true일 때 img2 class에 on 붙이기 [main.css] .im.. 2023. 2. 22.
02 BookBucket - 내가 추가할 책을 참고해보자!📚[2.20] 2. Api로 베스트셀러 보여주기 1) 📕 아이콘 눌렀을 때 (1) 베스트 셀러 페이지로 이동 ⓵ router 설치 npm install react-router-dom@6 ⓶ BrowserRouter 컴포넌트를 최상위 태그에 감싸주자. [index.js] import React from "react"; import ReactDOM from "react-dom/client"; //import import { BrowserRouter } from "react-router-dom"; import App from "./App"; const root = ReactDOM.createRoot(document.getElementById("root")); root.render( {/*이렇게 감싸라*/} ); import.. 2023. 2. 21.