본문 바로가기

~2023

[React] React Icons 사용하기

728x90
반응형

React에서 제공하는 모듈을 사용해 다양한 아이콘을 가져오자.

공식 문서 및 아이콘 리스트를 보고 싶다면 여기를 클릭!

 

우선 모듈을 설치해야 한다.

$ npm install react-icons

 

사용 예제 코드

import { FaBeer } from 'react-icons/fa';
class Question extends React.Component {
  render() {
    return <h3> Lets go for a <FaBeer />? </h3>
  }
}

 

beer 검색 결과

Beer 검색 시 여러 종류의 Beer 이미지가 나오는데 사용 예제에서는 Font Awesome에서 제공하는 FaBeer를 사용했다. Fa의 Beer인 FaBeer를 사용했기에 from 'react-icons/fa'라고 선언한 것이다.

이것을 확장해서 생각해보면 BiBeer를 사용하고 싶은 경우 '../fa'가 아니라 '../bi'로 선언해주면 된다.

 

 

 

 

 

728x90
반응형