JSFiddle - React, Tailwind, and code Playground

HTML

<span class="comma-list">
  <span class="item">
    Foo
  </span>
  <span class="item">
    Bar
  </span>
  <span class="item">
    Baz
  </span>
</span>

CSS

.comma-list {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.item::before {
  content: ', ';
}

.item:first-child::before {
  content: '';
}

.item:last-child::before {
  content: ', and ';
}