Also display it... Nicely formatted.

Could use a filter (=Angular Pipe). See example in 02-Snippets/06-Filters.html.
Or could use computed property?

Icon: <i class="fa fa-star-half-o"></i>

With e a mousemove event

function getPosition(e) {
  var rect = e.target.getBoundingClientRect();
  var x = e.clientX - rect.left;
  var y = e.clientY - rect.top;
  return {  x,  y };

  // e.target.clientWidth
}

JSFiddle

Disable the button when the color is not present in the cart.

Add to cart should only be enabled when there are socks in that color left in the inventory

• Installation: node-sass issue with Webstorm?
• Improve readme (only list commands that need to be run to get started)
• <product ...> zet elk attribuut op aparte lijn voor minder merge conflicts
• de cart is gedefinieerd als een array van string[] maar is nu het volledige product obj (wijzig naar id?)
• maak een model voor Product voor type safety
• Angular.jpg vs angular.jpg filename vs brandname
• Exercises.md 5E en 5F staan op dezelfde lijn
• Exercise 5A is pretty much already done in store.ts (in comment)
• Generate the issues from a json file?
• run linter on all files