FontAwesome is the internet’s most popular icon toolkit which has been redesigned and built from scratch. On top of this, features like icon font ligatures, an SVG framework, official NPM packages for popular frontend libraries like React, and access to a new CDN.
In this post, I am going to show you how to configure fontawesome to be used in angular in only 5–1 steps.
In these steps, we will configure fontawesome using the specific Angular package. In a previous post, it was configured using the old way which consists in including CSS.
If you are thinking about using fontawesome in your angular project, you probably have an initialized project already. However, for this tutorial, let’s start with our project from scratch.
Add FontAwesomeModule to imports in src/app/app.module.ts:
Tie the icon to the property in your component src/app/app.component.ts:
Open your template’s component and add the fontawesome CSS class in any of the html elements:
Run your app:
The GitHub branch of this post is https://github.com/Caballerog/angular-fontawesome-2
Posted on by:
React TypeScript - How To Set Types on Hooks (+cheat sheet)
Ibrahima Ndaw -
Build a Landing Page with Chakra UI - Part 1
Jim Raptis -
10 Time Management Tips for the Developer Who Wants It All Now
Dennis O'Keeffe -
Breaking into Web Dev – The No Jargon Guide – Article 2 – Making your first Website Live