title: How to render dynamic table in React
body: <p><a href="https://i.stack.imgur.com/c4zQO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/c4zQO.png" alt="enter image description here" /></a></p>
  <p><a href="https://i.stack.imgur.com/LTeX3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/LTeX3.png" alt="enter image description here" /></a></p>
  <p>How will I do this kind of table in react? In each projects, there are employees and they have their corresponding positions. But in the project name (Column), on the second row, the 'Project A' should not be displayed.</p>
  <ul>
  <li>Should not be like the second picture, where the 2nd and 3rd row still contains the project name. I want to exclude it and leave it blank.</li>
  </ul>
  <p>Let say I sent a request from the server and it returned this json structure</p>
  <pre><code>[
      {
          &quot;name&quot;: &quot;Project A&quot;,
          &quot;employees&quot;: [
              {
                  &quot;emp_name&quot;: &quot;Employee 1&quot;,
                  &quot;emp_pos&quot;: &quot;Position 1&quot;
              },
              {
                  &quot;emp_name&quot;: &quot;Employee 2&quot;,
                  &quot;emp_pos&quot;: &quot;Position 2&quot;
              }
          ]
      },
  
      {
          &quot;name&quot;: &quot;Project B&quot;,
          &quot;employees&quot;: [
              {
                  &quot;emp_name&quot;: &quot;Employee 5&quot;,
                  &quot;emp_pos&quot;: &quot;Position 2&quot;
              },
              {
                  &quot;emp_name&quot;: &quot;Employee 3&quot;,
                  &quot;emp_pos&quot;: &quot;Position 4&quot;
              
              }
          ]
      }
  ]
  </code></pre>
  <p>I'm not sure, if the structure of my json file is correct.</p>