[TIL] 엘리스 SW 엔지니어 트랙 Day 073
반응형
📖 오늘 배운 내용 - 2022.02.09
- 리액트 조건부 렌더링
- Recharts 사용법
- svg 파일 줄이기
📝 리액트 조건부 렌더링
[React] 리액트 조건부 렌더링 방법
🎯 리액트 조건부 렌더링 import React from "react"; import * as FarmPictures from "./style"; export function FarmPicture({ ratio }) { const Render = () => { if (ratio >= 20) { return ; } else if (ra..
lakelouise.tistory.com
📝 리액트 차트 라이브러리 :: Recharts 사용법
[React] 리액트 차트 라이브러리 :: Recharts 사용법
🎯 Recharts 사용하기 프로젝트에서 데이터 시각화하는 부분을 마크업 하게 되었다. 아래 링크에서 사람들이 많이 사용하는 차트 라이브러리 리스트를 보면서 장/단점을 검색한 후 심플하고 사용
lakelouise.tistory.com
📝 svg 파일 줄이기
여러 SVG 파일 크기를 신속하게 무료로 조절하세요!
SVG 이미지 크기를 무료로 조절하세요! 픽셀 또는 퍼센트를 지정하여 SVG 이미지 크기를 변경하세요.
www.iloveimg.com
💡 오늘 깨달은 것
- webp 확장자를 이용하면 더 압축된다. webp 파일을 s3에 올려서 사용하는 방법도 있다.
- 테스트 코드는 처음부터 넓은 범위로 작성할 경우 오류가 날 확률이 높다.
- 테스트의 범위는 util -> component -> page로 범위를 점차 넓혀가는 편이 좋다.
- 즉, 컴포넌트로 만든 것만 테스트하는 것이 좋다. ⇒ 작은 단위부터 테스트!(unit 테스트)
- 각 기능의 장/단점을 생각하고 우리 서비스에 적합한 기술을 선정해야 된다. => 항상
왜?라는 질문을 가지고 이 기능을 선택한 이유, 이 라이브러리를 선택한 이유를 찾고 결정! - Recharts는 커스텀하기 편했고 사용법이 간단했다.
- 이제는 공식 문서 울렁증이 사라지고 있는 거 같다.
📌 참고
반응형
'프로그래밍 > Today I Learned' 카테고리의 다른 글
| [TIL] 엘리스 SW 엔지니어 트랙 Day 075 (0) | 2022.02.15 |
|---|---|
| [TIL] 엘리스 SW 엔지니어 트랙 Day 074 (0) | 2022.02.15 |
| [TIL] 엘리스 SW 엔지니어 트랙 Day 072 (0) | 2022.02.10 |
| [TIL] 엘리스 SW 엔지니어 트랙 Day 071 (0) | 2022.02.08 |
| [TIL] 엘리스 SW 엔지니어 트랙 Day 070 (0) | 2022.02.08 |