React Feather Icons を使用した簡単な方法

手順1: プロジェクトに React Feather Icons をインストールする

React Feather Icons を使用するには、まずパッケージをインストールする必要があります。npm を使用してインストールする場合は、以下のコマンドを実行します:

npm install react-feather-icons

手順2: アイコンをコンポーネントとして使用する

インストールが完了したら、React コンポーネント内で Feather Icons を使用することができます。以下の例では、FeatherIcon コンポーネントを使用して、ハートのアイコンを表示しています。

import React from 'react';
import FeatherIcon from 'react-feather-icons';
function App() {
  return (
    <div>
      <FeatherIcon.Heart />
    </div>
  );
}
export default App;

上記の例では、FeatherIcon.Heart を使用してハートのアイコンを表示しています。他のアイコンを表示する場合も同様に、FeatherIcon コンポーネントを使用してアイコンを指定します。

以上が React Feather Icons の基本的な使用方法です。必要に応じて、アイコンのサイズや色などをカスタマイズすることもできます。詳細な使い方については、React Feather Icons の公式ドキュメントを参照してください。