イケてるアイコンを利用してみた話
はじめに
優秀な同期の横田くんにReactでイケてるアイコンを使う方法を教えてもらったので、紹介します。
使い方
まずパッケージをインストールします。
npm install --save react-icons-kit
あとは、このページから良さそうなアイコンを選びます。

気に入ったアイコンがあったら、クリックすると以下のようにコードが出現します。

これを利用して以下のようなコードを書きます。
create-react-appして、App.jsを上書きするのが一番簡単な試し方かもしれません。
import React from 'react';
import logo from './logo.svg';
import './App.css';
import { Icon } from 'react-icons-kit'
import { quill } from 'react-icons-kit/icomoon/quill'
function App() {
return (
);
}
export default App;
すると、以下のようにアイコンを利用することができます。

おわりに
このイケてるアイコンなら、唐口くんの記事のヤコブ・ニールセンのユーザビリティ 10 原則もやりやすそうです。 このアイコンをたくさん利用して、かっこよくてUXが良いアプリを作成したいですね。