stuartpearman
5/17/2018 - 5:39 PM

Loader.js

import React from 'react'

const Loader = () => {
  // This is a plain 'ol javascript object, but it could easily
  // be parsed JSON from an API

  const componentList = [
    {
      name: 'Test',
      content: 'I am some text',
      props: {}
    },
    {
      name: 'Test2',
      content: 'I too am some text 2',
      props: {}
    }
  ]

  // Ditch the JSX syntax to allow us to build the component
  // dynamically

  const components = componentList.map((component, i) =>
    React.createElement(
      // load in the component with require (this needs to be
      // compiled using webpack or similar)
      require(`components/${component.name}`),
      {...component.props, key: i},
      component.content
    )
  )

  return <div>{components}</div>
}

export default Loader