Today I learnt

You can create Shortcodes in Gatsby for your components instead of having to import it in every MDX file. That is terrific.

Delete the local .cache file in gatsby if your gatsby develop fails with compilation errors even after you made changes to your imports etc.

---

Nifty way to create a set from values and then a unique array from it.

const set = new Set(['foo', 'bar', 'baz', 'foo']);
Array.from(set);

---

The C chord family - All white keys starting from the middle C.

• C - Major
• Dm - Minor
• Em - Minor
• F - Major
• G - Major
• A - Minor
• B - Diminshed

Memory trick - DEAD - All minor chords.

When playing the C chord, you're playing with three alternatie fingers starting with your thumb on the middle C.

---

Convert a JPG or PNG to svg https://codepen.io/shshaw/full/LVKEdv

When defining a path in svg

• M means move to
• L means line to
• if it ends with a Z, its a closed path
• Capital alphabets - Absolute positioning
• Lowercase alphabets - Relative to previous points
• viewbox - Defines the size of svg, points are plotted relative to this size.
• svg width and height defines how you stretch the viewbox. This implies that everything inside the svg still acts relative to the viewbox dimensions and not the css widht and height. This is why SVG's can behave in a responsive way.