React Icon Library (Lucide Icons) 사용법

리액트에서 유용하게 사용하는 Lucide Icons을 알아보자!

아이콘 찾는 것도 솔직히 정말 귀찮은 편인데, 리액트에서 제공하는 Lucide Icons를 사용하면 손쉽게 사용이 가능하다.

패키지 설치 방법

• 링크: https://lucide.dev/guide/installation 터미널에 아래의 명령어를 입력한다.

// yarn
yarn add lucide-react

// npm
npm install lucide-react

사용 방법

2-1) 링크 이동

https://lucide.dev/icons/

2-2) 아이콘 Custom, 선택

• 좌측에 Customizer 에서 컬러,사이즈,굵기를 설정할 수 있다.
• 우측에 아이콘을 클릭한다.

2-3) import 및 사용법

아이콘을 클릭한 후 See in action 버튼을 클릭하면, 언어에 따라 사용코드가 있어서 참고해서 적용하면 된다.

마무리

이번에 같은 조원을 통해 편리한 라이브러리를 알게 되어서 너무 좋았다. 팀 프로젝트를 진행하며 서로 몰랐던 것을 공유하고 새롭게 알아가는 과정이 너무 즐겁다.