Skip to content

Create a list of links from an array using Intl.ListFormat with formatToParts

Open demo in a new tab 
const tags = ["HTML", "CSS", "JavaScript"];

{
  new Intl.ListFormat("en-US").formatToParts(tags).map(({ type, value }) => {
    if (type === "element") {
      return <a href={`/${slugify(value)}`}>{value}</a>;
    }
    return value;
  });
}

which returns the following markup:

<a href="/html">HTML</a>, <a href="/css">CSS</a>, and
<a href="/javascript">JavaScript</a>