React test

README.md

React dynamic table test

Write us a code to create your dynamic table written in react JS. Your code should be following these rules

• props should be defined by proptypes
• clean code
• native component in react JSX (should not using library)
• data fetching use this api

Motivation

This component will be used for developers who wants to map their delivered data in array, and doesn't want to create their header, body, and footer inside a HTML table with their stuff, so the developers just write a code like

return (
  <YourDynamicTables 
    header={['name', 'price', 'decimal']}
    data={resultData}
    FooterComponent={
      <div>My Code!</div>
    }
  />
)

example:

const [res, setRes] = useState([])

const getData = async () => {
  const tmpRes = await fetch(`${apiBaseUrl}/products?page=1&limit=5`)
  const productData = await tmpRes.json()
  return productData
}

useEffect(() => {
   const init = async () => {
    const data = await getData()
      setRes(data)
   }
}, [data])

return (
  // your component should be here
  <YourDynamicTables 
    header={['name', 'price', 'decimal']}
    data={resultData}
    FooterComponent={
      <div>My Code!</div>
    }
  />
)

if you have a question, please write your issue. We will answer your question, UI/UX is not our priority, so you can write your component without style, we just analize your logic skills

Additional information

• You can do a code using CodeSandbox or with your own code editor
• If you're using your own code editor, please push your code into github then notice us an email (nvp.d3v@gmail.com)
• If you're using CodeSandbox you can share the link to our email (nvp.d3v@gmail.com)