Home icon is not showing correctly using font awesome

This is because your the icon is being output outside of the anchors. To fix this issue, add another class, for example my-class to the menu classes. Now, try to position the icon absolutely, and fix the padding:

.fa.my-class::before {
     position: absolute;
     left: 0;
     top: 50%;
     transform: translateY(-50%);
}

.fa.my-class {
     margin-left: 10px;
     padding-left: 10px;
     position: relative;
}