React-spinners

intro

오늘 사용해본 라이브러리는 "react-spinners"입니다.

사이트에 접속하면 다양한 모양의 스피너가 있습니다. 

https://www.davidhu.io/react-spinners/

 

데이터를 불러오는 로딩 시간동안 띄우기 위해 사용했습니다.

---

install

npm install --save react-spinners

---

code

import { PuffLoader } from "react-spinners";

// 컴포넌트
{isLoading ? (
  <PuffLoader size={200} color="#368ed6" />
    ) : (
  <>
    ...
  </>
)}

색이나 사이즈 등 스타일 변경이 가능합니다.

---

결과

프로젝트할 때 유용하게 써먹을 수 있을 듯합니다. good

데이터 불러오는 중