gistfile1.txt

export const FONTS = [
  { name: 'Abril Fatface', type: 'Classical', noItalic: true, noBold: true, designer: 'TypeTogether' },
  { name: 'Abys', type: 'Handwriting', src: 'local', noItalic: true, noBold: true },
  { name: 'Alegreya', type: 'Classical', url: 'Alegreya:ital,wght@0,400;0,700;1,400;1,700', designer: 'Huerta Tipográfica' },
  { name: 'Alegreya Sans', type: 'Modern', url: 'Alegreya+Sans:ital,wght@0,400;0,800;1,400;1,800', designer: 'Huerta Tipográfica' },
  { name: 'Anonymous Pro', type: 'Modern', designer: 'Mark Simonson' }
]

function getGoogleFonts () {
  const fonts = []

  FONTS.forEach(font => {
    if (font.src === 'local') {
      return
    }
    fonts.push(getUrlNormalizedName(font.name))
  })

  return `https://fonts.googleapis.com/css?family=${fonts.join('|')}&display=swap`
}

// Dans le html, on load toutes les fonts Google d'un coup
<link href={getGoogleFonts()} rel='stylesheet' />

// Afficher les fonts

export function getFontFamilyName (font) {
  return '"' + font.name + '", ' + font.type.replace(/\s/g, '-').toLowerCase()
}

{FONTS.map(font => (
  <div style={{ fontFamily: getFontFamilyName(font) }}>{font.name}</div>
))}