JSFiddle - React, Tailwind, and code Playground
CSS
body {
font-family: Arial;
font-size: 1.5em
}
JavaScript
const gridArray =
[[`a`, `b`, `c`],
[`d`, `e`, `f`],
[`g`, `h`, `i`]]
let gridTemplate = ``
gridArray.forEach(function(el) {
gridTemplate += `"${el}"`
})
while(gridTemplate.includes(`,`)) {
gridTemplate = gridTemplate.replace(`,` , ` `)
}
document.querySelector(`p`).textContent = `\'This is the gridTemplate: ${gridTemplate}.\'`
document.querySelector(`p`).style.gridTemplateAreas = gridTemplate;