One thing I have done in cases like this, where management of the content isn’t reasonable in metafields (like if there would need to be 100 individual ones), is to use another CMS (in my case sanity.io) to manage the additional content and relate it to Shopify products. The CMS calls a webhook when the content is modified. The webhook writes a JSON object with all the data into a Shopify metafield. Then I use liquid to read the JSON and output it as I need to in various snippets. I use the Mesa app to get the webhook data and write it to the Shopify metafield.
You could of course use React or similar and have components fetching the data from the CMS as well. But the approach above has been relatively easy for me once I get things setup and then the content is all in the generated product page markup.
There is an app that connects Sanity to Shopify which makes it easy to extend the Product schema in Sanity to have whatever kind of fields you need. And the content management experience for users on Sanity is great…very easy to manage a lot of data and different data types.