React table with JSON
There isn't much code to break this down to smaller components but based on the post : 

this.setState() passing an Object or a callback function :

If you want to update the state with a value that's not dependent on the previous one you can do :

this.setState({ key : newValue });


If you have to update the state based on the previous one, 

this.setState(prevState =&gt; ({key: prevState.key + value }));


see state updates may be asynchronous for more details.

the reason why i mention this is because in componentDidMount() you're passing a callback function to setState when you don't need the the prevState.

componentDidMount() {
  this.setState({ json: getJson() })
}


In checkAll() you can do one setState() instead of two: 

checkAll = () =&gt; {
   this.setState(prevState =&gt; ({
     checked: !prevState.checked,
     json: prevState.json.map(obj =&gt; ({
       ...obj,
       items: obj.items.map(item =&gt; ({
         ...item,
         value: prevState.checked,
       }))
     }))
   }));
};


Use implicit return  in the render method :

the render method can use implict returns inthe .map() and you don't really need the i, it can be refactored to :

render() {
  return (
    &lt;div&gt;
      &lt;table&gt;
        &lt;tbody&gt;
          {this.state.json.map(obj =&gt; (
            &lt;tr key={obj.id}&gt;
              {obj.items.map(data =&gt; ( 
                &lt;td key={data.id}&gt; 
                  &lt;p&gt;{data.label}&lt;/p&gt;
                    &lt;input 
                      type="checkbox" 
                      checked={data.value}
                      onChange={this.checkboxHandler}
                    /&gt;
                &lt;/td&gt;)
              )}
            &lt;/tr&gt;)
          )}
        &lt;/tbody&gt;
      &lt;/table&gt;
      &lt;button onClick={this.checkAll}&gt;check\uncheck&lt;/button&gt;
      &lt;AddRow actualJson={this.state.json}/&gt;
    &lt;/div&gt;
  )
}