Dynamically Adding FontAwesome Icons in NextJS

There are a diverse ways in adding FontAwesome in a NextJS Project.

Here is my favourite and most recommended approach.

Install the following:

---

1. 👉 React FontAwesome

npm install @fortawesome/react-fontawesome

or

yarn add  @fortawesome/react-fontawesome

---

2. 👉 FontAwesome SVG Core

npm install @fortawesome/fontawesome-svg-core

or

yarn add  @fortawesome/fontawesome-svg-core

---

3. 👉 Fontawesome Free SVG Solid Icons

npm install @fortawesome/free-solid-svg-icons

or

yarn add  @fortawesome/free-solid-svg-icons

---

4. 👉 FontAwesome Free Brand Icons

npm install @fortawesome/free-brands-svg-icons

or

yarn add  @fortawesome/free-brands-svg-icons